USABILIDAD WEB. TEORÍA Y USO

PREFACIO

CONTENIDO

ORIENTACIÓN A LOS LECTORES

AGRADECIMIENTOS

CAPÍTULO 1. INTRODUCCIÓN
1.1 LA INTERACCIÓN PERSONA-ORDENADOR (IPO/HCI)
1.1.1 Principios de interacción de Licklider y Clark
1.1.2 Principios para el diseño de sistemas interactivos de Hansen
1.1.3 La interfaz de usuario
1.2 LA USABILIDAD
1.2.1 Qué es la usabilidad
1.2.2 Usabilidad objetiva o inherente
1.2.3 Usabilidad subjetiva o aparente
1.2.4 Cómo se puede asegurar la usabilidad

CAPÍTULO 2. INGENIERÍA DE LA USABILIDAD
2.1 ESPECIFICACIÓN
2.1.1 Análisis del perfil de los usuarios
2.1.2 Identificación de las tareas
2.1.3 Especificaciones de usabilidad
2.2 DISEÑO
2.2.1 Diseño de la interacción
2.2.2 Prototipado
2.2.3 El diseño centrado en el usuario (DCU)
2.2.4 Diseño participativo o cooperativo (DPoC)
2.3 EVALUACIÓN
2.3.1 Clasificación
2.3.2 Métodos de Inspección
2.3.3 Métodos de indagación o sondeo
2.3.4 Métodos de testing

CAPÍTULO 3. PRINCIPIOS DE USABILIDAD
3.1 PRINCIPIOS BÁSICOS
3.2 PRINCIPIOS GENERALES
3.2.1 Empatía con los usuarios
3.2.2 Documentación y material de apoyo
3.2.3 Prevención de errores y retroalimentación
3.2.4 Facilidad de aprendizaje y uso
3.2.5 Flexibilidad
3.2.6 Consistencia
3.2.7 Robustez
3.2.8 Adecuación
3.2.9 Tiempos de respuesta
3.2.10 Disminución de la carga cognitiva y accesibilidad
3.3 HEURÍSTICAS DE NIELSEN Y MOLICH
3.3.1 Visibilidad del estado del sistema
3.3.2 Relación entre el sistema y los usuarios
3.3.3 Control y libertad para el usuario
3.3.4 Consistencia y estándares
3.3.5 Prevención de errores
3.3.6 Reconocer antes que recordar
3.3.7 Flexibilidad y eficiencia de uso
3.3.8 Diálogos estéticos y diseño minimalista
3.3.9 Reconocimiento, diagnóstico y recuperación de errores
3.3.10 Ayuda y documentación
3.4 PRINCIPIOS DE DISEÑO DE INTERACCIÓN DE TOGNAZZINI
3.4.1 Estética
3.4.2 Anticipación
3.4.3 Autonomía
3.4.4 Color
3.4.5 Consistencia
3.4.6 Valores por defecto o predeterminados
3.4.7 Eficacia del usuario
3.4.8 Interfaces explorables
3.4.9 Objetos humanos
3.4.10 Reducción de latencia
3.4.11 Aprendizaje
3.4.12 Uso de metáforas
3.4.13 Protege el trabajo del usuario
3.4.14 Legibilidad
3.4.15 Estado
3.4.16 Navegación visible
3.5 PRINCIPIOS DE SHNEIDERMAN
3.5.1 Consistencia
3.5.2 Shortcuts (atajos).
3.5.3 Retroalimentación informativa y diálogo
3.5.4 Gestión de errores
3.5.5 Reversibilidad de acciones
3.5.6 Control total
3.5.7 Reducirla la carga cognitiva
3.6 PRINCIPIOS DE DISEÑO DE NORMAN
3.6.1 Visibilidad
3.6.2 Retroalimentación (feedback)
3.6.3 Posibilidades o potencialidades (Affordance)
3.6.4 Limitaciones
3.7 PRINCIPIOS DE USABILIDAD DE KRUG
3.7.1 Usabilidad es
3.7.2 Las interfaces deben ser intuitivas
3.7.3 No me hagas pensar
3.7.4 No pierdas mi tiempo
3.7.5 Los usuarios se aferran al botón atrás
3.7.6 Somos criaturas de hábito
3.7.7 No hay tiempo para charlas pequeñas
3.7.8 No pierdas la búsqueda
3.7.9 Formamos mapas del sitio mentales
3.7.10 Haz fácil ir a la home
3.8 OTROS PRINCIPIOS
3.8.1 Principios de Simpson
3.8.2 Principios de diseño de interacción de Preece
3.8.3 Principios de diseño de Mandel
3.8.4 Principios de diseño de Dix

