El Comercio Digital

Webmaster Libre

Desarrollo Web con Software Libre

Estás navegando por el archivo de la categoría Trucos y Consejos

4 consejos que me hubiera gustado recibir cuando empecé a crear sitios web

Ha pasado mucho tiempo desde que abrí por primera vez un editor de HTML. En este tiempo he aprendido más cosas por testarudez que por capacidad y, este tipo de aprendizaje prueba-error2 es, sobre todo, frustrante. Sin duda, lo que yo habría agradecido más no son tanto los tutoriales como algún consejo de corazón, basado en la experiencia y no en lo que dice este o aquel consorcio.

Como se suele decir, haz lo que te gustaría que hiciesen por ti y aquí voy, mi humilde aportación para los que empezáis.

  1. Que se vea bien en tu ordenador no quiere decir que se vaya a ver bien en todos

    Repítelo como un mantra porque ese será el mayor de tus problemas, hacer que tus sitios web se vean bien en todos los navegadores de todos los sistemas operativos o casi…

  2. Los enlaces que incluyen “Mis Documentos” en la ruta no suelen estar bien

    Usar editores WYSIWYG puede estar bien pero procura comprobar las rutas de todas las partes de tu sitio no vaya a ser que el editor te haya hecho una mala pasada enlazandote con un archivo local. Por supuesto eso de comprobarlo sobre el sitio no suele funcionar ya que, desde tu ordenador, se verá divinamente. Con lo que volvemos al punto uno.

  3. No reinventes la rueda

    El HTML y el CSS son el fruto del trabajo de decenas de desarrolladores de todo el mundo, ellos saben más que tú y que yo, no tiene sentido inventar tu lenguaje o crear estilos sin ton ni son a base de clases y divs. Igual que deberías conocer el idioma que hablas deberías conocer todas las etiquetas a tu disposición y como usarlas.

  4. Todo tu mal código volverá para morderte

    Para seguir con el punto 3, aprende como funciona esto cuanto antes o todos tus “pequeños deslices” volverán para castigarte, sobre todo si tienes que editar una página html dentro de unos meses. Todos la liamos en ocasiones, si te sales mucho del guión déjate comentarios explicativos. No sabes lo fácil que uno olvida algunas cosas, lo que hoy es claro como el agua mañana seguramente será un jeroglífico de etiquetas.

Y dado que confío que entre mis queridos lectores haya gente más sabia y experimentada que yo, ahí os dejo los comentarios por si queréis dejar vuestro consejo a los más inexpertos.

Trucos y Consejos

13 Comentarios

Que no te timen con tu dominio

Parece mentira que, con la importancia que tiene un dominio para un sitio web o una identidad corporativa, aún se puedan realizar estafas que acaban despojandote del mismo.

Publican hoy en Download Squad un interesante artículo sobre este tipo de timos, estafas y demás problemas que suelen surgir cuando la persona que quiere registrar el dominio tiene pocos conocimientos sobre la materia.

Vendedor de "Snake Oil" un timo ancestral Entre las posibles situaciones que pueden acarrearnos problemas de este tipo, hay algunas que no van más allá del típico timo de toda la vida: esa ventajosa oferta (terriblemente ventajosa) que te llega de ninguna parte y te sugiere que cambies de tu registro actual a su servicio. Por supuesto, una vez transferido el dominio adios a la empresa, la oferta y la ventaja…

No obstante, más allá de estos “timos” existen otra serie de circunstancias más comunes e igualmente peligrosas:

  • Dejar de tener acceso al correo electrónico con el que registramos el dominio
  • Trabajar con un agente registrador poco profesional que llegue a olvidar a quien pertenece cada dominio (suena raro pero no es para nada extraño que una mala gestión de nuestro agente nos lleve a un desastre)
  • Permitir a terceras personas (o compañías) que registren nuestro dominio. Es realmente fácil que una compañía desaparezca del mapa en menos que canta un gallo o que, simplemente, no quieran devolvernos el dominio (que técnicamente es suyo al estar registrado a su nombre).

