Usabilidad en sitios web
de organismos públicos
Optimizando la
interacción con el ciudadano
Diana Rodríguez, 2013 1
Primer...
¿Qué es la usabilidad?
Diana Rodríguez, 2013 2
Peter Morville
útil
deseable
valioso
utilizable
encontrable accesible
creíb...
Diana Rodríguez, 2013 3
“el atributo de calidad que mide lo fáciles
de usar que son las interfaces web.
Es decir un sitio ...
Diana Rodríguez, 2013 4
Fácil
Conduce
al obj.
Placentero
Aprender
Recordar
Utilizar
Diana Rodríguez, 2013 5
Usabilidad
Satisfacción
Éxito
Tiempo
Diana Rodríguez, 2013 6
Tarea
ContextoPersona
Diana Rodríguez, 2013 7
Percibe
Conoce
Necesita
Steve Krug
Diana Rodríguez, 2013 8
Cinco claves
 Crear una jerarquía visual
 Aprovechar las convenciones
 Dividir las páginas en zonas claramente
definida...
Tres leyes
 No me hagas pensar
 No importa cuántos clics deba hacer,
siempre y cuando cada clic sea una
elección inconsc...
 Conozca al usuario
 Organice y diseñe según lo que
el acostumbra y necesita
 Sea simple
 Marque. Agrupe. Separe
 Evi...
Tips para Webs públicas
Una web pública, ha de resultar:
 obvia
 clara y fácil de entender
 eficiente
El visitante debe...
Página de inicio
 Información institucional esencial y justa para
el usuario
Diana Rodríguez, 2013 13
Diana Rodríguez, 2013 14
• hipervínculos destacados, con texto de anclaje
claro e inequívoco a los formularios necesarios
Diana Rodríguez, 2013 15
y a las partes más importantes para el usuario
Y en el resto del sitio
El nombre del sitio y el logo de la institución en
la parte superior izquierda de todas las página...
Diana Rodríguez, 2013 17
El nombre de cada página:
• en el ángulo superior izquierdo
• en fuente y font destacados
• coinc...
Diana Rodríguez, 2013 18
Diana Rodríguez, 2013 19
Contenidos
• Consistente a lo largo del sitio
• Organizado según
• Usuarios
• Tarea
• Diseño agra...
Diana Rodríguez, 2013 20
El texto informativo estará:
• Organizado en forma piramidal
• Agrupado según temática en bloques...
Diana Rodríguez, 2013 21
Diana Rodríguez, 2013 22
Diana Rodríguez, 2013 23
Salvo que se encuentre un ícono mejor, respetar
las convenciones. De lo contrario, reforzar
Diana Rodríguez, 2013 24
Colocar un menú migas de pan en la parte
superior de cada página, para orientar al usuario
Diana Rodríguez, 2013 25
Los hipervínculos:
• En correcto funcionamento
• Resaltados según convención y estilo
• Texto de ...
Diana Rodríguez, 2013 26
Colocar en lugar visible varios medios de contacto:
• Tradicional (T.E)
• Mail
• Redes sociales
Diana Rodríguez, 2013 27
Recomendables para colocar en la sección
superior de la página:
• Buscador interno
• Menú de nave...
Diana Rodríguez, 2013 28
Y… los formularios
Diana Rodríguez, 2013 29
• Enlazados en la página principal
• Etiquetados de la misma manera en los
men...
Diana Rodríguez, 2013 30
Diana Rodríguez, 2013 31
Ventajas de la usabilidad
Diana Rodríguez, 2013 32
• Incrementa la satisfacción del usuario
• Promueve el uso de la sede W...
Evaluando la usabilidad
Diana Rodríguez, 2013 33
• Test con usuarios
• Evaluación por expertos (o heurística)
• Card sorti...
Jakob Nielsen
Diana Rodríguez, 2013 34
10 reglas
generales
Para la evaluación heurística
Diana Rodríguez, 2013 35
1. Visibilidad del estado del sistema
2. Relación entre el sistema y el
mundo real
3. Control y l...
Diana Rodríguez, 2013 36
6. Reconocimiento antes que
recuerdo
7. Flexibilidad y eficiencia de uso
8. Estética y diseño min...
¿Preguntas?
Diana Rodríguez, 2013 37
Diana Rodríguez, 2013 38
Bibliografía
 Hassan Montero, Y. y Ortega Santamaría, S. Informe APEI sobre usabilidad.
