1. Incluye siempre un mapa del sitio, especialmente en sitios web complejos.
2. No escondas el enlace al mapa del sitio en contenidos muy profundos dentro de la estructura de la web.
3. No ocultes el enlace al mapa del sitio entre otros muchos enlaces.
4. Nombra el enlace al mapa del sitio “Mapa del sitio” (o “Sitemap” si trabajamos sitios multilenguaje).
5. Incluye un enlace al mapa del sitio en cada página de la web.
6. El enlace en cada página debe ir colocado en la misma ubicación.
7. No emplees un mapa del sitio no estándar (en este caso la creatividad no es necesaria). Simplemente, construye un listado de enlaces a cada apartado del sitio web.
8. Los enlaces del mapa del sitio deben explicar al usuario exactamente lo que se encontrará tras ellos.
9. Mantén todo el mapa del sitio en una misma página (para que el usuario comprenda rápidamente la estructura del sitio web).
10. Utiliza un mapa del sitio jerárquico visualmente (define claramente los contenidos de primer nivel, segundo nivel, etc.) que permita al usuario comprender la estructura jerárquica del sitio.
11. Añade al mapa del sitio aquellos contenidos pertenecientes a los primeros niveles de la estructura del sitio web de manera que la información se presente de una forma clara y legible.
12. El mapa del sitio debe representar a todas y cada una de las áreas del sitio web.
13. Actualiza el mapa del sitio siempre que añadas un nuevo contenido en el sitio web.

Fuente original: Site Map Usability Guidelines (en inglés)

Como regla general, los mapas de sitio no son utilizados por los usuarios. Siendo así … ¿por qué es recomendable incluir un mapa del sitio en la página web de mi empresa?

• En ningún caso dificultan la navegación de aquellos usuarios que no lo usen.
• Ayudan a ciertos usuarios (pocos, pero algunos).
• El coste (económico y temporal) para su puesta a punto es mínimo.
• Y además, van a colaborar en la indexabilidad del sitio (la facilidad con la que un sitio web permite el acceso a los buscadores; primer paso para un correcto posicionamiento en buscadores)

En breves analizaremos una serie de recomendacionesde cara a los mapas de sitio.

Fuente original: Site Map Usability Guidelines (en inglés)

“La usabilidad es como cocinar. Todo el mundo necesita sus resultados. Cualquiera puede hacerlo razonablemente bien con un poco de entrenamiento. Y sin embargo, se necesita un maestro para producir un resultado gourmet.”

Con estas palabras comienza un artículo en el que la idea central es que no es necesario disponer de una gran cantidad de recursos para trabajar la usabilidad de un proyecto web.

En cualquier sitio web es posible llevar a cabo un test de usuarios en tres días:

• Día 1: Diseña el estudio y escribe las tareas que realizarán tus usurios (las que sean el núcleo del sitio)
• Día 2: Lleva a cabo 5 sesiones de una hora con 5 usuarios diferentes (entre sesión y sesión, limpia el “rastro” del usuario anterior).
• Día 3: Revisa toda la información recopilada.

Ahí queda dicho, atrévete a probar, probar y probar con usuarios.

Fuente original: Anybody Can Do Usability (en inglés)

Las pruebas  de usuario de guerrilla son un tipo de evaluación de la eficiencia de un sitio web que se realizan de una manera más informal que un test de laboratorio al uso y de libro.

Daniel nos dejó una serie de consejos:

• Hacer el test en el cliente (involucrar a la empresa)
• Usar lápiz y papel (no crear entornos tecnológicos complejos que hagan que el usuario se sienta menos cómodo)
• Incluir en la prueba a un solo evaluador
• Reclutar usuarios voluntarios y conocidos (siempre que el presupuesto del que dispongamos no sea muy elevado)
• Llevarlo a cabo cuanto antes mejor, incluso desde las primeras fases de prototipado (y siempre después de un análisis heurístico)
• Aplicar una gran dosis de creatividad

Como siempre que me arranco a hablar sobre pruebas con usuarios, la recomendación es: probar, probar, probar y probar (y más todavía cuando con este tipo de pruebas de guerrilla obtenemos resultados muy valiosos a un coste asumible).

Se trata de una pauta de usabilidad web y arquitectura de la información que nos viene a decir que desde cualquier contenido de un sitio web a cualquier otro contenido de dicho sitio deben existir, como máximo, tres clicks de distancia (tres enlaces).

¿Es muy importante?

En el fondo, se trata de una pauta que hace un tiempo tenía cierto sentido. Hoy en día ya no tanto: ¿debemos diseñar la interacción de un sitio web siguiendo una arquitectura basada en un árbol de tres niveles (página de inicio, secciones y subsecciones)?

Por allá por el 2003, J.Porter realizó un estudio en el que se deja en entredicho esta  regla. Los resultados (basados en unos 8000 clicks)  se resumen en los siguientes gráficos:

Tasa de éxito en función del número de clicks por tarea

Grado de satisfacción del usuario en función del número de clicks por tarea

Es decir:

• El éxito o el fracaso de una tarea llevada a cabo en una web no depende del número de clicks que requiere dicha tarea
• El grado de satisfacción del usuario tampoco depende de este factor (un usuario puede frustrarse cuando el número de obstáculos planteados es considerable)

Moraleja

Cuando diseñamos una nueva web, es necesario valorar las necesidades de los usuarios y cubrirlas con una arquitectura sencilla e intuitiva (más allá de la cantidad de clicks que necesitan para lograr sus objetivos).

¿Cómo se logra esto? Como siempre, una frase que me gusta mucho: probando, probando, probando y, por si fuera poco, probando

