Juan Ortega

Consultor en marketing digital & comercio electrónico

RSS

Diseñando Web Usables: Un arte desconocido

Muchos de ustedes, se extrañaran el nombre del título, de hecho, diseñar web usables no es nada nuevo para algunos, ya que por internet te podrás encontrar con un sin número de recursos, estudios, herramientas, y comunidades que brindan toda la ayuda necesaria para dar tus primeros pasos.

Pues bien, tras realizar un breve análisis de los errores de diseños de los sitios web gubernamentales (esperen un análisis mas detallado prox.) , llegué a la terrible conclusión de que existe un cierto desconocimiento de como crear un sitio web usable, y por usable no me refiero a la típica frase “user-friendly” la cual todo mundo tiene la concepción de que se trata solamente del aspecto visual de un sitio, sino me refiero a un Diseño “DCU” , que quiere decir diseño centrado al usuario. A lo largo, de este artículo, estaré dando algunos consejos, de como diseñar sitios web usables, al menos desde una perspectiva funcional, la parte estética visual es algo empírico, no es una receta de cocina, es algo que requiere un proceso mas complejo que requiere tiempo pero sobre todo dedicación.

La frase trata a los demás como quieres que te traten a ti, se aplica perfectamente en este medio, a la hora de navegar por Internet.

Una vez alguien me cuestionó seriamente del porque deberíamos de desarrollar sitios web estándares ya que le parecía una perdida de tiempo, lo cual me pareció totalmente absurdo de preguntar, pues bien, es necesario hacerlo porque hay que comenzar aprender hacer las cosas de la manera correcta, porque los buscadores nos querrán indexar un poco más, pero sobretodo, por mejorar el nivel de satisfacción del aquel usuario que llega a tu sitio web en busca de un producto, servicio o simplemente por algún tipo de información y que podrá convertirse o no, en un potencial Cliente.

Para comenzar debemos de tener en cuenta ciertas cosas :

  • El tiempo en Internet es tu mayor enemigo, los usuarios son impacientes.
  • Los usuarios no leen, escanean.
  • No todos navegan de la misma forma.
  • No todos usan los mismos navegadores.

Dicho esto tenemos que tener en cuenta  que existen una infinidad de consejos, trucos o técnicas para mejorar tu sitio web, las que muestro a continuación son apenas una pequeña muestra, pero que sirven como directrices durante la el ciclo de vida de un proyecto web.

Diseña un sitio fácil de Navegar

Me he encontrado con sitios cuyos menús son poco intuitivo y que llegan a tener hasta 7 u 8 opciones, así como también extensos párrafos de bienvenida que nadie lee o banners publicitarios causando que tu sitio se vea como un lindo árbol de navidad.

Para evitar eso, la mejor estrategia es ponerte en los zapatos del usuario, diseña tu sitio a como piensan ellos, para esto puedes:

  1. Revisar las estadísticas de tu sitio
    En ella encontrarás valiosa retroalimentación que te permitirá identificar cuales son las secciones más visitadas.
  2. Aplicar técnicas de card sorting
    Card Sorting es una técnica de agrupación de la información en base al modelo mental de los usuarios, muy útil a la hora de estructurar la navegación del sitio.
  3. Realizar un Benchmarking
    Visita otros sitios de tu mismo mercado para identificar ciertos aspectos estructurales que pudieran ser provechosos.
  4. Pon a prueba tu sitio
    Realiza test de usabilidad con los usuarios target del sitio, ya por último pídele a algún familiar o colega tuyo que navegue por el sitio, asignale algunas tareas como encontrar cierta información, y verás que en tiempo record siempre encontrarán algún error e inconsistencias que tu no viste, si es posible hay que involucrarlos desde las primeras etapas del desarrollo de tu sitio, de igual forma hay que realizar test heuristicos, para verificar que tu sitio cumple con los criterios necesarios de usabilidad.

Usa CSS

Antiguamente las css se ocupaban para el estilo de las fuentes, y las tablas para la maquetación, pues ya no, ahora con las css tenemos la facilidad de maquetear todo el sitio, el tamaño de la página se reduce considerablemente, de igual forma, lograremos separar el diseño del contenido por lo que tendremos un código más limpio y un diseño fácil de administrar.

Escribe para la Web