CAPÍTULO 4. INDICADORES Y MÉTRICAS DE USABILIDAD
4.1 GENERALIDADES
4.1.1 Ley de Pareto
4.1.2 Ley de Fitts
4.1.3 Ley de Hick
4.1.4 Ley de los 3 clics
4.1.5 Mapas de calor o heatmaps
4.1.6 Mapas de clics o clickmaps
4.1.7 Analítica de formularios
4.2 MÉTRICAS DE USABILIDAD
4.3 MÉTRICAS CUANTITATIVAS
4.3.1 Eficacia de la eliminación de defectos
4.3.2 Disponibilidad de la interfaz o sistema
4.3.3 Fiabilidad de la interfaz o sistema
4.3.4 Número de errores
4.3.5 Número de errores por unidad de tiempo
4.3.6 Número de tareas que pueden realizarse
4.3.7 Porcentaje de enlaces rotos
4.3.8 Porcentaje de presencia de propiedades en los objetos o elementos
4.3.9 Porcentaje de tareas finalizadas con éxito
4.3.10 Porcentaje de tareas finalizadas con éxito al primer intento
4.3.11 Porcentaje de usuarios capaces de finalizar las tareas clave sin ayuda
4.3.12 Tiempo de permanencia
4.3.13 Tiempo de finalización de la tarea
4.3.14 Tiempo de latencia
4.4 MÉTRICAS CUALITATIVAS
4.4.1 Dificultad de la tarea
4.4.2 Expectativas
4.4.3 Facilidad de mantenimiento
4.4.4 Nivel de satisfacción de la prueba
4.4.5 Tiempo de reacción del usuario4.5 OTRAS MÉTRICAS DE INTERÉS
4.5.1 Click Through Rate (CTR)
4.5.2 Páginas vistas / clics
4.5.3 Tasa de Conversión
4.5.4 Tasa de rebote
4.5.5 Ticket medio

CAPÍTULO 5. MÉTODOS DE EVALUACIÓN
5.1 TEST HEURÍSTICO
5.1.1 Creación de un test heurístico
5.1.2 Proceso de evaluación de un test heurístico
5.2 TEST DE USABILIDAD
5.2.1 Etapas de un test de usabilidad
5.2.2 Ejemplos de preguntas de un test de usabilidad
5.3 TEST A/B
5.3.1 Etapas de un test A/B
5.4 MÉTODO SIRIUS
5.4.1 Qué es Sirius
5.4.2 Heurísticas y subheurísticas
5.4.3 Métrica de evaluación
5.5 MÉTODO MUSIC
5.6 PRUEBAS UNITARIAS
5.6.1 Creación de una prueba unitaria
5.7 PRUEBAS ALFA
5.8 PRUEBAS BETA
5.9 EJEMPLOS DE TEST
5.9.1 Cuestionario de usuario
5.9.2 Cuestionario de evaluación heurística

CAPÍTULO 6. DISEÑO CENTRADO EN LA USABILIDAD
6.1 LA ARQUITECTURA
6.1.1 Hojas de estilo
6.1.2 JavaScript
6.1.3 Metadatos
6.1.4 Bases de datos
6.1.5 Seguridad
6.2 ESTRUCTURA
6.2.1 Cabecera
6.2.2 Pie de página
6.2.3 Reglas sobre el contenido
6.3 LAS FORMAS
6.3.1 El círculo
6.3.2 La línea
6.3.3 El triángulo
6.3.4 El cuadrado
6.3.5 El polígono
6.3.6 La espiral
6.3.7 La cruz
6.3.8 La composición
6.3.9 La teoría de la Gestalt
6.4 LOS COLORES
6.4.1 Los modelos de color
6.4.2 Luminancia relativa
6.4.3 El color corporativo
6.4.4 El significado de los colores
6.5 LA LEGIBILIDAD
6.5.1 La tipografía
6.5.2 Qué tipo de fuente se debe utilizar
6.5.3 La alineación horizontal
6.5.4 El ancho de párrafo
6.5.5 El tamaño de la fuente
6.5.6 El interlineado
6.5.7 La justificación
6.5.8 La luminancia relativa
6.6 LOS CONTENIDOS
6.6.1 Los buscadores
6.6.2 El multiidioma
6.6.3 Los mensajes del sistema
6.6.4 La temporalidad
6.6.5 Los textos legales
6.6.6 El desplazamiento vertical
6.6.7 La relevancia
6.6.8 La longitud
6.6.9 La publicidad
6.6.10 Las páginas de introducción o splash
6.6.11 Las páginas en construcción
6.6.12 El uso de la caché
6.6.13 Las llamadas AJAX
6.6.14 Los vínculos a webs externas
6.6.15 Menos es más
6.7 LA NAVEGACIÓN
6.7.1 Menús de navegación
6.7.2 Barras de navegación
6.7.3 Barras de tabulación (pestañas)
6.7.4 Menús de hamburguesa
6.7.5 Migas de pan
6.8 LOS FORMULARIOS
6.8.1 Agrupación y orden
6.8.2 Autocompletado
6.8.3 Estructuración y optimización
6.8.4 Capacidades de los dispositivos
6.8.5 Combos o desplegables
6.8.6 Número de campos
6.8.7 Nombres de campo
6.8.8 Tipos de datos estándar
6.8.9 Botones y enlaces
6.8.10 Rangos de valores
6.9 LOS MARCOS O FRAMES
6.9.1 Por qué no se deben utilizar
6.10 LAS TABLAS
6.10.1 Por qué no se recomienda su uso
6.10.2 Tablas usables y accesibles
6.10.3 Tablas responsive
6.11 LAS IMÁGENES
6.11.1 Texto alternativo
6.11.2 Tamaño
6.11.3 Uso decorativo
6.11.4 Tipografías icónicas
6.11.5 Sprites
6.11.6 Logos
6.11.7 Imágenes responsive
6.12 LOS BANNERS
6.12.1 Posición
6.12.2 Situación
6.12.3 Tamaño
6.12.4 Contexto
6.13 LOS CARRUSELES O SLIDERS
6.13.1 Uso de JavaScript
6.13.2 Número de diapositivas
6.13.3 Posición
6.13.4 Transiciones
6.13.5 Parada y reanudación
6.14 INFOGRAFÍAS
6.15 BARRAS DE PROGRESO
6.16 VIDEOS Y MULTIMEDIA
6.16.1 Codecs de audio
6.16.2 Codecs de video
6.16.3 Almacenamiento
6.16.4 Subtítulos y descripción de audio
6.16.5 Parada y reanudación
6.16.6 Tamaño accesible en móviles
6.17 LAS VENTANAS EMERGENTES O POP-UPS
6.17.1 Por qué no se deben utilizar
6.17.2 Título
6.17.3 Mensajes
6.17.4 Botones
6.17.5 Acciones separadas
6.17.6 Contenido
6.17.7 Estructura y organización
6.17.8 Transiciones o efectos
6.18 LA SIMPLICIDAD COMO RECURSO
6.18.1 Simplificación
6.18.2 Innovación
6.18.3 Minificación
6.18.4 Ponderación
6.18.5 Lucubración
6.18.6 Instado
6.18.7 Confianza
6.18.8 Integración
6.18.9 División
6.18.10 Aprendizaje
6.18.11 Diferenciación