Nadie está libre de encontrarse en una mala situación de estas, incluso tomando todas las precauciones (recordad el caso de aquel Carlos Sobera contra el otro), pero lo que queda claro es que el desconocimiento es el principal aliado de los desastres.

Sé que, en ocasiones, por comodidad preferimos dejar estas gestiones a terceros y dedicar nuestro tiempo a cosas más agradables pero ¿Sabéis el tiempo que puede llevar recuperar un dominio robado? En el caso de que se pueda recuperar, claro…

Para informaros de como recuperar un dominio “robado” leed el artículo original, en inglés, donde encontraréis unos cuantos enlaces y el procedimiento a seguir: Scammed out of your domain?

Trucos y Consejos

3 Comentarios

Creando buenas páginas de error

En Coding Horror han publicado un interesante artículo sobre las páginas de errores 404. Supongo que la mayoría (por no decir todos) los que seguis este blog sabéis perfectamente lo que significan: Página no encontrada.

Las páginas de error son frustrantes para nuestros visitantes, no encontrar algo que estaban buscando puede conducirles a abandonar nuestro sitio si no sabemos manejar los errores con elegancia. En Coding Horror nos dan 5 consejos, unos más sencillos de seguir que otros, para crear páginas 404 con sentido. Aquí tenéis una traducción libre y resumida de los mismos, con algunas aportaciones mías:

  1. Elimina el 404: Tanta jerga técnica puede contribuir a que nuestros ya perdidos usuarios se pierdan aún más. Donde digo 404 digo 301 etc. Cualquier página de error que vaya a ser mostrada a humanos no debería incluir esos “crípticos” códigos.
  2. Que los errores te sean notificados automáticamente. Este es uno de los difíciles, crear algún sistema que te envíe automáticamente alertas de las páginas de error de tu sitio. Personalmente utilizo los logs y las estadísticas para localizar las páginas que han dado errores. Adicionalmente puedes montar un formulario mediante el cual puedan ser tus usuarios quienes te notifiquen cualquier error aunque debes tener en cuenta que ese no es su trabajo si no el tuyo.
  3. Si puedes, trata de averiguar lo que el usuario buscaba y presentale enlaces a contenidos relacionados. Otra solución, o solución adicional a esta, es incluir una caja de búsqueda en tus páginas de error
  4. Aprovecha las páginas de error para presentarle a tus visitantes enlaces al contenido más reciente o popular
  5. Mantén las páginas de error simples

A esto me gustaría añadir que, por lo general, es menos frustrante para nuestros usuarios si nosotros mismos asumimos parte de la culpa de los errores. Llegar a una página de error ya es desagradable, cuanto más desagradable cuando parece que el que la escribió pensaba que si habías llegado a ella era porque eres tonto. Personalmente me crispa encontrarme errores que me instan una y otra vez a comprobar que he tecleado correctamente sin darme ninguna solución alternativa.

Finalmente, os dejo los enlaces que aparecían en el artículo original para que sigáis leyendo sobre el tema si os interesa:


Armonth
ha hecho una traducción completa y literal del artículo, por si os apetece más leerlo completo en castellano aquí os dejo el enlace: Creando páginas de error 404 amigables para el usuario

Trucos y Consejos

1 Comentario

URL para sitios en varios lenguajes

Lo normal, cuando comenzamos con un sitio web, es que pensemos en él en un sólo idioma. No obstante, cada día es más común crear sitios en múltiples lenguajes, donde los usuarios puedan navegar en su idioma.

Hay muchas (muchísimas) consideraciones que hacer antes de lanzar una versión internacional de un sitio web (y seguramente las veremos más adelante). Una de las cosas que debemos plantearnos es ¿cómo vamos a plasmar en la URL las diferentes versiones internacionales?

Lo que, en principio, parece una tontería admite múltiples posibilidades. Todas con sus pros y sus contras, y todas dignas de ser bien estudiadas antes de tomar una decisión. En h3h, Brad Fults, ha hecho una revisión bastante exhaustiva de los 9 métodos disponibles: Designing URLs for Multilingual Web Sites

