jueves, 22 de marzo de 2012

Web Usability Guidelines–Directrices de usabilidad web

Artículo anterior: Qué teclas de acceso rápido (accesskey) utilizar

Última actualización: 26/03/2012

En el artículo Estándares formales de usabilidad y su aplicación práctica en una evaluación heurística definí qué es un estándar y la diferencia entre estándares oficiales (o “de jure” o formales) y estándares “de facto” (o no formales)

En dicho artículo traté los estándares oficiales, repasando las diferentes normas ISO existentes, donde destaca la norma ISO 9241-151 que presenta una checklist de validación.

Asimismo repasé diferentes propuestas basadas en estas normas ISO que incluían formas prácticas de aplicarlas en una evaluación heurística, en especial WUEP (Web Usability Evaluation Process)

Por ello incluí la descarga de una excel con las subcaracterísticas (y descripción), atributos (y su descripción) y métricas, a modo de herramienta de ayuda, para la elaboración de una evaluación de usabilidad de una web de acuerdo a la ISO 25000 (SQUARE), según el modelo propuesto por WUEP (Web Usability Evaluation Process)

En este artículo repaso, fuera ya de los que son los estándares formales, diferentes propuestas de directrices de usabilidad web, - algunas de las cuáles se pueden considerar estándares “de facto”-, con listas de verificación (checklist) asociadas, que permitan la evaluación heurística de los sitios en base a dichas directrices.

No está de más recordar que las directrices de usabilidad no pueden considerarse nunca reglas fijas ni pueden ser aplicadas por igual en todos los sitios web, siempre habrá que tener en cuenta y reflexionar sobre el tipo de sitio, su audiencia, sus objetivos o su contexto.

He seleccionado las que me parecen más relevantes, incluyendo al final un listado con otros enlaces de interés. Os animo a que dejéis en los comentarios aquellas que no he incluido pero os parecen relevantes.

Índice

HHS Guidelines

Las "HHS Guidelines" son las directrices de diseño web y usabilidad del Gobierno de EEEUU. Fueron desarrolladas por el U.S. Department of Health and Human Services (HHS) en 2004, de ahí que se las conozca como las HHS Guidelines.

Están disponibles en formato PDF en el documento Research-Based Web Design and Usability Guidelines (PDF 20.64 MB)

Fueron realizadas y revisadas por diseñadores y expertos de usabilidad basándose en la investigación de diferentes campos (citan en concreto: cognitive psychology, computer science, human factors, technical communication y usability)

En la actualidad cuenta con 209 directrices (en la primera edición eran 187) que, tras un estudio de cardsorting, se agruparon en 18 temas:

  1. Proceso de diseño y evaluación (11 directrices)
  2. Optimizando la experiencia de usuario (16 directrices)
  3. Accesibilidad (13 directrices)
  4. Hardware y software (5 directrices)
  5. La página de inicio (9 directrices)
  6. Esquema de la página (layout) (13 directrices)
  7. Navegación (12 directrices)
  8. Desplazamiento (scrolling) y paginado (5 directrices)
  9. Encabezados, títulos y etiquetas (8 directrices)
  10. Enlaces (14 directrices)
  11. Apariencia del texto (11 directrices)
  12. Listas (9 directrices)
  13. Controles y Widgets (25 directrices)
  14. Gráficos, imágenes y multimedia (16 directrices)
  15. Escribiendo contenido web (11 directrices)
  16. Organización del contenido (9 directrices)
  17. Búsqueda (9 directrices)
  18. Test de usabilidad (13 directrices)

Se puede consultar de forma individual cada uno de estos capítulos en la página Guidelines de la web usability.gov Esta web del Gobierno de EEUU recoge la metodología que se debe aplicar en la construcción de un sitio web bajo una metodología de Diseño Centrado en el Usuario, dentro de la cuál cumplir con estas directrices sólo es un paso más. Traté en profundidad esta web y su metodología propuesta en el artículo La usabilidad como metodología para el desarrollo de una aplicación

Dentro de cada capítulo las directrices están ordenadas de más a menos importantes. La estructura de cada directriz es la siguiente:

1:1 Provide Useful Content. Con tres apartados: guideline, comments y sources. Relative Importance: 5;Strength of evidence: 5