Ve al grano, elimina aquellas introducciones todas pomposas que nadie lee, de hecho, existen estudios que indican que el usuario promedio solo lee el 20% de lo que aparecen en la pantalla, ellos escanean en busca de palabras claves que les interesan, por lo que una lectura extensa es muy poco probable que la lean.

Los dos primeros párrafos deben contener la información más importante (efecto pirámide invertida) y haz uso de viñetas, negritas para destacar el contenido para mejorar la encontrabilidad (Findability) de la información, por último emplea el uso de los enlaces para no interrumpir el flujo de la lectura, no es lo mismo tener un enlace asi www.elnuevodiario.com.ni, que el nuevo diario, de igual forma hay que saberlos destacar de los otros elementos.

Utiliza código semántico

Utiliza las tags de manera correcta, bajo el contexto en que ellas fueron creadas, ejemplo:

  • La tag <table> fue creada para exibir datos tabulares y no para maquetear los sitios.
  • Usar las tags como h1, h2, h3, etc, para declarar los títulos.
  • Todo lo que sea enumeración utilizar las tags <ul> (lista sin orden) o <ol> (lista ordenada).
  • En los formularios utilizar la tag <label> (rótulo) para declarar el nombre de los campos.
  • Utiliza la tag <p> para los párrafos.

Emplea técnicas de SEO

SEO significa Search engine optimization, son las técnicas necesarias que nos permitirán ganar posicionamiento en los buscadores, una gran parte de los visitas nuevas de un sitio provienen de alguna búsqueda. Comencemos por utilizar las etiquetas keywords, title y description como técnica básica para mejorar el posicionamiento de tu sitio.

No abuses de Flash

No recomiendo diseñar un sitio web completamente en flash, ya que tu sitio se convierte en un producto enlatado, difícil de indexar para los navegadores, y muy pesado para cargar.

Evita colocar fastidiosos intros, que desespera estar esperando casi una eternidad, para una animación de 20 segundos, pero sobre todo, repitan conmigo: NO colocar música en tu sitio, y peor si no se coloca algún mecanismo para detener la música.  Pónganse la mano en la conciencia, el usuario no la ha pedido, interrumpe la navegación y disminuye el grado de satisfacción. Imagínense si un usuario está navegando en un cyber, en una biblioteca, o simplemente está escuchando su propia música en su compu, y se topa con en este tipo de sitios, es algo realmente fastidioso .

Usa colores amigables, se amable con los ojos

El color es un arma de doble filo debemos asignar los colores correspondientes y unirlos de una forma equilibrada y homogénea

Es un hecho, los colores nos afectan psicológicamente y nos producen ciertas sensaciones desde primer momento, por lo tanto en la web tenemos que emplear colores armoniosos que faciliten la lectura por pantalla. Para esto debemos de conocer nuestro target, y crear una paleta de colores de acorde al contexto, existen por la red varios generadores de colores que nos serán de mucha ayuda.

De igual forma hay que emplear un fondo adecuado que haga un buen contraste con la tipografía empleada en el sitio, y desde ya se los aseguro, el visitante se sentirá muy agradecido.

Conclusiones

Espero que estos pequeños consejos, sean de gran ayuda al momento de desarrollar un sitio, por mi parte solo le resta por decirle que nadie nace aprendido, crear un sitio web es un arte, y que los errores cometidos en los diseños, yo los he cometido también, pero es responsabilidad nuestra mejorar nuestro trabajo, y aprender nuevas metodologías que nos permitan crear sitios Web usables y accesibles.





  • Excelente artículo, muy útil por lo demás, y hay varios puntos de los cuales he estado aprendiendo para aplicar a algunos proyectos, donde tendré la tarea de encargarme del css.

    Acá en Chile los ejemplo más característicos en cuanto de desastres de diseño son algunos de los sitios web gubernamentales, como sii.cl, donde la información está desparramada por todos lados y se transforma en un verdadero dolor de cabeza a la hora de hacer cosas básicas.

    Lo importante es que esta tendencia de crear webs usables vaya en aumento.

    Saludos!

  • Pingback: Diseñando Web Usables: Un arte desconocido()

  • muy buen articulo, lo mas chistoso es que todos comenzamos siempre haciendo lo incorrecto, y ahora solo nos reimos de lo que hicimos en el pasado.

  • Pingback: el nuevo diario nicaragua()

  • Vale

    lo de los colores me recuerda a varios sitios gubernamentales que lucen como pintados por un nene o nena de preescolar