Para mí, de entre todas, las más sencillas y limpias son:

  • (1) Subdominios específicos para cada lenguaje (por ejemplo es.webmasterlibre.com, en.webmasterlibre.com…)
  • (2) Estructura de directorios modificada (por ejemplo webmasterlibre.com/en/, webmasterlibre.com/fr/…)
  • (4) Dominios específicos para cada país (por ejemplo google.com, google.es …)

SEO y SEM, Trucos y Consejos

1 Comentario

10 consejos para crear tu portafolio web

Estos días estoy volviéndome loca tratando de terminar mi portafolio web. Supongo que a todos nos pasa lo mismo, es dificil diseñar para uno mismo y muy facil perder el norte del diseño.

Como lado positivo, durante estos días he sumado unos cuantos puntos importantes a tener en cuenta a la hora de desarrollar nuestro portafolio.

  1. Haz bocetos de tu diseño, intenta crearte una imagen final de como va a ser el diseño y procura no alejarte demasiado de ella.
    Es muy fácil dejarse llevar por el entusiasmo y querer utilizar todas las herramientas, efectos y trucos que conocemos. No obstante, si te paras a pensarlo unos segundos te darás cuenta de que, si te excedes, tu portafolio no transmitirá esa imagen profesional de ti que, estoy segura, quieres dar a tus posibles clientes.
  2. Diseña para ti… Tu portafolio es tu tarjeta de visita, tu carta de presentación y, de forma indirecta, dará una idea a tus usuarios del tipo de sitios que desarrollas habitualmente. Si no quieres que te encarguen proyectos que te disgusten no diseñes un portafolio que no te complazca simplemente porque la moda del momento es esa.
  3. … Pero no te olvides que lo importante son tus usuarios. No hagas experimentos en tu portafolio, salvo que lo hagas por puro amor al arte o te muevas en circulos muy especializados. En general, la mayoría de los que lanzamos un portafolio buscamos ser contratados como diseñadores o desarrolladores por un tercero. Si ese cliente o posible jefe es incapaz de navegar por nuestro sitio será dificil que nos confíe el suyo ¿no crees?
  4. Facilita el contacto contigo. Salvo que busques ser contratado por telépatas o misteriosos espías, facilita todo lo posible a tus usuarios el contacto contigo, Incluye formularios y enlazalos adecuadamente desde todas las páginas del sitio. Además siempre es un punto a tu favor facilitar otros medios de contacto (VoIP, mensajería instantánea, teléfono…)
  5. No aburras al personal con extensas parrafadas. Piensa que, si esto fuese tu portafolio literario quizá y sólo quizá la gente se pararía a leerte con atención, pero como es tu portafolio de desarrollo web la gente en lo que realmente está interesada es en tus desarrollos. Se breve y conciso, no sacrifiques tu estilo de escritura pero no te extiendas.
  6. No infles tu curriculum. Lo acabamos de decir, a tus posibles clientes les interesa, por encima de todo, tu trabajo. Por otro lado, recuerda que cualquiera que te contrate en base a tu curriculum te pedirá que demuestres esas habilidades. No puedes dartelas de experto en algo y esperar a que nadie se de cuenta. Además tus trabajos darán cuenta de tu curriculum.
  7. Incluye sólo tus mejores trabajos. No tiene sentido incluir trabajos mediocres en tu portafolio, crear una buena impresión en alguien es una tarea difícil pero causar mala impresión es cuestión de un segundo.
  8. Si no tienes suficiente portafolio ¿por qué no hacer alguna plantilla que tus usuarios puedan descargar? Muchos desarrolladores tratan de llenar su portafolio creando “trabajos de muestra” creando, por ejemplo, páginas para empresas ficticias. Personalmente, ya que te tomas el trabajo de crear una plantilla que no va a ser utilizada ¿por qué no compartirla? A parte de que harás algo útil puedes conseguir algunos enlaces.
  9. Actualiza con frecuencia. Nada es más triste que una página sin actividad. Además, estoy segura de que tus habilidades mejorarán cada día más a poco que te esfuerces y tu portafolio deberá mostrarlo puntualmente.
  10. Valida, valida y valida. Algo básico ¿no? Pues no olvides validad todas las páginas que componen tu portafolio, tanto el XHTML como el CSS y, en la medida de lo posible, la accesibilidad y la usabilidad.