Como se aprecia consta de:

  • Numeración y título de la directriz ("1:1 Provide Useful Content")
  • Guideline, título extendido de la directriz;
  • Comments, descripción de la directriz indicando en qué consiste y por qué hay que cumplirla;
  • Sources, referencias sobre esta directriz;
  • Ejemplos, solo disponibles en algunas directrices.
  • Relativa Importance, importancia de la directriz que están clasificadas de 1 a 5 (5 las más importantes, 1 las menos importantes) La clasificación fue llevada a cabo por una encuesta a numerosos expertos en usabilidad.

  • Strength of Evidence, indica la "medida de confianza" clasificada de 1 a 5 (5 las que mayor nivel de confianza ofrecen y 1 las que menos) La medida de confianza está basada en la calificación dada por numerosos expertos en usabilidad (y en la que, según se indica, hubo alto grado de coincidencia) que buscaron evidencias de esa directriz en investigaciones, estudios, resultados de experimentos, etc.




La medida de confianza se define de la siguiente manera:

  • 5 – Strong Research Support

    • Cumulative and compelling, supporting research-based evidence
    • At least one formal, rigorous study with contextual validity
    • No known conflicting research-based findings
    • Expert opinion agrees with the research
  • 4 – Moderate Research Support

    • Cumulative research-based evidence
    • There may or may not be conflicting research-based findings
    • Expert opinion
    • Tends to agree with the research, and
    • A consensus seems to be building
  • 3 – Weak Research Support

    • Limited research-based evidence
    • Conflicting research-based findings may exist
    • - and/or -
    • There is mixed agreement of expert opinions
  • 2 – Strong Expert Opinion Support

    • No research-based evidence
    • Experts tend to agree, although there may not be a consensus
    • Multiple supporting expert opinions in textbooks, style guides, etc.
    • Generally accepted as a ’best practice’ or reflects ’state of practice’
  • 1 – Weak Expert Opinion Support

    • No research-based evidence
    • Limited or conflicting expert opinion

En el apéndice de la guía encontramos lo que puede servirnos de checklist (PDF 20.64 MB), que es el listado de todas las directrices agrupadas por su importancia.

Se puede consultar una comparativa entre la ISO 9241-151 y las HHS Guidelines en BEVAN, N. , SPINHOF, L. (2007): "Are guidelines and standards for web usability comprehensive?" (PDF)

247 directrices de usabilidad web de Userfocus

Userfocus propone 247 directrices de usabilidad que distribuye en 9 heurísticos:

  • Usabilidad de la página de inicio (20 directrices)
  • Orientado a tareas (44 directrices)
  • Navegación y Arquitectura de Información (29 directrices)
  • Formularios y entrada de datos (23 directrices)
  • Confianza y credibilidad (13 directrices)
  • Escritura y calidad de los contenidos (23 directrices)
  • Esquema de la página (layout) y diseño visual (38 directrices)
  • Usabilidad en la búsqueda (20 directrices)
  • Ayuda, feedback y tolerancia a errores (37 directrices)

Una gran ventaja es que ofrece gratuitamente una excel de trabajo con las 247 directrices (traducida al español) que facilita la valoración y la inclusión de comentarios.

Nielsen Norman Group Guidelines

Posiblemente los 10 heurísticos de Jakob Nielsen sean los más conocidos:

  1. Visibilidad del estado del sistema.
  2. Utilizar el lenguaje de los usuarios.
  3. Control y libertad para el usuario.
  4. Consistencia y estándares.
  5. Prevención de errores.
  6. Minimizar la carga de la memoria del usuario.
  7. Flexibilidad y eficiencia de uso.
  8. Los diálogos estéticos y diseño minimalista.
  9. Ayudar a los usuarios a reconocer, diagnosticar y recuperarse de los errores.
  10. Ayuda y documentación.

Según el propio Jakob Nielsen dispone de 2397 directrices de usabilidad repartidas en múltiples informes que lista en "Publications" de nngroup.com

Swedish National Guidelines for Public Sector Websites

La guía del Gobierno de Suecia Swedish National Guidelines for Public Sector Websites es especialmente completa. Las directrices están agrupadas por capítulos, dentro de los cuales se listan los heurísticos y las directrices asociadas.

Aunque no incluye checklists asociadas, las directrices están muy bien explicadas y tienen asociadas un nivel de prioridad (1, 2 y 3, siendo las de nivel 1 las más críticas)