CAPÍTULO 7. DISEÑO CENTRADO EN LA ACCESIBILIDAD
7.1 QUÉ ES LA ACCESIBILIDAD WEB
7.1.1 Tipos de discapacidad
7.2 LEGISLACIÓN Y LA WCAG 2.0
7.3 COMPRENDIENDO EL ESTÁNDAR SMIL
7.3.1 Módulos de SMIL
7.3.2 Ejemplo de contenido SMIL
7.4 COMPRENDIENDO LA INICIATIVA WAI ARIA
7.4.1 Partes de la WAI ARIA
7.4.2 Soporte en navegadores y productos de apoyo
7.5 PAUTAS DE ACCESIBILIDAD PARA EL CONTENIDO WEB
7.5.1 Principios y directrices
7.5.2 Niveles de conformidad
7.5.3 Criterios de conformidad

ANEXO. HERRAMIENTAS Y RECURSOS
RECURSOS PARA DESARROLLO Y EVALUACIÓN
Validadores y herramientas de accesibilidad y usabilidad web
Google AMP
Google PageSpeed Insights
Google Optimizer
RECURSOS W3C
Lenguaje de Integración Multimedia Sincronizado (SMIL 3.0)
Guía para desarrolladores de la WAI ARIA
Cómo cumplir con WCAG 2.0
Guía Breve de Web Semántica
LECTURAS RECOMENDADAS
Interaction Design Foundation
NN/g Nielsen Norman Group
Primeros principios de diseño de interacción de Bruce Tognazzini
Las ocho reglas de oro del diseño de interfaz de Ben Shneiderman
Advanced Common Sense
Las reglas de oro del diseño de interfaces de usuario de Mandel
Diseño de Interacción: Más allá de la Interacción Humana con Computadora
Blog de Alan Dix
The MUSIC Performance Measurement Method

BIBLIOGRAFÍA
"

Que una interfaz esté pensada para dar una cierta experiencia de usuario no significa que sea usable. Dicho de otro modo, que la interacción del sistema con el usuario sea buena no quiere decir que las tareas a realizar se hagan correctamente. La usabilidad es por tanto, una característica que no debe ser clasificada como algo opcional o de valor añadido, se debe tomar como un requerimiento más en el desarrollo de aplicaciones y sitios web, desde su inicio.
Su objetivo es especificar, diseñar y evaluar de forma cuantitativa y cualitativa la efectividad, eficiencia y satisfacción que consiguen los usuarios tras la finalización de una tarea concreta en un entorno controlado. La usabilidad puede incluso, definir una estrategia de contenidos, especificar o descartar una arquitectura o predecir el éxito o fracaso de un sistema o interfaz.
Conocer las directrices, reglas de los principales autores, métricas más utilizadas y varios de los posibles métodos de evaluación proporcionará una visión global para diagnosticar y solucionar los errores más frecuentes o habituales en el proceso de diseño. Conocer, además, cómo volver accesibles los contenidos y dotarlos con esta cualidad, causará que aumente el número de visitas, que aumente el número de usuarios satisfechos y, como consecuencia, que aumenten los beneficios de la empresa u organización.
Este libro, por ende, pretende ser un epítome y manual práctico de consulta para conseguir entender cómo afecta la usabilidad web en la interacción persona-ordenador y obtener unas directrices o herramientas para llegar a hacer más usables y accesibles los interfaces de páginas web, de aplicaciones móviles y sistemas en general.