Presentacion del borrador de Directrices de Usabilidad
-
Upload
mario-carvajal -
Category
Design
-
view
1.681 -
download
3
description
Transcript of Presentacion del borrador de Directrices de Usabilidad
![Page 1: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/1.jpg)
Directrices de Usabilidad para sitios web del Estado colombiano
Enrique CusbaMario CarvajalJuan Saab
![Page 2: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/2.jpg)
Marco Fidel y su certificado en línea
![Page 3: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/3.jpg)
![Page 4: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/4.jpg)
![Page 5: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/5.jpg)
![Page 6: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/6.jpg)
![Page 7: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/7.jpg)
![Page 8: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/8.jpg)
autoculpa
![Page 9: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/9.jpg)
“Fabio, vení y me ayudás”
![Page 10: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/10.jpg)
63%Fallos en esta misma tarea
![Page 11: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/11.jpg)
Para ver esta película, debedisponer de QuickTime™ y de
un descompresor H.264.
![Page 13: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/13.jpg)
¿Cómo reducir el 63% de tasa de
fracaso?
![Page 15: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/15.jpg)
• Ejemplos ilustrados.
• Respaldo en investigaciones con usuarios.
• Actualizaciones y revisiones permanentes.
• Inclusión de un capítulo sobre pruebas con usuarios.
• Priorización de las directrices.
• Discrecionalidad en el cumplimiento de directrices, según el “contexto de uso”.
• Cobertura sector privado.
• Descarga de plantillas.
Research-based Web Design & Usability Guidelines
![Page 16: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/16.jpg)
Swedish National Guidelines for Public Sector Websites
• Explicación amplia y suficiente de cada directriz.
• Métodos de verificación.
• Plantillas de requerimientos para proveedores.
• Distribución en formato digital (HTML y PDF) pero también en formato físico.
![Page 17: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/17.jpg)
New Zealand Government Web Standards 2.0
• Numeración de las directrices.
• Alcance institucional.
• Accesibilidad web en la NTC.
![Page 18: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/18.jpg)
Guía para desarrollo de sitios web Guía Web 1.0 y 2.0
• Guía sobre licitación y contratación de productos digitales.
• Filtro por roles.
• Extensa y robusta bibliografía.
• Proveer una matriz de evaluación.
• Distribución en PDF completo y por partes.
• Observatorio de usabilidad y accesibilidad.
• Involucrar las directrices como bases de concursos que premien las buenas prácticas.
![Page 19: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/19.jpg)
• Reino Unido
• Tasmania
• India
• México
• Uruguay
• Buenos Aires
• Bogotá.
más y más experiencias...
![Page 20: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/20.jpg)
y además en la empresa privada
![Page 21: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/21.jpg)
Panel de Morville
![Page 22: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/22.jpg)
Los roles y las facetas
![Page 23: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/23.jpg)
![Page 24: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/24.jpg)
En “Usabilidad, prioridad en el diseño Web”. Nielsen J; Lorager H
![Page 25: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/25.jpg)
“Un manual de Usabilidad debe ser fácil de usar”
![Page 26: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/26.jpg)
Encabezado: Claro, atractivo y usable
![Page 27: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/27.jpg)
¿Qué es y porqué aplicar la directriz?
![Page 28: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/28.jpg)
Ayuda para desarrollarla y verificarla
![Page 29: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/29.jpg)
Temas de las directrices
![Page 30: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/30.jpg)
Arquitectura de Información
13 directrices
![Page 31: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/31.jpg)
• Objetivos del portal web• Personajes y escenarios• Necesidades de los usuarios• Evaluación constante• Evaluación de la arquitectura de la información• Navegación global consistente• Navegación de contexto• Ruta de migas• URL limpios• Ubicación del usuario• Tagline• Enlaces bien formulados• Memoria a corto plazo
![Page 32: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/32.jpg)
Diseño de interfaz de usuario
19 directrices
![Page 33: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/33.jpg)
• Ubicación del logotipo• Diseño ordenado y limpio• Interfaces en movimiento• Contenido que parece publicidad• Contraste en brillo y color• Información transmitida a través del color• Justificación del texto• Ancho del cuerpo del texto• Fuentes tipográficas comunes• Texto subrayado• Uso adecuado del espacio en blanco• Desplazamiento horizontal• Vínculo a la página de inicio• Tareas claves en la página de inicio• Contenidos de ejemplo en la página de inicio• Hojas de estilo para diferentes formatos• Independencia del navegador• Vínculos visitados• Calidad del código
![Page 34: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/34.jpg)
Diseño de interacción
9 directrices
![Page 35: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/35.jpg)
• Campos obligatorios
• Asociación de etiquetas y campos
• Validación dinámica de datos
• Error de página no encontrada
• Ventanas emergentes
• Botón atrás
• Tiempo de carga de las páginas
• Ejemplos en los campos del formulario
• Páginas de confirmación
![Page 36: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/36.jpg)
Búsqueda
4 directrices
![Page 37: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/37.jpg)
• Motor de búsqueda y ubicación
• Búsquedas con términos familiares y errores de digitación
• Sugerencias de búsqueda
• Ubicación en los 10 primeros resultados
![Page 38: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/38.jpg)
Pruebas de usuario
3 directrices
![Page 39: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/39.jpg)
• Evaluación heurística
• Test de usuario
• Diseño y evaluación iterativos
![Page 40: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/40.jpg)
Contenido
7 directrices
![Page 41: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/41.jpg)
• Contenido útil
• Pirámide invertida
• Títulos y encabezados
• Listas
• Escaneado de contenido
• Vínculos rotos
• Contenido encontrable
![Page 42: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/42.jpg)
¡Animate a participar!
bit.ly/guiausabilidad
![Page 43: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/43.jpg)
@gobiernoenlinea@astromario@juan
saab
![Page 44: Presentacion del borrador de Directrices de Usabilidad](https://reader034.fdocuments.mx/reader034/viewer/2022051514/548238d7b4af9faf0d8b470c/html5/thumbnails/44.jpg)
¡Muchas Gracias!
@gobiernoenlinea@astromario@juansaab