En el capítulo "3. Website standards" se incluyen 58 directrices agrupadas en:

  • Estructura y navegación (9 directrices)
  • Color, contraste y tipografía (3 directrices)
  • Diseño (22 directrices)
  • Tablas de datos (5 directrices)
  • Formularios (11 directrices)
  • Aplicaciones web (3 directrices)
  • Manejo de errores (3 directrices)
  • Eventos del sistema (2 directrices)

En el capítulo Contenidos y servicios se incluyen 29 directrices agrupadas en:

  • Acerca de la autoridad (5 directrices)
  • Información básica (8 directrices)
  • Otros lenguajes (3 directrices)
  • Búsqueda (4 directrices)
  • Distribución de servicios y contenidos del sitio web (4 directrices)
  • Participación y transparencia (5 directrices)

En el capítulo Actualización del sitio web (o mantener el sitio al día) se incluyen 43 directrices agrupadas en:

  • Administración (1 directrices)
  • Seguimiento del uso y el contenido (6 directrices)
  • Información de "emergencia" en el sitio (6 directrices)
  • Escribir para la web (9 directrices)
  • Formato de la web (marcado HTML) (9 directrices)
  • Imágenes y gráficos (4 directrices)
  • Enlaces y documentos (8 directrices)

Hay otros capítulos como "Servicio mejor y más eficiente", "Proceso de desarrollo", "Contenido para dispositivos móviles", "Herramientas de publicación" o "Productos de apoyo para usar el sitio web".

Sirius

La propuesta de Mª del Carmen Suarez en su tesis Sirius: Sistema de Evaluación de la Usabilidad Web Orientado al Usuario y basado en la Determinación de Tareas Críticas (PDF, 3.39 MB) son 83 directrices dividas en:

  • Aspectos generales (10 directrices)
  • Identidad e información (7 directrices)
  • Estructura y navegación (14 directrices)
  • Rotulado (6 directrices)
  • Layout de la página (10 directrices)
  • Entendibilidad y facilidad en la interacción (7 directrices)
  • Control y retroalimentación (10 directrices)
  • Elementos multimedia (6 directrices)
  • Búsqueda (8 directrices)
  • Ayuda (5 directrices)

Hablé de su sistema en profundidad en Sirius. Nuevo sistema para la evaluación de la usabilidad web. Su método presenta numerosas ventajas, por ejemplo que la relevancia de los errores tienen en cuenta el tipo de sitio evaluado.

Permite elaborar una herramienta de evaluación que dé soporte al sistema planteado y facilite la validación empírica de la propuesta de evaluación. Proporcioné esta herramienta en formato excel: Checklist para la evaluación de la usabilidad web según la metodología Sirius. Versión 3 (XLSX)

Australia Government Usability Checklist

La Australia Government Usability Checklist es la más sencilla de todas las vistas hasta ahora. Está incluida dentro del conjunto de publicaciones "User Profiling and Testing Tollkit" del Gobierno de Australia.

Son 43 directrices clasificadas en 6 temas:

  • Arquitectura y navegación
  • Layout y diseño
  • Contenidos
  • Formularios
  • Plataforma e implementación
  • Accesibilidad (prioridad 1)

Guía para el Desarrollo de Sitios Web del Gobierno de Chile

Al igual que la del Gobierno de Australia, presenta una checklist de usabilidad bastante reducida.

Son 30 directrices divididas en los siguientes heurísticos:

  • Identidad corporativa
  • Utilidad del sitio web
  • Navegación
  • Visibilidad del estado del sistema
  • Consistencia y cumplimiento de estándares
  • Atención a errores
  • Estética y diseño
  • Ayuda a errores
  • Retroalimentacion (feedback)

Usability Guidelines del MIT (Massachusetts Institute of Technology)

En la web IST (Information Services & Technology) del MIT (Massachusetts Institute of Technology) encontramos el apartado "Usability at MIT" con numerosos recursos de interés.

Uno de estos recursos son las "Usability Guidelines", 62 directrices agrupadas en:

  • Navegación (5 directrices)
  • Funcionalidad (4 directrices)
  • Control del usuario (5 directrices)
  • Lenguaje y contenido (7 directrices)
  • Ayuda en línea y guías de usuario (2 directrices)
  • Feedback (7 directrices)
  • Accesibilidad (14 directrices)
  • Consistencia (2 directrices)
  • Prevención y correción de errores (8 directrices)
  • Claridad arquitectual y visual (8 directrices)