Fuente: La regla de 3 clics

Fuente original: Testing the Three-Click Rule

• 247 web usability guidelines

Se trata de una colección muy amplia de aquellos aspectos relevantes a la usabilidad web que todo consultor en usabilidad debe tener en cuenta.

Como ya avisan, lo más importante es contextualizar el test heurístico. Es decir, realizar la evaluación de manera coherente al sitio que estamos chequeando y sus objetivos. Aquellos elementos no aplicables se ignoran; y aquellos aplicables se priorizan según el impacto que tenga el error en el sitio web concreto.

Un buen material de apoyo para evaluar la usabilidad de un sitio web e incluso para preparar el desarrollo de una web nueva con las bases ya asentadas.

Actualización:

• Versión en español del heurístico

Se explica la técnica Thinking-Aloud (o pensar en alto) mediante tres fases o puntos clave a considerar:

• Explica al usuario qué debe hacer
• Demuestra al usuario cómo será el test y déjale probar
• Participa con preguntas abiertas

Gracias a UserFocus, he tenido la oportunidad de traducir este documento y os dejo aquí la versión en castellano del cómic:

Cómic original: Usability Test Moderation: The Comic

En este documento se van transmitiendo una serie de consejos en torno a:

• Breadcrumbs o migas de pan
• Pestañas
• Enlaces
• Elementos superpuestos
• Menú desplegable
• Scroll
• Iconos
• Contenido
  • Títulos
  • Página de bienvenida
  • Cuerpo del mensaje
  • Fuentes
  • Video

En resumen, si tienes quince minutos y quieres cuatro pinceladas acerca de la usabilidad, esta es una lectura recomendada (leer Introducción a la Usabilidad).

Uso de banderas para la selección de idioma

El primero de los argumentos ya lo hemos esgrimido aquí: una bandera no representa un idioma, sino un país (razón documentada por la propia W3C en sus buenas prácticas para la internacionalización de una web).

Profundizando un poco más, y hablando ya de usabilidad y accesibilidad web, ¿qué ocurre si un usuario es daltónico y confunde los colores de una bandera? ¿o si el usuario no conoce la bandera en cuestión?

Quizá ni sea necesario pensar en estas situaciones, una pregunta tan sencilla como ¿cuántas banderas existen con tres franjas (roja, blanca y azul)? puede servir como argumento contra el uso de banderas para seleccionar el idioma de una web.

Uso de banderas junto con texto para cambiar el idioma

Una solución intermedia consiste en acompañar la bandera con el nombre del idioma en dicho idioma.

¿Cuál puede ser el problema? Que, por ejemplo, un usuario estadounidense pueda ofenderse al ver su idioma representado por otra bandera.

Alternativas a las banderas para la elección de idioma

1. Nombre del idioma en el idioma correspondiente: la mejor opción si contamos con un sitio web con contenido en pocos idiomas (hasta cinco o siete diferentes).
2. Cuadro desplegable para elegir idioma: la mejor posibilidad cuando tenemos contenido en muchos idiomas.

El posible problema de este par de alternativas es que, al no incorporar un ancla visual (un icono o algún otro gráfico), pueden pasar desapercibidos.

No obstante, son las opciones a incorporar en los sitios web. Para sobresaliente si conseguimos crear una zona de atracción visual para que el usuario internacional localice rápidamente el cambio de idioma.

¿Son necesarias más razones para evitar el uso de banderas?

Fuente: Problemas de las banderas para la elección de idioma

Ejemplo de una portada dedicada a la selección de idioma

Se trata de una portada empleada en el sitio oficial de Rebootizer (una bebida digestiva que prometer rebajar la tasa de alcohol en sangre). ¿Cuáles son, a mi parecer, los puntos débiles de esta propuesta?:

• Se incluye una portada que obliga al usuario a hacer un click más para acceder a cualquier contenido de la web. Esto se agrava un poco más al mostrar una portada sin identidad. Su objetivo es la selección de idioma, pero ¿qué es rebootizer? ¿a quién va dirigido? … En el peor de los casos, en los que sea necesario añadir una portada inicial anterior a la verdadera página de inicio, habrá que aprovecharla para transmitir imagen de marca y proporcionar un primer impacto positivo en el visitante.
• La selección de idioma se basa en un código de banderas. ¿Por qué no es conveniente esta acción? La respuesta es sencilla y directa. Una bandera representa de manera unívoca un país, pero no un idioma. Por ejemplo, ¿sólo en España se habla castellano? o ¿sólo en Inglaterra se habla inglés?.
• Y por si fuera poco, las banderas se acompañan de los tópicos más extendidos de cada país. La torre Eiffel puede representar Francia de una manera algo acertada. Pero, ¿todos los españoles bailan flamenco? o ¿todos los norteamericanos tienen un sobrero de cowboy en el armario?

¿Cómo mostrar los diferentes idiomas de una web?

1. A poder ser, huir de una portada cuyo único objetivo sea la selección de idioma. El único caso en el que esta medida será aconsejable se refiere a un sitio web en el que el contenido depende de la zona geográfica orígen del usuario (por ejemplo, políticas de precios muy diferenciadas o determinados productos que sólo se comercializan en algunos países).
2. Mostrar los idiomas disponibles a lo largo de toda la navegación del usuario (en todas las páginas que componen el sitio web) en una zona visible (por ejemplo, en la esquina superior derecha de la web).
3. La selección de idioma se basa en enlaces textuales con el nombre del idioma traducido en dicha lengua (castellano, english, français, deutch, …)

Fuente: Selección de idiomas desafortunada