Diapositiva 1: Portada: Tema 3.3: Evaluación de la accesibilidad web Lourdes Moreno, Paloma Martínez Universidad Carlos III de Madrid {lmoreno,pmf}@inf.uc3m.es Asignatura Humanidades “Evitando las barreras de accesibilidad en la Sociedad de la Información” OpenCourseWare de la Universidad Carlos III de Madrid Esta obra está bajo una licencia de Creative Commons Reconocimiento-NoComercial-Compartirigual 3.0 España (http://creativecommons.org/licenses/by-nc-sa/3.0/es/deed.es) Logo licencia Creative Commons Reconocimiento-NoComercial-Compartirigual Diapositiva 2 Contenido: Imagen Créditos de la imagen: Autor: Per Axbom Ubicada en: https://www.flickr.com/photos/axbom/8491901078/ Bajo licencia Creative Commons: https://creativecommons.org/licenses/by-sa/2.0/ Diapositiva 3 Título: Índice Contenido: Bases de la evaluación Evaluación de accesibilidad conforme a las WCAG 2.0 Alcance de la evaluación Explorar el sitio web Seleccionar muestra representativa Auditar la muestra Informar de los resultados Pruebas con usuarios Recursos Diapositiva 4 Título: Bases de la evaluación Contenido: Es importante comenzar utilizando métodos de validación desde las primeras fases del desarrollo de un sitio web. Verifique la accesibilidad con herramientas automáticas y revisión humana. Los métodos automáticos son generalmente rápidos y convenientes, pero no pueden identificar todos los problemas de accesibilidad. La revisión humana puede ayudar a garantizar la claridad del lenguaje y la facilidad de navegación Diapositiva 5 Título: Evaluación de accesibilidad conforme a las WCAG 2.0 Contenido: Metodología de Evaluación de Conformidad con la Accesibilidad en sitios Web (WCAG-EM) http://www.w3.org/TR/WCAG-EM/ Pasos del proceso Definir el alcance de la evaluación Explorar el sitio web Seleccionar una muestra representativa Auditar la muestra seleccionada Informar de los resultados de la evaluación. Plantilla para el informe Es similar a la de las WCAG 1.0, pero: sí permite aplicar a ámbitos separables (parte pública y intranet o privada del mismo). si hay declaración parcial de conformidad . Listado de las tecnologías excluidas de la evaluación Diapositiva 6 Título: 1. Alcance de la evaluación Contenido: El primer paso debe ser definir sobre qué nivel de conformidad se va a realizar la evaluación: A, AA o AAA. Es importante comprobar si la página debe cumplir legalmente alguno de los niveles, por ejemplo, las páginas de la administración pública. Diapositiva 7 Título: 2. Explorar el sitio web Contenido: Realizar una navegación por el sitio web completo. Identificar todas las páginas que tienen elementos específicos: formularios, tablas, elementos multimedia, etc. Agrupar las páginas que tienen elementos comunes, por ejemplo, todas las páginas de noticias pueden tener la misma estructura y variar solamente el contenido. Diapositiva 8 Título: 3. Seleccionar muestra representativa Contenido: Con la exploración realizada establecer una muestra de páginas representativas del sitio. En sitios pequeños escoger todas las páginas. En sitios grandes escoger: Las páginas diferenciales con distintas estructuras, contenidos específicos, etc., La página de inicio. Diapositiva 9 Título: 4. Auditar la muestra (1/7) Contenido: Evaluación automática Utilizar las herramientas de validación automática de las WCAG 2.0, por ejemplo, TAW, adaptándola al alcance deseado (A, AA o AAA) y a las tecnologías disponibles (p.e. HTML, Javascript, CSS) Es aconsejable utilizar al menos dos herramientas y comparar los resultados de ambas. Utilizar también las herramientas del W3C para la validación de estándares: HTML, CSS… Diapositiva 10 Título: 4. Auditar la muestra (2/7) Contenido: TAW Imagen del analizador de las WCAG 2.0 TAW, marcando donde se puede incluir el nivel de análisis y las tecnologías soportadas. Diapositiva 11 Título: 4. Auditar la muestra (3/7) Contenido: Herramientas de validación automática: TAW: www.tawdis.net Examinator: http://examinator.ws/ WAVE (Web Accessibility Evaluation Tool): http://wave.webaim.org/ Accessibility Checker: http://achecker.ca/checker/ HTML validator (W3C): http://validator.w3.org/ CSS validator (W3C): http://jigsaw.w3.org/css-validator/ Diapositiva 12 Título: 4. Auditar la muestra (4/7) Contenido: Ventajas: Permite un funcionamiento rápido y sistemático. Se revisan muchos aspectos simultáneamente. Ofrece una calificación global de la accesibilidad de la página. Se puede certificar que no se cumple. Desventajas: La interpretación de los resultados del análisis es compleja y exige conocer los principios básicos de accesibilidad. Muchos aspectos de la accesibilidad sólo pueden verificarse mediante una revisión manual complementaria. No pueden certificar que sí se cumple. Diapositiva 13 Título: 4. Auditar la muestra (5/7) Contenido: Evaluación manual (complementaria a la automática) Debe ser siempre complementaria a la automática. Utilizar un listado de la totalidad de los criterios de verificación y completar los analizados mediante la evaluación automática. Para la evaluación manual utilizar aplicaciones que sirvan de ayuda para la evaluación, como las barras de herramientas de los navegadores, herramientas de contraste, etc. Diapositiva 14 Título: 4. Auditar la muestra (6/7) Contenido: Evaluación manual Realizar la evaluación manual utilizando distintos agentes de usuario, dispositivos, condiciones de uso, etc. Por ejemplo, utilizar distintos navegadores, navegadores sólo texto, lectores de pantalla, dispositivos móviles, navegación por teclado… Probar configuraciones de distintos navegadores existentes. Comprobar que no es necesario el desplazamiento horizontal con diferentes resoluciones de pantalla Acceder con un lector de pantalla y navegadores especiales como sólo texto Para la evaluación manual utilizar aplicaciones que sirvan de ayuda para la evaluación, como las barras de herramientas de los navegadores, herramientas de contraste, etc. Diapositiva 15 Título: 4. Auditar la muestra (7/7) Contenido: Ventajas Se entienden mejor los problemas de la página. Se puede comparar la validez de distintas soluciones. Es el único medio posible para revisar algunos aspectos: adecuación texto alternativo, títulos de marcos, lectura fácil, etc. Desventajas Proceso mucho más costoso en tiempo. Hacen falta más navegadores alternativos, simuladores de navegadores o configuraciones distintas del mismo navegador entre otras herramientas. Exige el juicio personal del revisor. Hay que conocer mejor los problemas para detectarlos. Algunas cosas son difíciles de simular. Puede no detectar algunos fallos de accesibilidad. Diapositiva 16 Título: 5. Informar de los resultados Contenido: Realizar un informe incluyendo: Problemas y elementos mejorables identificados para cada tipo de página, junto con la URL de la misma y el método y condiciones en que han sido detectados. Pautas para los desarrolladores para resolver los problemas y para facilitar el mantenimiento accesible del sitio. Informes automáticos obtenidos junto con los criterios de verificación analizados manualmente. Señalar si las páginas tienen distintos ámbitos en el sitio web (parte pública y privada del mismo) Si hay declaración parcial de conformidad, indicar el listado de las tecnologías excluidas de la evaluación. Template: http://www.w3.org/WAI/eval/template.html Diapositiva 17 Título: Pruebas con usuarios Contenido: Además de las revisiones automáticas y manual, se recomienda realizar pruebas con usuarios. Se pueden realizar en su propio entorno, o en un entorno controlado. Buscar usuarios con y sin discapacidad, con distintos tipos de discapacidad, distintos contextos de uso, etc. Interpretar los resultados y los problemas encontrados y aplicar soluciones. Diapositiva 18 Título: Recursos Contenido: Herramientas automáticas de validación Barras de desarrollo Herramientas reparadoras Otros navegadores, sólo texto, etc. Analizadores de contraste, y del color Lectores de pantalla, magnificadores, … Simuladores de tipos de pantalla, resolución, etc. Herramientas de utilidad en accesibilidad web: http://labda.inf.uc3m.es/awa/es/node/125 Diapositiva 19 Título: Referencias herramientas (I) Contenido: TAW: http://www.tawdis.net WAVE: http://wave.webaim.org/?lang=es Achecker: http://achecker.ca/checker/index.php Tool Validator: http://www.totalvalidator.com/ AIS Web Accessibility Toolbar (para Explorer): http://www.paciellogroup.com/resources/wat/ Diapositiva 20 Título: Referencias herramientas (II) Contenido: Web Developer Toolbar(para Firefox): https://addons.mozilla.org/es/firefox/addon/web-developer/ Web Developer Toolbar (para Chrome): https://chrome.google.com/webstore/detail/web-developer/bfbameneiokkgbdmiekhjnmfkcnldhhm Colur Contrast Analyser:http://www.visionaustralia.org/digital-access-cca Diapositiva 21 Título: Referencias herramientas (III) Contenido: W3C CSS Validation Service:http://jigsaw.w3.org/css-validator/ W3C Markup Validation Service: http://validator.w3.org/ JAWS (navegador de voz propietario): http://www.freedomscientific.com/Products/Blindness/Jaws NVDA (Navegador de voz software libre): http://www.nvaccess.org/ Más recursos en: http://labda.inf.uc3m.es/awa/es/node/125 Diapositiva 22 Fin de presentación Tema 3.3: Evaluación de la accesibilidad web Lourdes Moreno, Paloma Martínez Universidad Carlos III de Madrid {lmoreno,pmf}@inf.uc3m.es Asignatura Humanidades “Evitando la barreras de accesibilidad en la Sociedad de la Información” OpenCourseWare de la Universidad Carlos III de Madrid Fin de presentación