Trucos y Consejos

3 Comentarios

Degradación aceptable y mejora progresiva

Cuando creamos un sitio web es importante que nos aseguremos de que es accesible por cualquier usuario desde cualquier plataforma. No obstante, sobre todo a los diseñadores y desarrolladores de javascript, no nos gusta renunciar a las mejoras visuales y de usabilidad que nos pueden proporcionar ciertas técnicas. ¿Cómo podemos compaginar la accesibilidad de un sitio con las técnicas más avanzadas?

Existen dos respuestas: creando sitios web que se degraden aceptablemente o mejorando nuestros sitios paulatinamente.

La degradación aceptable (Graceful degradation) consiste en crear nuestros sitios web pensando en los usuarios de los principales navegadores y crear elementos que sustituyan a los no compatibles con navegadores antiguos o agentes de usuario no convencionales.
Un ejemplo claro de degradación aceptable es la inclusión de etiquetas <noscript> para los navegadores que no soportan Javascript.

La mejora progresiva (Progresive Enhancement) consiste en comenzar creando sitios simples, compatibles con todos los navegadores y agentes de usuario e ir introduciendo mejoras que, en caso de no ser compatibles, no provocarían cambios importantes en la página (salvo, por supuesto, la desaparición de algunas funciones no imprescindibles)

Ambos enfoques tienen sus pros y contras, para seguir indagando en el tema os recomiendo dos artículos, ambos en inglés:

Javascript, Trucos y Consejos

Comenta

21 maneras de hacer que tu sitio en Flash de asco

Los que me conocéis ya lo sabéis, odio los sitios en Flash. Estoy segura de que hay muchas formas de utilizar Flash con sabiduría y buen gusto pero, desgraciadamente, los ejemplos de sitios que más sobresalen son los de los malos sitios. Por eso, Jamie Huskisson ha publicado una interesante lista de 21 cosas que puedes hacer para que tu sitio Flash de asco:
21 ways to make your Flash based site suck

De todos los «consejos», yo destaco especialmente:

3. Haz tu página en un pop-up con ancho fijo mediante Javascript
17. Usa tantas transiciones como puedas entre el contenido
20. La música debe volver a empezar siempre tras cargar una página

Trucos y Consejos

5 Comentarios

Consejos para cuando te atascas con un diseño

A todos nos ha pasado alguna vez. Estás diseñando una página y, por una razón u otra, no termina de verse bien. Hay algo que no funciona y estás tan atascado que, por mucho que lo intentes, no das con lo que es.

En SEOmoz, una vez más, nos dejan unos cuantos consejos para esos momentos: 8 Web design tactics to help you when you’re stuck.

De entre todos me apunto dos:

1. Diseña del interior al exterior: Olvidate un poco de la cabecera y comienza dando forma a los elementos del cuerpo. Es mucho más sencillo diseñar la cabecera cuando ya tienes una base sólida.
….
7. No recurras siempre a los mismos trucos. Que una cosa te haya funcionado bien en el pasado no significa que tengas que utilizarla siempre. Obligate a aprender formas nuevas de hacer las cosas

Trucos y Consejos

Comenta

Creando páginas con buenos títulos

La etiqueta <title>, bien utilizada, es una excelente herramienta que nos ayudará a dar a conocer nuestro sitio web a los demás y nos permitirá facilitar las cosas a nuestros usuarios.
El W3C nos recomienda que estos títulos no tengan más de 64 caracteres y que sean descriptivos del contenido del sitio.

En principio, como su propio nombre indica, la etiqueta <title>, nos permite definir un título para nuestras páginas.
Para generar documentos válidos deberás incluir siempre una etiqueta title en la cabecera de tus páginas





Este título será el encargado de dar nombre a tu sitio web en numerosas situaciones, en la ventana del navegador, en los listados de favoritos, en el historial de navegación, en los resultados de los buscadores…

Errores comunes al crear titulos