Directrices de usabilidad para sitios web del Estado colombiano

En 2010 M. Carvajal y J. Saab (2010) publicaban un documento muy interesante: “Documento de análisis de prácticas y recomendaciones mundiales en Usabilidad (PDF)” para el Ministerio de Tecnologías de la Información y las Comunicaciones de la República de Colombia. En él se repasan diferentes propuestas de diferentes países para concluir cuál sería la mejor forma de redactar unas recomendaciones de usabilidad para el Gobierno de Colombia.

Actualmente encontramos una versión 1.0.4 candidata a oficial (del 26 de agosto de 2010) en Directrices de usabilidad para sitios web del Estado colombiano (PDF, 4.1 MB).

Las directrices están organizadas así:

  • 1. Arquitectura de información

    • 1.1 Objetivos del portal web
    • 1.2 Personajes y escenarios
    • 1.3 Necesidades de los usuarios
    • 1.4 Evaluación constante
    • 1.5 Evaluación de la Arquitectura de Información
    • 1.6 Navegación global consistente
    • 1.7 Navegación de contexto
    • 1.8 Ruta de migas
    • 1.9 URL limpios
    • 1.10 Ubicación del usuario
    • 1.11 Tagline
    • 1.12 Enlaces bien formulados
    • 1.13 Memoria a corto plazo
  • 2. Diseño de Interfaz de Usuario

    • 2.1 Ubicación del logotipo
    • 2.2 Diseño ordenado y limpio
    • 2.3 Interfaces en movimiento
    • 2.4 Contenido que parece publicidad
    • 2.5 Contraste en brillo y color
    • 2.6 Información transmitida a través de color
    • 2.7 Justificación del texto
    • 2.8 Ancho del cuerpo de texto
    • 2.9 Fuentes tipográficas comunes
    • 2.10 Texto subrayado
    • 2.11 Uso adecuado del espacio en blanco
    • 2.12 Desplazamiento horizontal
    • 2.13 Vínculo a la página de inicio
    • 2.14 Tareas clave en la página de inicio
    • 2.15 Contenidos de ejemplo en la página de inicio
    • 2.16 Hojas de estilo para diferentes formatos
    • 2.17 Independencia de navegador
    • 2.18 Vínculos visitados
    • 2.19 Calidad del código
  • 3. Diseño de Interacción

    • 3.1 Campos obligatorios
    • 3.2 Asociación de etiquetas y campos
    • 3.3 Validación dinámica de datos
    • 3.4 Error de página no encontrada
    • 3.5 Ventanas emergentes
    • 3.6 Botón atrás
    • 3.7 Tiempo de carga de las páginas
    • 3.8 Ejemplos en los campos de formulario
    • 3.9 Páginas de confirmación

  • 4. Búsqueda

    • 4.1 Motor de búsqueda y ubicación
    • 4.2 Búsquedas con términos familiares y errores de digitación
    • 4.3 Sugerencias de búsqueda
    • 4.4 Ubicación en los 10 primeros resultados

  • 5. Pruebas de usabilidad

    • 5.1 Evaluación heurística
    • 5.2 Test de Usuario
    • 5.3 Diseño y evaluación iterativos

  • 6. Contenido

    • 6.1 Contenido útil
    • 6.2 Pirámide invertida
    • 6.3 Títulos y encabezados
    • 6.4 Listas
    • 6.5 Escaneado de contenido
    • 6.6 Vínculos rotos
    • 6.7 Contenido encontrable

Otro documento recomendable de M. Carvajal es La Guía Web 1.0 de Proexport (PDF) donde se aplican las directrices.

Otros enlaces de interés

En Index of Government Guidelines for Web Sites de Peter Krantz se puede encontrar las guías web de los diferentes gobiernos en el mundo. Algunas de interés que no he nombrado son:

El artículo "Official Usability, User Experience & User Interface Guidelines From Companies" de usabilitygeek.com, repasa las diferentes guías de directrices de compañías concretas (Adobe, Apple, IBM, Microsoft, etc.) aunque la que más me gusta es la de SUN, pero la de 1995: Sun Guide to Web Style

¿Añadirías alguna más?

Artículos anteriores