Facilitar la lectura rápida
Todos tendemos a hojear las páginas en vez de leer páginas de un sitio web, así que es algo que tenemos que tener en cuenta al diseñar un sitio para que sea atractivo para el usuario.
Steve Krug en su libro “Don’t Make Me Think!”, señala cinco cosas que debemos hacer para asegurarnos de que nuestros usuarios ven y son capaces de comprender la mayor parte posible de nuestro sitio:
1. Crear una clara jearquía visual en cada página
2. Hacer uso de las convenciones
3. Separar las páginas en áreas cláramente definidas
4. Hacer obvio dónde se puede hacer clic
5. Minimizar el ruido
1) Crear una clara jerarquía visual
La apariencia de todos los elementos de la página debe reflejar lo más fielmente posible las relaciones entre esos mismos elementos, que quede claro qué cosas están relacionadas entre sí, qué cosas son parte de otras y así sucesivamente. Cómo hacerlo?
Cuanto más importante es una cosa, más prominente debe ser en la página: por ejemplo, que los títulos destaquen del contenido normal de la página, ya sea haciéndolos más grandes, poniéndolos en negrita o en otro color, dejando más espaciado entre ellos y el resto de los elementos, etcétera (o bien mediante una combinación de las técnicas anteriores).
Las cosas que están lógicamente relacionadas también han de estarlo visualmente: agrupándolas bajo un mismo título, usando para todas ellas un estilo visual parecido o introduciéndolas en un área de la página claramente definido.
Anidar visualmente unos elementos dentro de otros para mostrar qué cosas son parte de otras: agrupándolas bajo un mismo título, usando para todas ellas un estilo visual parecido o introduciéndolas en un área de la página claramente definido.
Realmente, lo anterior no debería suponer ninguna novedad para nadie. Los medios impresos (revistas, periódicos…) llevan toda la vida aplicando los tres principios básicos que enumerábamos más arriba. Y nos parece lo más natural del mundo.
Naturalmente, para lograr una buena jerarquía visual, además de la estructura general de la página (tres columnas, dos columnas con una fila superior, etcétera) no podemos obviar la importancia que tiene una adecuada estructuración del contenido:
- Haz uso correcto de los distintos niveles de títulos de XHTML: h1, h2 y así sucesivamente, tantos niveles como sea necesario.
- Igualmente, haz uso de listas, párrafos, etcétera, siempre que lo creas oportuno. De este modo, además de mejorar la accesibilidad de la página, te resultará mucho más fácil posteriormente añadir las reglas de estilo necesarias, en CSS, para dar márgenes, espaciado, bordes… a estos elementos a fin de mejorar su apariencia visual y que ésta refleje lo más fielmente posible la estructura lógica del contenido.
- Usa la negrita, el color y juega con los distintos tamaños de la letra (mejor esto que emplear muchos tipos de fuentes diferentes).
- El espacio en blanco, en forma de márgenes y espaciado entre los distintos elementos, tan frecuentemente olvidado en el diseño web, es uno de nuestros mayores aliados para lograr una buena jerarquía visual y facilitar la lectura rápida.
2) Hacer uso de las convenciones
Las convenciones son una serie de normas no escritas, adquiridas por el uso cotidiano, que todo el mundo conoce y sabe interpretar correctamente.
Representan una especie de estándares de facto, si nos atenemos a ellas, garantizamos que nuestros usuarios van a ser capaces de usar un producto, o un sitio web sin tener que estudiar un manual de usuario ni dedicar un tiempo a la experimentación y el aprendizaje.
Por citar sólo algunos de ellos, podemos enumerar los siguientes:
- Los enlaces en azul y subrayados.
- El uso de menús de navegación (normalmente, en forma de barra lateral izquierda o bien en la parte superior de la página).
- La metáfora de la cesta de la compra.
- etcétera
La mayor parte de guías o principios básicos de usabilidad responden precisamente a convenciones que se han ido adoptando con los años y el uso de la Web. Nielsen lo resume en su libro “Usabilidad. Diseño de sitios web”: «¿La lección? No trate de ser inteligente y utilizar nuevos términos cuando hay uno que se ha normalizado y se ha generalizado entre los usuarios.»
3) Separar las páginas en áreas cláramente definidas
Según Steve Krug en su libro “Don’t Make Me Think”, «los usuarios deberían ser capaces de señalar las distintas áreas de una página y decir cosas como: “lo que puedo hacer en este sitio”, “productos que vende esta empresa”, “navegación para ir al resto del sito”, etcétera». Hay que dividir la página en áreas claramente definidas porque permite que los usuarios puedan decidir rápidamente y casi sin pensar en qué áreas de la página deben centrar su atención y cuáles pueden obviar.
4) Hacer obvio dónde se puede hacer clic
El pilar fundamental de la Web -y que constituye también su principal signo de distinción frente a otros medios- son los enlaces (también denominados hiperenlaces, enlaces de hipertexto…).
Está demostrado que los enlaces constituyen una de las principales fuentes de información que perciben los usuarios de un solo vistazo a la página, ya que destacan lo suficientemente del contenido normal de la página como para que tendamos a fijarnos en ellos antes que en el texto que los rodea. Por otro lado, pocas cosas resultan tan frustrantes al navegar por un sitio web como tener que estar continuamente poniendo el ratón encima de todos los elementos de la página para averiguar dónde podemos pulsar y dónde no.
De nuevo, podemos hacer uso de las convenciones: si no estamos seguros de tener una alternativa mejor, dejar que los enlaces de texto vayan en azul y subrayados, emplear en los formularios los botones estándar de HTML, etcétera, ayudará a que el usuario identifique claramente, a la primera, los distintos enlaces de la página.
5) Minimizar el ruido
Por ruido nos referimos a todos aquellos elementos de una página web que, sin ser relevantes, captan de un modo u otro la atención del usuario, distrayéndolo de la información que sí sería importante para él. Uno de los elementos que más perturban la atención del usuario en la Web son las animaciones. Bastante molesto es ya de por sí leer en la pantalla del ordenador como para tener encima elementos moviéndose por la página.
Pero es que este tipo de animaciones ni siquiera resultan útiles a la empresa anunciante: son de sobra conocidos los estudios sobre la ceguera a los “banners”, un fenómeno que consiste en que los usuarios han aprendido a descartar todo aquello que parece un banner.
Muchas veces el cliente exige a la empresa de desarrollo web que quiere que su página sea «vistosa», «espectacular» u otros adjetivos similares. El cliente lo que quiere decir es que quiere ver animaciones (cuantas más y más llamativas, mejor) en su sitio web. Éste es un error de planteamiento estratégico que viene derivado por el escaso conocimiento de la Web.
Otras veces son los diseñadores gráficos quienes imponen sus criterios estrictamente estéticos (aunque sobre esto habría mucho que decir) por encima de cualquier otra consideración.
En ambos casos se olvida cuál es el verdadero objetivo de un sitio Web, aunque sea uno de una pequeña empresa concebido como una mera presencia de ésta en Internet: servir al usuario. Y la forma de servir a sus propósitos variará de un sitio a otro, pero desde luego nunca será incluyendo logotipos que dan vueltas por la página, absurdas animaciones de bienvenida que tardan en cargar y no aportan ninguna información, imágenes de productos que giran y sin embargo luego resulta imposible encontrar su manual o las descripciones del mismo en el sitio web, y así un sinfín de ejemplos más que seguro todos tenemos en mente.
Tomado de www.tayzee.com