Todos cometemos errores alguna vez y estos son algunos de los más comunes a la hora de crear un título:

  • Dejar el título en blanco.
  • Introducir texto por defecto en el título (Sin titulo, Pagina Nueva…)
  • Utilizar títulos que no se ajusten al contenido del sitio
  • No transmitir contenido relevante

Consejos para titulos

  • Incluye el nombre de tu sitio web en el título. De esta forma podrás crear una marca consistente con todos tus artículos, ayudarás a tus visitantes a identificar tu sitio en sus marcadores y facilitarás la tarea de los (muchos) usuarios que navegan usando los botones adelante y atrás de su navegador.
    Sobre la colocación, delante o detrás de la descripción, yo soy partidaria de colocarlo primero a pesar de que cara a los buscadores puede ser más eficaz colocar primero las palabras clave. Tu decides.
  • Crea títulos agradables a la vista y legibles por humanos.
    Utiliza los separadores y las mayúsculas y minúsculas correctamente
  • Mantente lo más breve y conciso que puedas.
  • Mantén una estructura consistente en todos los títulos de tu sitio web.

Titulos bonitos para CMS:

En las páginas estáticas es muy sencillo editar los títulos pero, todos los que usamos algún CMS tendremos que apoyarnos en plugins y «hacks».

  • Fancy Titles – Gracias a Héctor Delcourt, titulos bonitos y optimizados para WordPress (en uso en este blog)
  • Page Title: Con este plugin para Drupal podrás definir una estructura para los titulos de tus páginas y cambiar el título por defecto de los nodos.
  • How to use title-alias as title tag – Una solución para los títulos en Joomla

Seguro que hay muchos más para otros CMS, si conocéis alguno interesante dejadlo en los comentarios.

(x)HTML, SEO y SEM, Trucos y Consejos

1 Comentario

Y si no tienes más remedio que usar frames…

Como me señalaba Rodolfo Pilas en los comentarios de 9 razones para no usar frames pueden existir proyectos en los que el uso de frames pueda resultar adecuado. Si no tienes más remedio que usar frames, al menos que sean accesibles y usables.

  • Proporciona contenido alternativo para los usuarios de agentes que no soporten los frames.
    Proporciona contenido de valor dentro de las etiquetas <noframes>.
    En lugar del típico Esta página utiliza frames pero tu navegador no los soporta utilízala para colocar una descripción y enlaces que faciliten la navegación por las páginas de tu sitio.

    Por ejemplo:



    </p> <p> Bienvenido a Nombredelsitio. Tu navegador no soporta frames y por ello tendrás que navegar por las diversas páginas de este sitio mediante los enlaces siguientes: </p> <p><a href="contenido.html">Página Principal</a><br /> <a href="contenido2.html">Seccion &#8230; </a><br /> &#8230;<br />

    En el caso de los iframes deberás encerrar el contenido adicional entre las etiquetas <iframe> y éste sólo se mostrará a los usuarios cuyos navegadores no soporten frames.
    Por ejemplo:


  • Identifica correctamente los marcos, utiliza nombres descriptivos en el atributo name y da información sobre su contenido o función con el atributo title









    Además, en caso de que la relación entre los marcos sea demasiado compleja, debes facilitar una descripción de los mismos en una nueva página a la que se pueda acceder mediante el atributo longdesc de, al menos, uno de los marcos del frameset
  • Controla siempre el marco de destino de tus enlaces. Tus usuarios se sentirán desconcertados si, al pulsar sobre un enlace, se abre en el frame equivocado o queda encerrada una página ajena a tí entre tus marcos

    Este enlace se abrirá en el marco cuyo nombre (name) es contenido
    Este enlace se abrirá en el mismo marco
    Este enlace mostrará una página que eliminará la estructura de marcos
    Este enlace abrirá la página en el marco que contiene al marco actual, de no existir hará el mismo efecto que top
    Este enlace se abrirá en una nueva ventana del navegador

Además, como recompensa adicional, los buscadores podrán indexar tu sitio correctamente y mejorará tu posicionamiento.

(x)HTML, Trucos y Consejos, Usabilidad y Accesibilidad

1 Comentario

Información:

Webmaster Libre es un blog de Alma Fernández Página alojada en Redcoruna