8. Escuela Superior de Arte y Espectáculos
Navegabilidad
Usabilidad
Accesibilidad
9. Escuela Superior de Arte y Espectáculos
Definiciones
• La accesibilidad web se refiere a la capacidad de acceso a la Web y a sus
contenidos por todas las personas independientemente de la discapacidad
(física, intelectual o técnica) que presenten o de las que se deriven del
contexto de uso (tecnológicas o ambientales). Esta cualidad está
íntimamente relacionada con la usabilidad.
• “La usabilidad” (dentro del campo del desarrollo web) es la disciplina que
estudia la forma de diseñar sitios web para que los usuarios puedan
interactuar con ellos de la forma más fácil, cómoda e intuitiva
posible.
• Podríamos definir la navegabilidad de un sitio web como aquellas
propiedades de la interactividad del sitio que permiten que el usuario del
mismo sea capaz de moverse por su estructura e identificar las diferentes
secciones y contenidos de una forma sencilla y efectiva y sin perderse en él.
11. Escuela Superior de Arte y Espectáculos
Legislación
• Internacional
• Europea:
Resolución del Parlamento Europeo sobre la Comunicación de
la Comisión “eEurope 2002: Accesibilidad de las sitios Web
públicos y de su contenido” (COM(2001) 529 – c5-0074/2002 –
2002/2032(COS)). Abril del 2002. En el punto 30: “Subraya que para que
los sitios web sean accesibles es fundamental que satisfagan el nivel doble A y
que se aplique en su totalidad la prioridad 2 de las Pautas WAI
12. Escuela Superior de Arte y Espectáculos
En España
La ley 34/2002, de 11 de julio, de servicios de la sociedad de la información y de comercio
electrónico (LSSICE). Publicada en el B.O.E. el 12 de julio.
Sobre accesibilidad la ley dice, en sus disposiciones adicionales:
Quinta. Accesibilidad para las personas con discapacidad y de edad avanzada a la información proporcionada por
medios electrónicos.
Uno. Las Administraciones Públicas adoptarán las medidas necesarias para que la información
disponible en sus respectivas páginas de Internet pueda ser accesible a personas con discapacidad y
de edad avanzada de acuerdo con los criterios de accesibilidad al contenido generalmente reconocidos antes del 31 de
diciembre de 2005. Asimismo, podrán exigir que las páginas de Internet cuyo diseño o mantenimiento financien apliquen
los criterios de accesibilidad antes mencionados.
Dos. Igualmente, se promoverá la adopción de normas de accesibilidad por los prestadores de servicios y los fabricantes
de equipos y software, para facilitar el acceso de las personas con discapacidad o de edad avanzada a los contenidos
digitales.
13. Escuela Superior de Arte y Espectáculos
En España
LEY 51/2003, de 2 de diciembre, de igualdad de oportunidades, no discriminación y
accesibilidad universal de las personas con discapacidad.
Disposición final séptima. Condiciones básicas de accesibilidad y no discriminación para el acceso y utilización de las
tecnologías, productos y servicios relacionados con la sociedad de la información y medios de comunicación social.
1. En el plazo de dos años desde la entrada en vigor de esta ley, el Gobierno aprobará, según lo previsto en su artículo
10, unas condiciones básicas de accesibilidad y no discriminación para el acceso y utilización de las tecnologías,
productos y servicios relacionados con la sociedad de la información y de cualquier medio de comunicación social, que
serán obligatorias en el plazo de cuatro a seis años desde la entrada en vigor de esta ley para todos los productos y
servicios nuevos, y en el plazo de ocho a diez años para todos aquellos existentes que sean susceptibles de ajustes
razonables.
2. En el plazo de dos años desde la entrada en vigor de esta ley, el Gobierno deberá realizar los estudios integrales sobre
la accesibilidad a dichos bienes o servicios que se consideren más relevantes desde el punto de vista de la no
discriminación y accesibilidad universal.
14. Escuela Superior de Arte y Espectáculos
Perfiles
• Personas con discapacidades
• Dispositivos móviles
15. Escuela Superior de Arte y Espectáculos
Discapacitados
• Tipos de Limitaciones
• Dispositivos
• http://www.desarrolloweb.com/articulos/
accesibilidad-web-tecnologias-auxiliares.html
• http://www.desarrolloweb.com/articulos/
ejemplos/este_articulo_jaws.mp3
17. Escuela Superior de Arte y Espectáculos
Ejercicio
Principios WAI:
Perceptibilidad
Operabilidad
Comprensibilidad
Robustez
18. Escuela Superior de Arte y Espectáculos
Evaluación
• Automática
• Manual : http://www.visionaustralia.org.au/
ais/toolbar/ y https://addons.mozilla.org/
en-US/firefox/addon/60
• Test de Usuarios
19. Escuela Superior de Arte y Espectáculos
Ejemplos de integración
• Tamaños de letra : http://www.assignia.com/
presentacion/
• Integración de vídeos: www.mundo21.org
24. ¿Qué piden los
Escuela Superior de Arte y Espectáculos
usuarios?
Los usuarios definen 4 causas principales para volver a
visitar un site:
•
Contenidos y servicios.
•
Actualizaciones.
•
Rapidez.
•
Facilidad de Uso.
25. La interacción Persona-
Escuela Superior de Arte y Espectáculos
Ordenador (IPO)
Hansen (1971) en su libro "User Engineering
Principles for Interactive Systems":
1. Conocer al usuario
2. Minimizar la memorización
3. Optimizar las operaciones
4. Facilitar buenos mensajes de error y crear diseños
que eviten los errores más comunes
26. Conceptos
Escuela Superior de Arte y Espectáculos
fundamentales
Repasamos:
• estructura clara
• seguir las convenciones
• enlaces visibles
• secciones
• minimizar ruido
28. Elementos
Escuela Superior de Arte y Espectáculos
fundamentales
• Uso de colores
• Uso de fuentes
• Escribir para la web
• Urls
• Tamaños de pantalla
29. Escuela Superior de Arte y Espectáculos
Uso de Colores
• ¿Por qué una buena elección es fundamental?
• Hacerlo dentro del rango de 256 colores pero
no más de 3...
• Armonizar los colores (contrastes y familia tonal)
• Elección en función de factores objetivos:
marketing, corporativo, significación
36. Escuela Superior de Arte y Espectáculos
Uso de Fuentes
• Tamaño : 12 pt. Nunca menos de 9pt.
• Fuentes comunes : Times New Roman,
Georgia (serif fonts), Arial, Helvetica, o Verdana
(sans serif fonts).
38. Escuela Superior de Arte y Espectáculos
Redactar para la web
• ¿Por qué es fundamental? > credibilidad de la web
• ¿Por qué limitarlo? > evitar memorización
• ¿Cómo reducirlos? (2 firts sentences, titles, no
conversion necesary)
39. Escuela Superior de Arte y Espectáculos
Títulos
• No demasiado largos
• Factibles
• En las imágenes: no usar evitar Nº de
referencia
40. Escuela Superior de Arte y Espectáculos
Categorias
• Comprensibles : evitar metaforías
41. Escuela Superior de Arte y Espectáculos
Enlaces
• Unas palabras...
• ...que corresponden al título de la página
siguiente
42. Escuela Superior de Arte y Espectáculos
Textos
• REDUCIRLOS: 20 palabras por frase, 6
frases por párrafos
• Para los expertos y los mortales
• Evitar jerga
• Utilizar palabras comunes
• Definir acrónimos y abreviaciones
• Evitar textos en mayúsculas
46. Escuela Superior de Arte y Espectáculos
Gestionar Errores
• Un sitio web no ha de tratar al usuario de manera
hostil.
• En ningún caso un sitio web puede venirse abajo o
producir un resultado inesperado.
• ¿Cómo gestionar los posibles errores?
47. Escuela Superior de Arte y Espectáculos
Secciones de Ayuda
• Fácilmente accesible
• Estructura adaptada (categorias, tagcloud)
• FAQs
49. Escuela Superior de Arte y Espectáculos
http://www.battaletras.com.ar/
http://www.paperrad.org/oldindex2009.html
http://www.hectorwilliam.com/spanish.htm
http://www.tusitioya.com.ar/
http://www.asturias.es
http://www.mapfre.com
http://www.mjusticia.es
http://support.euro.dell.com/support/index.aspx?c=es&cs=esdhs1&l=es&s=dhs
51. Escuela Superior de Arte y Espectáculos
Integrar estilo
• CSS: Cascading Style Sheet
• Frames : ¿si o no?
• Y Flash?
• Ajax: ¿nueva moda, peligrosa?
52. Escuela Superior de Arte y Espectáculos
Validación CSS
• El documento se coloca en el servidor y se adjunta
la llamada <link rel="stylesheet"
href="MiHojaDeEstilo.css"> en todas las paginas
web en la parte del <head>
• http://jigsaw.w3.org/css-validator/
53. Escuela Superior de Arte y Espectáculos
Ejercicio
• Escribir para una web: “Mundo 21”