(en líne...
Diana Rodríguez, 2013 39
¡Muchas gracias!
Mtr. Diana Rodríguez
dianainforma@gmail.com
www.dianarodriguezcursos.com/
Upcoming SlideShare
Loading in...5
×

Usabilidad en sitios web de organismos públicos Optimizando la interacción con el ciudadano

413

Published on

Ponencia presentada en el I ENCUENTRO DE
AGENTES DE BIBLIOTECAS
Y BIBLIOTECARIOS DEL MERCOSUR

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
413
On Slideshare
0
From Embeds
0
Number of Embeds
6
Actions
Shares
0
Downloads
4
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Usabilidad en sitios web de organismos públicos Optimizando la interacción con el ciudadano

  1. 1. Usabilidad en sitios web de organismos públicos Optimizando la interacción con el ciudadano Diana Rodríguez, 2013 1 Primer Encuentro de Agentes de Bibliotecas y Bibliotecarios del Mercosur Biblioteca Pública De Las Misiones. Posadas, 22 y 23 de Agosto de 2013
  2. 2. ¿Qué es la usabilidad? Diana Rodríguez, 2013 2 Peter Morville útil deseable valioso utilizable encontrable accesible creíble
  3. 3. Diana Rodríguez, 2013 3 “el atributo de calidad que mide lo fáciles de usar que son las interfaces web. Es decir un sitio web usable es aquél en el que los usuarios pueden interactuar de la forma más fácil, cómoda, segura e inteligentemente posible.” (Wikipedia)
  4. 4. Diana Rodríguez, 2013 4 Fácil Conduce al obj. Placentero Aprender Recordar Utilizar
  5. 5. Diana Rodríguez, 2013 5 Usabilidad Satisfacción Éxito Tiempo
  6. 6. Diana Rodríguez, 2013 6 Tarea ContextoPersona
  7. 7. Diana Rodríguez, 2013 7 Percibe Conoce Necesita
  8. 8. Steve Krug Diana Rodríguez, 2013 8
  9. 9. Cinco claves  Crear una jerarquía visual  Aprovechar las convenciones  Dividir las páginas en zonas claramente definidas  Dejar bien claro sobre lo que se puede hacer clik  Minimizar el ruido Diana Rodríguez, 2013 9
  10. 10. Tres leyes  No me hagas pensar  No importa cuántos clics deba hacer, siempre y cuando cada clic sea una elección inconsciente e inequívoca  Deshágase de la mitad de las palabras de cada página, a continuación, deshágase de la mitad de las que quedan. Diana Rodríguez, 2013 10
  11. 11.  Conozca al usuario  Organice y diseñe según lo que el acostumbra y necesita  Sea simple  Marque. Agrupe. Separe  Evite el error. Permita arrepentirse  No haga perder tiempo Diana Rodríguez, 2013 11
  12. 12. Tips para Webs públicas Una web pública, ha de resultar:  obvia  clara y fácil de entender  eficiente El visitante debe sentir que vale la pena continuar explorándolo y utilizándolo. Diana Rodríguez, 2013 12
  13. 13. Página de inicio  Información institucional esencial y justa para el usuario Diana Rodríguez, 2013 13
  14. 14. Diana Rodríguez, 2013 14 • hipervínculos destacados, con texto de anclaje claro e inequívoco a los formularios necesarios
  15. 15. Diana Rodríguez, 2013 15 y a las partes más importantes para el usuario
  16. 16. Y en el resto del sitio El nombre del sitio y el logo de la institución en la parte superior izquierda de todas las páginas Diana Rodríguez, 2013 16
  17. 17. Diana Rodríguez, 2013 17 El nombre de cada página: • en el ángulo superior izquierdo • en fuente y font destacados • coincide con su etiqueta: • en el menú • los textos de anclaje que la vinculen
  18. 18. Diana Rodríguez, 2013 18
  19. 19. Diana Rodríguez, 2013 19 Contenidos • Consistente a lo largo del sitio • Organizado según • Usuarios • Tarea • Diseño agradable a la vista • Contraste texto-fondo
  20. 20. Diana Rodríguez, 2013 20 El texto informativo estará: • Organizado en forma piramidal • Agrupado según temática en bloques visiblemente demarcados • Con las palabras clave resaltadas en negrita • Ubicado en las zonas “calientes” de la página
  21. 21. Diana Rodríguez, 2013 21
  22. 22. Diana Rodríguez, 2013 22
  23. 23. Diana Rodríguez, 2013 23 Salvo que se encuentre un ícono mejor, respetar las convenciones. De lo contrario, reforzar
  24. 24. Diana Rodríguez, 2013 24 Colocar un menú migas de pan en la parte superior de cada página, para orientar al usuario
  25. 25. Diana Rodríguez, 2013 25 Los hipervínculos: • En correcto funcionamento • Resaltados según convención y estilo • Texto de anclaje • Claro y comprensible por el usuario • Indicativo
  26. 26. Diana Rodríguez, 2013 26 Colocar en lugar visible varios medios de contacto: • Tradicional (T.E) • Mail • Redes sociales
  27. 27. Diana Rodríguez, 2013 27 Recomendables para colocar en la sección superior de la página: • Buscador interno • Menú de navegación • Árbol del sitio • Facilitadores para lectura por disminuidos visuales • Opciones de compartir en redes • Formulario de logueo/registro • Opción de descarga de aplicación móvil (si existe)
  28. 28. Diana Rodríguez, 2013 28
  29. 29. Y… los formularios Diana Rodríguez, 2013 29 • Enlazados en la página principal • Etiquetados de la misma manera en los menús y páginas • URL propia • Con las palabras clave CONTACTO, RECLAMO, DENUNCIA o QUEJA en la URL • Lenguaje comprensible por el usuario • Permita volver y/o corregir error • No induzca a confusión • Intuitivo
  30. 30. Diana Rodríguez, 2013 30
  31. 31. Diana Rodríguez, 2013 31
  32. 32. Ventajas de la usabilidad Diana Rodríguez, 2013 32 • Incrementa la satisfacción del usuario • Promueve el uso de la sede Web • Estimula la participación e interacción con los habitantes y ciudadanos • Aporta valor a la institución • Facilita la gestión de trámites • Aumenta la visibilidad institucional • Economiza en costos de mantenimiento y mesas de ayuda
  33. 33. Evaluando la usabilidad Diana Rodríguez, 2013 33 • Test con usuarios • Evaluación por expertos (o heurística) • Card sorting • Eye-tracking • Etnografía, entrevistas, encuestas y analítica Web
  34. 34. Jakob Nielsen Diana Rodríguez, 2013 34 10 reglas generales Para la evaluación heurística
  35. 35. Diana Rodríguez, 2013 35 1. Visibilidad del estado del sistema 2. Relación entre el sistema y el mundo real 3. Control y libertad del usuario 4. Consistencia y estándares 5. Prevención de errores
  36. 36. Diana Rodríguez, 2013 36 6. Reconocimiento antes que recuerdo 7. Flexibilidad y eficiencia de uso 8. Estética y diseño minimalista 9. Ayudar a los usuarios a reconocer, diagnosticar y recuperarse de errores 10. Ayuda y documentación
  37. 37. ¿Preguntas? Diana Rodríguez, 2013 37
  38. 38. Diana Rodríguez, 2013 38 Bibliografía  Hassan Montero, Y. y Ortega Santamaría, S. Informe APEI sobre usabilidad. (en línea). Disponible en URL: http://www.nosolousabilidad.com/manual/1.htm (acceso 17/08/2013)  Krug, S. Haz fácil lo imposible. La guía para detectar y determinar los problemas de usabilidad. Anaya. Madrid, 2010.  Krug, S. No me hagas pensar. Una aproximación a la usabilidad en la Web. 2ª.ed. Pearson. Madrid, 2006.  Nielsen, J. y Loranger, H. Usabilidad. Prioridad en el diseño web.Anaya. Madrid,2007
  39. 39. Diana Rodríguez, 2013 39 ¡Muchas gracias! Mtr. Diana Rodríguez dianainforma@gmail.com www.dianarodriguezcursos.com/
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×