3/27/09

Breve guía para chequear la usabilidad de tu web

Hay ciertos patrones generales que hacen que un sitio sea más o menos “utilizable”, asequible. Esto significa que los usuario lo entiendan, que la navegación por el sitio sea fácil para cualquier persona. Aunque parezca una tarea sencilla, muchos sitios no son buenos en materia de usabilidad. Se trata de errores comunes que los diseñadores deberían tener en cuenta a la hora de llevar a cabo sus proyectos

A continuación, un listado con útiles sugerencias para hacer una prueba de usabilidad rápida de tu sitio web. ¿Pasará tu sitio la prueba?

ID del sitio

youtubeHaz que sea extremadamente claro para el usuario en qué sitio se encuentra. La ID de un sitio se encuentra usualmente en la esquina superior izquierda de la página. Es importante que el ID redirija a la página de inicio del sitio, o por lo menos, añadir un link de “Inicio” en la navegación.

Nombre de la página

Las páginas de Wordpress.com, por lo general, tienen enormes títulos de página que son difíciles de ignorar.

Así como la ID, el nombre de cualquier página web necesita ser claro para los usuarios. Visualmente, debería aparentar estar enmarcando el contenido único de ese sitio, ubicado y estilado con etiquetas

o

, de manera tal que no haya duda de que esa es la cabecera de esa página dentro del sitio.

En el sitio del diario español El País, las páginas se ven claras. Para empezar el nombre de la página de una sección, en este caso “Internacional”, se ve acompañando el nombre del sitio. Pero además, la solapa de la sección se encuentra resaltada en el menú dando la impresión que conteniene todo lo que se ve desde el menú hacia abajo:

elpais

También es importante que el nombre de la página concuerde con el texto que dirige a esa página, para que el usuario no tenga problema identificando en qué página está.

Navegación por exploración

Hay dos formas principales en las que un usuario puede navegar por un sitio y es importante tener ambas en casi todas las páginas. La primera es la navegación por exploración. Este tipo de navegación usualmente puede separarse en navegación primaria, secundaria y utilidades.

  • Navegación primaria: Es la navegación para acceder a las partes principales del sitio, es la de nivel más alto. Esta explica a los usuarios cuáles son las secciones principales del sitio y los ayuda a llegar a estas secciones. Por lo general la navegación primaria es parte de la navegación global del sitio, o la navegación que permanece igual en todas las páginas de la web. Un ejemplo de esto es el sitio web de Apple:

apple

  • Navegación secundaria: Divide la navegación primaria en sub-secciones. También puede existir una navegación terciaria que divide esas sub-secciones de nivel secundario en todavía más secciones, y así. amazonAsegúrate de planear la estructura de la navegación de tus sitios de forma tal que los usuarios tengan una idea de cómo manejarse alrededor de la web. Este tipo de navegación se ve en Amazon, en la barra lateral donde están todas las categorías de productos que se pueden comprar.
  • Utilidades: Son las partes de tu sitio que no están realmente conectadas a las secciones primarias. Ejemplo de utilidades son: “Contacto”, “Políticas de privacidad”, “Acerca de”, etc.

Asegúrate de incluir las secciones más importantes de tu sitio en un lugar en que tus visitantes puedan encontrarlos fácilmente, pero no hagas que tu navegación sea muy cargada, incluyendo una gran cantidad de links de utilidades.

Navegación por búsqueda

La segunda forma de navegación que casi cualquier sitio debería tener es la navegación por medio de búsquedas. Algunos usuarios prefieren explorar, otros prefieren buscar, por lo que usualmente es sabio incluir ambos tipos. En la página de la CNN comparten lugar las secciones del sitio y el buscador, bien visible:

cnn1

Es una formula simple: una caja, un botón y la palabra “Buscar”, no lo hagas difícil para tus usuarios. Manténte en esa formula.

En qué parte del sitio estamos

Un lindo título de página no es suficiente para decirle a un usuario dónde están en una web. Claro, los informa sobre el nombre de la página y quizá les informa acerca de lo que pueden esperar de esa página en particular, pero ¿Qué les dice acerca de dónde están en relación con todo lo demás?

La idea es que el usuario siempre sepa dónde está. Es como cuando estamos en un parque de diversiones y vemos los carteles indicando “Usted está aquí”.

En muchos aspectos el usuario no sabe realmente cuan grande es el sitio, y sin alguna especie de tanteo previo del terreno al usuario le será difícil ubicarse en el mapa. Por eso mismo, las webs que tienen una buena usabilidad utilizan dos recursos:

  1. Resaltan la sección del sitio en la que el usuario se encuentra para explicarles su localización
  2. Utilizan navegación tipo breadcrumb (migaja de pan)

download

En el sitio de Download.com, se ven las migajas de pan que nos indican en qué parte dentro de la estructura estamos: Home > Windows Dowloads > Browsers. Además, la página está bien resaltada con un título prominente para no dejar lugar a dudas de dónde estamos exactamente.

Etiquetas/Descripción del sitio

metacafeLas líneas de etiquetas son una buena forma de explicar rápidamente el propósito del sitio a los usuarios. Se trata de una pequeña publicidad bien diseñada que se muestra justo al lado de la ID del sitio o debajo, y usualmente tiene sólo unas pocas palabras.

Las líneas de etiquetas son breves descripciones que nos informan acerca del propósito de la web y qué cosas encontrarán allí. Un ejemplo es Metacafe y su frase integrada al logo que en español dice “Entretenimiento de video, impulsado por tí”.

Jerarquía visual limpia

Las páginas bien construidas utilizan cabeceras limpias para organizar el contenido y sub-cabeceras para hacer al contenido más fácil de analizar. La apariencia visual del contenido puede que no sea tan importante como el contenido en sí, pero sin algún tipo de jerarquía el usuario puede perderse dentro del sitio.

Fuente: UX Booth