Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño...

33
Calidad Web Versión 1.1 2014 Noviembre 2014 Accesibilidad Evaluación de Accesibilidad

Transcript of Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño...

Page 1: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

Calidad Web

Versión 1.1 – 2014

Noviembre 2014

Accesibilidad

Evaluación de

Accesibilidad

Page 2: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

ACCESIBILIDAD WEB

Versión 1.0 – 2014

Este documento ha sido elaborado por AGESIC (Agencia para el Desarrollo del Gobierno de Gestión Electrónica y la Sociedad

de la Información y el Conocimiento)

Usted es libre de copiar, distribuir, comunicar y difundir públicamente este documento así como hacer obras derivadas,

siempre y cuando tengan en cuenta citar la obra de forma específica y no utilizar esta obra para fines comerciales. Toda obra

derivada de ésta deberá ser generada con estas mismas condiciones.

Page 3: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

Contenidos Licencia de uso de este documento .................................................................................................. 2

Introducción ..................................................................................................................................... 5 Primeras consideraciones del Plan ................................................................................................... 6

¿Qué técnicas se aplican? ............................................................................................................. 6 ¿Cuándo se hace? ......................................................................................................................... 7 ¿Qué alcance debe tener la evaluación? ....................................................................................... 8

Nivel de conformidad ............................................................................................................... 8 ¿Qué páginas evaluar? .............................................................................................................. 8

Metodología ................................................................................................................................... 10

Evaluaciones automáticas .......................................................................................................... 10 1. Validar Gramática (X)HTML ............................................................................................. 11 2. Validar Hojas de Estilo en Cascada (CSS) ......................................................................... 11

3. Validar Pautas de Accesibilidad Web ................................................................................. 12 4. Validar puntos específicos de accesibilidad ....................................................................... 15 5. Simulaciones ...................................................................................................................... 18

6. Navegadores y sistemas operativos .................................................................................... 20 7. Resoluciones de pantallas ................................................................................................... 21

8. Extensiones para navegadores ............................................................................................ 22 9. Otras herramientas .............................................................................................................. 24 10. Otras técnicas ................................................................................................................... 27

Evaluaciones heurísticas ............................................................................................................ 29

Técnicas de filtrado .................................................................................................................... 29 Pruebas con usuarios .................................................................................................................. 31

Presentación de los resultados de la evaluación ..................................................................... 32

Lecturas recomendadas .................................................................................................................. 33 Referencias ..................................................................................................................................... 33

Page 4: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos
Page 5: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

Evaluación de Accesibilidad | 5

Introducción

El objetivo de este documento es presentar un plan de evaluación de

accesibilidad web que se aplique a portales y aplicaciones, sugiriendo

técnicas que aplicadas en la etapa que corresponde, contribuyen a

disminuir los costos y garantizar una solución adecuada.

Es un complemento de la Guía para el Desarrollo de Portales

Estatales, en el que encontrará una ampliación de los conceptos ya

presentados en el capítulo 2 – Usabilidad y el capítulo 3 -

Accesibilidad.

La accesibilidad y la usabilidad van de la mano y ambas aportan para

lograr el objetivo de diseñar poniendo foco en el ciudadano. Los

equipos técnicos dedicados a testeo deberán realizar las siguientes va-

lidaciones:

validaciones de estándares técnicos,

validaciones correspondientes a las pautas WCAG 2.0, nivel AA y

algunas buenas prácticas del nivel AAA,

tests de usuarios incluyendo personas con discapacidad o de edad

avanzada.

Page 6: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

6 | Evaluación de Accesibilidad

Primeras consideraciones del Plan

¿Qué técnicas se aplican?

Un plan de evaluación en accesibilidad debe incluir, al menos, parte de las

siguientes técnicas:

1. Evaluaciones automáticas

2. Evaluación heurística

3. Técnicas de filtrado

4. Pruebas con usuarios.

Es recomendable aplicar las técnicas en el orden indicado. Este orden

coincide con el costo de la técnica, aplicarlas en este orden permite

descubrir problemas a tiempo y con el menor costo posible.

Las evaluaciones automáticas identifican errores con mínima intervención

humana. Se cuenta con una serie de herramientas gratuitas que permiten

evaluaciones fáciles y rápidas que se pueden realizar en todo momento.

Solucionados los problemas detectados automáticamente, se pueden realizar

evaluaciones heurísticas, en las que un especialista realiza evaluaciones

manuales con herramientas de apoyo para detectar otro tipo de problemas.

La técnica de filtrado, es aquella en la que un evaluador disminuye sus

capacidades artificialmente e interactúa con el portal o la aplicación para

detectar barreras de accesibilidad. En general incluye el uso de tecnologías

de apoyo como lectores de pantalla, herramientas de barrido y

magnificadores.

Eliminar los problemas más serios identificados gracias a las técnicas de

filtrado permite centrar las pruebas de accesibilidad con personas con

diferentes discapacidades en asuntos y ámbitos problemáticos más sutiles.

Por último, se recomienda realizar pruebas de usuario con la menor cantidad

posible de barreras, de esta forma se evita la aplicación de la técnica para

identificar problemas evidentes, además de reducir la frustración del

usuario.

Page 7: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

Evaluación de accesibilidad | 7

Recomendación

Aplicar evaluaciones de usabilidad en conjunto con las de accesibilidad co-

laboran en la detección temprana de problemas de usabilidad.

¿Cuándo se hace?

La accesibilidad debe incorporarse en todas las etapas del desarrollo

de un portal.

Durante el proceso de desarrollo es necesario:

Definir el nivel de conformidad objetivo: se recomienda nivel AA y

algunos criterios de AAA.

Tener identificados los requisitos de accesibilidad para el nivel de

conformidad objetivo, siguiendo las pautas de la W3C y/o Guías

para el Desarrollo de Portales.

Realizar revisiones durante el proceso de desarrollo del portal y

acordar un calendario a lo largo de todo el proceso.

Proporcionar información sobre métodos de evaluación para que los

desarrolladores puedan hacer por lo menos una evaluación prelimi-

nar por su cuenta. www.agesic.gub.uy

Se definen al menos las siguientes etapas en el desarrollo de un portal1 con

su correspondiente técnica de evaluación asociada:

Evaluación

automática

Evaluación

heurística

Técnicas de

Filtrado

Pruebas

c/usuarios

Diseño x x

Implementa-

ción

x x

Testeo de la so-

lución

x x x x

Gestión de

Contenidos

x x x

Durante la etapa de mantenimiento es necesario realizar determinadas

actividades para que se mantenga el nivel de accesibilidad logrado:

1El material del taller está publicado en el portal de AGESIC.

Page 8: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

8 | Evaluación de Accesibilidad

Contar con una declaración de accesibilidad, en la que claramente

se detalle el nivel de conformidad y el alcance al que se aplica den-

tro del portal.

Tener identificadas claramente las personas responsables de las ta-

reas de seguimiento y los procedimientos para realizar las correccio-

nes necesarias.

Contar con el equipo de editores capacitado en los conceptos bási-

cos a cumplir.

Definir la frecuencia, el método y el alcance de las evaluaciones.

Definir un proceso de validación para las modificaciones y las nue-

vas páginas antes que se publiquen en el portal.

Publicar una dirección de correo, u otra forma de contacto, para re-

gistrar incidencias de accesibilidad y recibir sugerencias de mejora

realizadas por los usuarios.

¿Qué alcance debe tener la evalua-ción?

Nivel de conformidad

Lo primero es determinar el nivel de conformidad al que se desea llegar: A,

AA, AAA. “El objetivo es que los portales del Gobierno Uruguayo puedan

alcanzar a corto plazo el nivel AA y aplicar buenas prácticas sugeridas en

algunas de las pautas de tipo AAA”2

¿Qué páginas evaluar?

La accesibilidad debe evaluarse en cada una de las páginas del portal.

En el caso de un nuevo desarrollo basado en herramientas de gestión de

contenidos es recomendable identificar los diferentes tipos de plantillas

utilizados y analizarlas sin contenido y con algún contenido textual. Cada

nueva página a agregar al portal debería ser evaluada antes de publicarse.

2 “Guía para diseño e implementación de Portales Estatales” Capítulo III Accesibilidad Web, se puede

descargar del Portal de AGESIC

Page 9: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

Evaluación de accesibilidad | 9

Para el caso de portales en producción, si el volumen de páginas es muy

grande, se recomienda seleccionar una muestra representativa de páginas

que incluya al menos:

Página principal

Mapa del sitio

Sistema de búsqueda

Formulario de contacto y/o cualquier otro formulario

Páginas con diagramas, gráficas o mapas de imagen.

Páginas con datos tabulares

Páginas con datos generados dinámicamente.

Contenido multimedia

Páginas que conforman una tarea o proceso.

Page 10: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

10 | Evaluación de Accesibilidad

Metodología

La metodología que se presenta está basada en los documentos de la WAI

“Evaluando la accesibilidad de sitios web” (Evaluating Web Sites for

Accessibility), el artículo de la WAI “Metodología valuación de la

accesibilidad Web” Metodology” (Website Accessibility Conformance

Evaluation Methodology ) y el libro “Simplemente pregunta: Integración de

la accesibilidad en el diseño” de Shawn Lawton Henry.

Se presentan sugerencias y herramientas para la aplicación de las siguientes

técnicas:

Evaluaciones automáticas

Evaluación heurística

Técnicas de filtrado

Pruebas con usuarios.

Evaluaciones automáticas

La primera evaluación a realizar debe ser mediante herramientas

automáticas, porque es la más objetiva, rápida y económica.

En Internet existen una serie de herramientas gratuitas para validar distintos

aspectos de la accesibilidad como el cumplimiento de estándares, el

cumplimiento de pautas y de aspectos específicos de la accesibilidad, así

como simuladores de discapacidades y de otras tecnologías.

¿Cuándo se puede

aplicar?

En prototipos y

versiones de la solu-

ción

Page 11: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

Evaluación de accesibilidad | 11

1. Validar Gramática (X)HTML

La validación de estándares (X)HTML es recomendada en la Pauta 4.1 de

accesibilidad de la WCAG2.0. Es más fácil realizar correcciones y

modificaciones a un código bien formado y prolijo, por lo que se

recomienda comenzar con esta validación.

Validar el código de las páginas garantiza la portabilidad a distintos

dispositivos y mejora la indexación en buscadores.

World Wide Web Consortium (W3C) dispone del servicio en línea para

validar la gramática del código (X)HTML de documentos web.

¿Cómo accedo a la herramienta?

http://validator.w3.org/

2. Validar Hojas de Estilo en Cascada (CSS)

El uso de CSS brinda flexibilidad para modificar el diseño fácilmente y

rapidez para descargar las páginas, Se obtiene como resultado un código

HTML independiente del diseño, lo que facilita su interpretación por medio

de ayudas técnicas, entre otros beneficios.

La validación de hojas de estilo contribuirá a mejorar la mantenibilidad del

código además de garantizar la portabilidad del portal, ya que evitará que se

use código no estándar propietario de algún navegador que no funcione en

otro navegador.

W3C dispone del servicio en línea para validar la gramática del código de

las Hojas de Estilo en Cascada (CSS).

¿Cómo accedo a la herramienta?

http://jigsaw.w3.org/css-validator/

En español

En español

Page 12: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

12 | Evaluación de Accesibilidad

3. Validar Pautas de Accesibilidad Web

Existen herramientas que ayudan a evaluar ciertos aspectos de la

accesibilidad.

Los validadores automáticos de accesibilidad revisan puntos conflictivos

según pautas y estándares y presentan un informe con los resultados.

“Aunque las herramientas de evaluación identifican algunos problemas de

accesibilidad, no pueden determinar por sí solas si un producto satisface o

no los estándares o si es accesible.

Estas herramientas pueden identificar las imágenes que no tengan un texto

alternativo. Sin embargo, no pueden determinar si ese texto es equivalente o

no a la imagen, es decir, si proporciona la misma información en formato

textual que la que transmite la imagen visualmente. Para determinar si el

texto alternativo que describe dicha imagen es equivalente o no, se requiere

una evaluación humana.” (Henry, 2008)

W3C dio a conocer, en diciembre de 2006, una nota de prensa en la que

expresaba que “la utilización de las herramientas de revisión automática en

la evaluación de la calidad de los sitios web no es suficiente”. (W3C, 2006)

Falsos positivos y falsos negativos

El evaluador puede encontrar en estas validaciones automáticas lo que se

llaman:

Falsos positivos: problemas de accesibilidad no identificados por el

validador automático.

Falsos negativos: problemas de accesibilidad identificados por el

validador automático que revisados por un experto no son conside-

rados problemas.

Se sugiere realizar la evaluación automática con al menos dos herramientas

para cubrir los problemas detectables automáticamente. A continuación se

presenta un listado de herramientas gratuitas disponibles en la web:

Recomendación:

AGESIC adoptó las Pautas de Accesibilidad de Contenido Web (WCAG

2.0). Existen muchas herramientas gratuitas de validación de las Pautas de

Accesibilidad, aunque muchas aún validan la WCAG versión 1.0 o

estándares específicos de un país.

Page 13: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

Evaluación de accesibilidad | 13

TAW (Test de Accesibilidad Web)

TAW es una familia de herramientas, desarrollada por la Fundación CTIC

(Centro Tecnológico de la Información y de la Comunicación).

La versión en línea de la herramienta TAW analiza las Pautas de

Accesibilidad al Contenido Web 1.0 y 2.0.

¿Cómo accedo a la herramienta?

http://tawdis.net/

eXaminator

eXaminator es una herramienta en línea gratuita de evaluación de pautas

WCAG 2.0.

¿Cómo accedo a la herramienta?

http://examinator.ws/

AccessMonitor

AccessMonitor es una herramienta en línea gratuita de evaluación de pautas

WCAG 2.0. desarrollado por UMIC – Agencia para la Sociedad del

Conocimiento, IP, Ministerio de Ciencia, Tecnología y Educación Superior

de Portugal.

¿Cómo accedo a la herramienta?

http://www.acceso.umic.pt/accessmonitor/

Total Validator

TotalValidator es una aplicación de escritorio que contiene un validador de

(X)HTML, accesibilidad enlaces rotos y HTML. Se puede visualizar la

página en distintos navegadores, sistemas operativos y resoluciones de

pantalla.

En español

En español

En portugués.

En inglés.

Page 14: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

14 | Evaluación de Accesibilidad

Puede ser usado en los sistemas operativos Linux, Mac y Windows.

¿Cómo accedo a la herramienta?

http://www.totalvalidator.com/

Esta herramienta debe ser descargada e instalada localmente

aDesigner

Es una herramienta de IBM Home Page Reader que tiene validadores

integrados y posibilidades de configuración de discapacidad visual. Ayuda a

asegurar que el contenido y sus aplicaciones son accesibles para personas

con discapacidad visual pero no soporta discapacidades auditivas ni

motoras.

Además de evaluar la accesibilidad según las pautas de la W3C realiza

simulaciones de cómo ve la página Web una persona con lector de pantalla

o una persona con una visión reducida (por la edad o por alguna

enfermedad). También permite evaluar la accesibilidad de documentos

ODF, de contenido Flash y de entornos gráficos de usuario.

¿Cómo accedo a la herramienta?

http://www.eclipse.org/actf/downloads/tools/aDesigner/index.php/

Worldspace

Es una herramienta en línea gratuita con registro previo que identifica

errores con WCAG 2.0 y Sección 5083. También valida archivos flash y pdf.

¿Cómo accedo a la herramienta?

http://www.deque.com/products.fireeyes/

3 La Sección 508 (http://www.section508.gov/) del "Acta de los Americanos con Discapacidad" define

criterios de accesibilidad de páginas, aplicaciones Web, y de Software y por tanto de las herramientas de

autor y de los navegadores. Si se satisfacen los puntos de verificación de prioridad 1 y 2 de la WCAG 1.0 se

cumple con los requerimientos de la Sección 508. http://www.sidar.org/recur/direc/legis/508.php

En inglés.

En inglés.

Page 15: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

Evaluación de accesibilidad | 15

4. Validar puntos específicos de accesibili-

dad

Existen algunos criterios de accesibilidad que no se pueden analizar de una

manera totalmente automática, sino que necesitan una evaluación manual

con el apoyo de herramientas automáticas.

Contraste de color de fondo y primer plano

Las herramientas listadas a continuación detectan contrastes inferiores a 3:1.

Para Nivel AA: se debe obtener una relación de contraste de, al menos,

4.5:1, excepto en los siguientes casos:

Textos grandes: Los textos de gran tamaño y las imágenes de texto

de gran tamaño tienen una relación de contraste de, al menos, 3:1.

Incidental: Los textos o imágenes de texto que forman parte de un

componente inactivo de la interfaz de usuario, que son simple deco-

ración, que no resultan visibles para nadie o forman parte de una

imagen que contiene otros elementos visuales significativos, no tie-

nen requisitos de contraste.

Logotipos: El texto que forma parte de un logo o nombre de marca

no tiene requisitos de contraste mínimo.

Colour Contrast Analyser

Es una herramienta para validar el contraste de los colores de fondo y

primer plano para determinar si es posible percibirlos, basado en algoritmos

sugeridos por W3C. También realiza simulaciones de discapacidades

visuales como deutanopia, protanopia y tritanopia, visión en escala de

grises, en colores invertidos y cataratas.

¿Cómo accedo a la herramienta?

http://www.visionaustralia.org.au/info.aspx?page=628

Esta herramienta debe ser instalada localmente

Page 16: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

16 | Evaluación de Accesibilidad

CheckMyColours

Es una herramienta en línea para validar el contraste de los colores de fondo

y primer plano de todos los elementos del DOM4 (Modelo de Objetos del

Documento-Document Object Model) y determinar si es posible percibirlos

según los algoritmos de W3C.

¿Cómo accedo a la herramienta?

http://www.checkmycolours.com/

Epilepsia fotosensitiva

La epilepsia fotosensitiva es un problema causado por una respuesta

anormal del cerebro a las luces intermitentes. El 0,5 % de la población total

es epiléptica y el 3 % de esta cantidad (es decir el 0,015 % de la población

total), es fotosensitiva.

Por otra parte, estímulos visuales que desencadenan convulsiones en

pacientes con epilepsia fotosensible provocan en otros individuos

sensaciones de molestia visual o percepciones anómalas.

Photosensitive Epilepsy Analysis Tool es una herramienta gratuita

descargable del Trace Center at the University of Wisconsin-Madison para

determinar el riesgo de epilepsia fotosensitiva en contenidos web como

animaciones o videos.

¿Cómo accedo a la herramienta?

http://trace.wisc.edu/peat/

Contraste de sonido

Según el criterio de éxito 1.4.7, para que un archivo de audio sea accesible,

es necesario asegurar que ruidos o música de fondo sean lo suficientemente

bajos como para comprender el sonido de primer plano.

La herramienta que se presenta verifica la accesibilidad de archivos de

audio.

4 http://www.w3.org/DOM/

Page 17: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

Evaluación de accesibilidad | 17

¿Cómo accedo a la herramienta?

http://www.eramp.com/WCAG_2_audio_contrast_tool_help.htm

Legibilidad

La pauta 3.1 indica que el contenido textual debe ser legible y

comprensible. Se presentan dos herramientas para ayudar a mejorar la

ortografía y el nivel de lectura de una página web en español.

Stilus

Es una herramienta en línea gratuita que ayuda a detectar errores

ortográficos, gramaticales y de estilo en un texto introducido.

¿Cómo accedo a la herramienta?

http://www.mystilus.com/Correccion_interactiva

Readability index calculator

Es una herramienta en línea que calcula el “nivel de lectura” de un texto me-

diante algoritmos de lectura que tienen en cuenta por ejemplo la cantidad de

palabras por oración y las palabras difíciles de tres o más sílabas, indicando

mediante un puntaje si el texto resulta fácil de comprender.

Es una herramienta en inglés pero permite seleccionar para calcular el nivel

de lectura de un texto en español.

¿Cómo accedo a la herramienta?

http://www.standards-schmandards.com/exhibits/rix/index.php

Imágenes

Se requiere revisar que los textos alternativos de imágenes sean correctos y

si es necesario utilizar longdesc.

Esta herramienta en línea analiza todas las imágenes en una página y

chequea si existen barreras de accesibilidad examinando los valores de los

Page 18: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

18 | Evaluación de Accesibilidad

atributos: width, height, alt y longdesc. Muestra la imagen y la información

asociada a la misma para facilitar el chequeo manual.

¿Cómo accedo a la herramienta?

http://juicystudio.com/services/image.php

5. Simulaciones

Existen herramientas que permiten simular discapacidades visuales para

chequear cómo vería una página una persona con alguna discapacidad, de

manera de detectar problemas evidentes.

Lector de pantalla

Fangs-the screen reader emulator

Fangs es un complemento gratuito para el navegador firefox el cual

transforma una página web en texto, esto permite entender como lo realiza

un lector de pantalla.

¿Cómo accedo a la herramienta?

https://addons.mozilla.org/en-US/firefox/addon/fangs-screen-reader-

emulator/

Limitaciones visuales

Las herramientas que se presentan permiten simular diversas situaciones

relacionadas con limitaciones visuales.

ADesigner

Realiza simulaciones de cómo ve la página Web una persona con lector de

pantalla o una persona con una visión reducida. Ver sección: 3. Validar

Pautas de Accesibilidad Web - ADesigner

Visual Impairment Simulator

Es un programa para simular el uso de Microsoft Windows con una

limitación visual. Permite simular cataratas, ceguera al color, deutanopia,

Page 19: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

Evaluación de accesibilidad | 19

protanopia y tritanopia, visión monocromática, retinopatía diabética,

glaucoma, hiperopia, degeneración macular, retinitis pigmentosa. Contiene

además un magnificador de pantalla.

¿Cómo accedo a la herramienta?

http://vis.cita.uuc.edu/downld.php/

Ceguera del color

Las siguientes herramientas permiten simular tres tipos de ceguera del

color5: deutanopia, protanopia y tritanopia.

Colour Contrast Analyser.

Ver sección: 4. Validar puntos específicos de accesibilidad – Validación de

contraste de colores

Colorblind Web Page Filter:

Es una herramienta en línea que permite introducir una URL y visualizar la

página modificada por la simulación.

¿Cómo accedo a la herramienta?

http://colorfilter.wickline.org/

Colour Blindness Simulator

Es una herramienta en línea que permite seleccionar una imagen y verla

modificada según la simulación seleccionada.

¿Cómo accedo a la herramienta?

http://www.etre.com/tools/colourblindsimulator/

5 Defecto en la visión que hace que algunos colores se perciban de forma distinta o no se perciban como

tonos distintos. http://accesibles.org/quienes/discapacidades-visuales/ceguera-al-color

Page 20: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

20 | Evaluación de Accesibilidad

Vischeck

Es una herramienta en línea que permite tanto subir una imagen como

indicar la URL de una página. También permite descargar el programa para

ejecutar una versión local.

¿Cómo accedo a la herramienta?

http://www.vischeck.com/vischeck/

6. Navegadores y sistemas operativos

Lynx

Es un navegador de texto desarrollado en 1992 para UNIX, pero hoy se en-

cuentra en varias distribuciones de Linux y existen versiones para Microsoft

Windows, DOS, OS/2, entre otros.

Debido a su simplicidad los lectores de pantalla trabajan sobre este navega-

dor y se ha convertido en una buena opción para usuarios con problemas de

visión. Por ello es útil para testear aspectos de accesibilidad. Sólo permite

ver texto, indicando la información multimedia mediante el texto alterna-

tivo.

Como funciona por línea de comandos la navegación se realiza mediante el

teclado. El contenido de las tablas es mostrado en varias líneas de texto,

donde el final de cada fila de la tabla se representa con un salto de línea. Los

frames son identificados por un nombre y se navegan como si fueran pági-

nas independientes.

Recomendación de Google

Para mejorar la indexación en el buscador:

“Utilice un navegador de solo texto como Lynx para examinar su sitio, ya

que la mayoría de las arañas de los motores de búsqueda visualizarán el sitio

de forma muy similar a Lynx. Si el uso de funciones avanzadas (como

JavaScript, cookies, identificadores de sesión, marcos, DHTML o Flash)

impide la visualización de todo el sitio en un navegador de texto, es posible

que las arañas de los motores de búsqueda tengan problemas para

rastrearlo.” 6.

6 Más información: Google centro para webmasters

Page 21: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

Evaluación de accesibilidad | 21

¿Cómo accedo a la herramienta?

http://lynx.browser.org/

Existe además un simulador de Lynx en línea. El mismo requiere que en el

servidor donde está alojado el sitio, se cree un archivo llamado delorie.htm

o de lo contrario, subir una imagen con el nombre delorie.gif.

¿Cómo accedo a la herramienta?

http://www.delorie.com/web/lynxview.html

Web Page Backward Compatibility Viewer

Es una herramienta en línea que permite visualizar una página en muchos

navegadores. Necesita el archivo "delorie.htm" en el directorio raíz de la

Web a comprobar para verificar que se es administrador del portal.

¿Cómo accedo a la herramienta?

http://www.delorie.com/web/wpbcv.html

Browsershots

Es una herramienta que permite seleccionar diferentes sistemas operativos,

diferentes navegadores y tamaños de pantalla entre otras características.

¿Cómo accedo a la herramienta?

http://browsershots.org/

7. Resoluciones de pantallas

Screen Resolution Checker

Una herramienta en línea que muestra cómo se vería una página en

diferentes resoluciones de pantalla:

¿Cómo accedo a la herramienta?

http://www.google.com/support/webmasters/bin/answer.py?hl=es&answer=35769

Page 22: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

22 | Evaluación de Accesibilidad

http://andylangton.co.uk/stuff/screen-resolution-checker

8. Extensiones para navegadores

Se presentan algunas extensiones de navegadores útiles para analizar

diferentes características de los portales.

¿Cómo accedo a más herramientas?

http://blogandweb.com/productos-google/extensiones-chrome-y-firefox-

para-bloggers-y-desarrolladores/

http://net.tutsplus.com/articles/general/why-web-developers-should-switch-

to-google-chrome/

Web Accesibility Toolbar

Es una extensión para Internet Explorer creada por Accessible Information

Solutions (AIS) de Vision Australia.

Su objetivo es facilitar la evaluación manual de páginas web para aspectos

de accesibilidad. Algunas de sus funciones son:

Identificar componentes

Simular experiencias de usuario

Facilitar el uso de aplicaciones en línea de terceros

Proveer enlaces a referencias y recursos adicionales.

¿Cómo accedo a la herramienta?

http://www.visionaustralia.org.au/info.aspx?page=614

Firefox Accessibility Extension

Es un complemento para Mozilla Firefox creado por el Illinois Center for

Information Technology Accessibility.

Page 23: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

Evaluación de accesibilidad | 23

Brinda apoyo para la navegación de personas con discapacidad, permite

simular situaciones de uso del producto y permite validar utilizando las

siguientes herramientas.

¿Cómo accedo a la herramienta?

https://addons.mozilla.org/en-US/firefox/addon/5809/

Wave

Es un complemento para Mozilla Firefox que analiza la accesibilidad

usando la herramienta Wave, reconoce la estructura y el orden de

navegación en un documento, muestra una versión de solo texto de la

página, solamente los encabezados, entre otras facilidades.

¿Cómo accedo a la herramienta?

https://addons.mozilla.org/en-US/firefox/addon/6720/

Web Developer

Es un complemento disponible para Mozilla Firefox y Chrome que permite

inspeccionar elementos en una página web, simular situaciones de uso del

sistema desactivando JavaScript, CSS o Java por ejemplo, además de conte-

ner validadores específicos de estándares y accesibilidad.

¿Cómo accedo a la herramienta?

En Mozilla:

https://addons.mozilla.org/es/firefox/addon/web-developer/

En Chrome:

https://chrome.google.com/extensions/detail/bfbameneiokkgbd-

miekhjnmfkcnldhhm?hl=es

Herramientas para el desarrollador

Herramienta de Google Chrome con las siguientes funcionalidades:

Consola de Javascript: muestra errores y permite probar líneas de

Javascript.

Page 24: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

24 | Evaluación de Accesibilidad

Panel de Elementos: permite ver y editar código HTML y CSS.

Recursos: permite ver los tiempos de carga de todos los elementos

de un portal, desde las imágenes hasta los scripts.

¿Cómo accedo a la herramienta?

Viene con el navegador. Para activarla:

Ingresar a Google Chrome y presionar Crtl + Mayúsc + I

Pendule

Tiene muchas de las funcionalidades del Web Developer pero

solamente para Google Chrome.

¿Cómo accedo a la herramienta?

http://www.chromeextensions.org/webmaster-seo/pendule/

9. Otras herramientas

Existen además una serie de herramientas que contribuyen a mejorar la cali-

dad de los portales, de las cuales se presentan algunas.

MobileOK Checker

Es un servicio gratuito en línea del W3C para verificación de documentos

Web, que comprueba el nivel de adecuación que tiene la página para ser

utilizado en dispositivos móviles.

¿Cómo accedo a la herramienta?

http://validator.w3.org/mobile/

Unicorn

Es un servicio gratuito en línea del W3C que comprueba al mismo tiempo

(X)HTML, CSS, MobileOk y RSS/Atom.

Page 25: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

Evaluación de accesibilidad | 25

¿Cómo accedo a la herramienta?

http://validator.w3.org/unicorn/

Chequeo de enlaces rotos

Link Checker

Es un servicio en línea del W3C que permite recorrer un documento HTML

o XHTML y comprobar que los enlaces no estén rotos, que no estén

definidos dos veces y que todos sean referenciables.

¿Cómo accedo a la herramienta?

http://validator.w3.org/checklink/

Indexación

Generador de Metatags.

Es una herramienta en línea que ayuda a escribir las etiquetas meta para una

página web. La correcta utilización de las etiquetas meta ayuda en la indexa-

ción de buscadores.

¿Cómo accedo a la herramienta?

http://www.metatags.com.mx/generador-de-metatags.php

Generar archivo robots.txt para buscadores

El archivo robots.txt es un archivo de texto que se coloca en la carpeta raíz

de tu web para evitar que ciertos robots de los buscadores (spiders) indexen

aquellas páginas o carpetas que no quieras que lo hagan.

¿Cómo accedo a la herramienta?

http://deteresa.com/archivo-robots-txt/

Page 26: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

26 | Evaluación de Accesibilidad

Tiempo de Carga

Herramientas en línea para calcular el tiempo que demora en cargar una pá-

gina. Es necesario tener en cuenta que el tiempo dependerá de la conexión a

internet con la que se está realizando el test.

WebWait

Mide cuánto tiempo se necesita para cargar y renderizar la página en el na-

vegador, incluyendo imágenes, hojas de estilo y JavaScript. Permite almace-

nar el testeo y enviar el enlace para que otra persona lo testee utilizando otra

conexión, otro navegador y otro sistema operativo.

¿Cómo accedo a la herramienta?

http://webwait.com/

PageSpeed Tools

Asigna un valor entre 0 y 100 a la velocidad de carga del portal para un dis-

positivo móvil y para un navegador web de escritorio y propone mejoras en

ambos casos. A mayor puntuación, mejor velocidad de carga. Una velocidad

de carga adecuada es aquella cuyo valor supera el 85/100.

¿Cómo accedo a la herramienta?

https://developers.google.com/speed/pagespeed/

Website speed check

Permite conocer la velocidad de carga de un sitio web y tomar decisiones en

cuanto a si el sitio debe optimizarse o ser movido a un servidor más veloz.

¿Cómo accedo a la herramienta?

https://www.linkvendor.com/seo-tools/speedtester.html

Website Speed Test

Permite conocer la velocidad de carga de un sitio web brindando deta-

lles como: tiempo en que resuelve el nombre de dominio a su direc-

ción IP, tiempo en que conecta con el host, archivos cargados, etc.

Page 27: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

Evaluación de accesibilidad | 27

¿Cómo accedo a la herramienta?

http://www.pagescoring.com/website-speed-test

Site Check

Lista resultados de varios validadores y herramientas de accesibilidad

ingresando en un solo lugar.

¿Cómo accedo a la herramienta?

http://uitest.com/en/check/

10. Otras técnicas

Algunas comprobaciones sencillas que se pueden realizar utilizando

extensiones de navegadores como Web Developer, Pendule, entre otros son:

Navegar con las imágenes deshabilitadas, comprobando que tienen

texto alternativo y que es posible navegar normalmente.

Navegar con el sonido desconectado, comprobando que el conte-

nido de audio tiene disponible contenido textual.

Modificar el tamaño de las fuentes utilizando las funciones del na-

vegador para comprobar que la página es usable en tamaños de

fuente más grandes.

Visualizar en escala de grises (o imprimir en blanco y negro la pá-

gina) para comprobar que es posible comprender el contenido.

Navegar sin CSS, comprobando que se mantiene todo el contenido

y en un orden que permite comprenderlo.

Con Javascript deshabilitado, comprobando que es posible navegar

y ejecutar las funciones disponibles.

Con applets de Java deshabilitado, comprobando que es posible na-

vegar y ejecutar las funciones disponibles.

Utilizar distintos navegadores, sistemas operativos y pantallas.

Con conexiones lentas.

Page 28: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

28 | Evaluación de Accesibilidad

Utilizar otros dispositivos como celulares.

Page 29: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

Evaluación de accesibilidad | 29

Evaluaciones heurísticas

En una evaluación heurística, los especialistas valoran si cada elemento del

diseño cumple los principios de usabilidad establecidos (Nielsen, 1999).

Especialistas con experiencia en interfaz con el usuario con distintas disca-

pacidades pueden detectar y sugerir mejoras para los problemas de accesibi-

lidad que afectan a una gran variedad de usuarios. Por otro lado, las pruebas

con usuarios se podrían centrar en ámbitos potencialmente problemáticos

donde puedan surgir dificultades que los especialistas no pueden detectar.

No siempre se tiene presupuesto para contratar especialistas, pero se puede

realizar al menos una evaluación manual siguiendo las pautas de accesibili-

dad de la WCAG utilizando herramientas presentadas en la sección anterior,

cuando se considere apropiado.

Técnicas de filtrado

En la técnica de filtrado el usuario limita o modifica alguna de sus habilida-

des físicas o sensoriales. Por ejemplo usando guantes gruesos para limitar la

destreza manual, lentes o vendas para limitar la visión y utilizar tecnologías

de apoyo como lectores de pantalla o punteros bucales.

Algunas de las técnicas sugeridas son:

Navegar sólo con el teclado, sin utilizar el mouse, comprobando que

es posible acceder a todos los enlaces y controles verificando que

los enlaces indican claramente su destino.

Navegar con el monitor apagado utilizando un lector de pantalla

como los listados a continuación:

o NVDA: es un lector de pantalla para Microsoft Windows

gratuito que se puede descargar de: http://www.nvda-

project.org/

o Jaws es un lector de pantalla para Windows, se puede

descargar una versión de prueba de:

http://www.freedomscientific.com/products/fs/jaws-

product-page.asp

o Orca es un lector de pantalla para Linux que se puede

descargar de: http://live.gnome.org/Orca

¿Cuándo se puede

aplicar?

En wireframes, bo-

cetos, prototipos y

versiones de la so-

lución

¿Cuándo se

puede aplicar?

En prototipos y

versiones de la

solución

Estas técnicas re-

sultan útiles como

herramientas de

formación y con-

cienciación.

Page 30: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

30 | Evaluación de Accesibilidad

Navegar utilizando magnificadores7 de pantalla como los listados a

continuación:

o Ampliador de Windows está disponible en los sistemas

operativos Microsoft Windows XP y Microsoft Vista.

Información sobre cómo usarlo:

http://www.microsoft.com/spain/accesibilidad/training/win

dowsxp/magnifierturnon.aspx

o ZoomText: es un magnificador de pantalla para Windows,

que incluye además voz sintetizada en español. Se puede

descargar una versión de prueba de:

http://www.aisquared.com/

Utilizar otros tipos de navegadores solo-texto (Lynx)

Utilizar ayudas técnicas como punteros de boca

Atención!

Las técnicas de filtrado no son simulaciones de discapacidades porque no

permiten recrear la situación precisa. La persona con discapacidad está más

acostumbrada a la situación de limitación y al uso de tecnologías de apoyo

que la persona que testeará el portal o la aplicación.

El que testea puede detectar un problema que no se deba al sistema sino a su

falta de práctica en el uso del lector de pantalla por ejemplo

7 Los programas magnificadores de pantalla pueden magnificar o agrandar el contenido de la pantalla de la

computadora. Se puede encontrar más información sobre magnificadores de pantalla en: http://www.magni-

fiers.org/

Page 31: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

Evaluación de accesibilidad | 31

Pruebas con usuarios

Las pruebas con usuarios son útiles para conocer cómo los usuarios utilizan

el portal y para detectar barreras de accesibilidad y oportunidades de

mejora, pero no evalúan la conformidad con las pautas de accesibilidad.

Se pueden realizar pruebas de usabilidad para encontrar problemas de

accesibilidad realizando pequeñas modificaciones en el protocolo típico:

La técnica "think-aloud" facilitará mucho la interacción. Con esta

técnica el usuario que realiza la prueba menciona en voz alta lo que

piensa u opina al interactuar con la herramienta.

La recogida de datos se centrará en la comprensión de los errores

relacionados con los problemas de accesibilidad, en lugar de cen-

trarse en el tiempo o la satisfacción de los usuarios.

Las tareas se centrarán en áreas específicas de preocupación para

los posibles problemas de accesibilidad, en lugar de en los proble-

mas generales de uso del portal.

Una dificultad particular es la selección de los participantes para la prueba

ya que las discapacidades más habituales (visuales, auditivas, físicas y

cognitivas) tienen variantes en cuanto a si es temporal o permanente, a si es

de nacimiento o no, o incluso variación en cuanto a las tecnologías de apoyo

que utiliza el usuario, siendo éste experto o no.

Se debe tener en cuenta el lugar donde se realizan las pruebas, ya que el

usuario está acostumbrado a utilizar sus tecnologías de apoyo configuradas

en su computadora. Es importante evitar agregar dificultades al test al

cambiarle el ambiente de trabajo al usuario.

Page 32: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

32 | Evaluación de Accesibilidad

Presentación de los resultados de la evalua-

ción

Para analizar los resultados se recomienda resumirlos indicando:

Los diferentes tipos de problemas detectados, pero también los as-

pectos positivos que se han encontrado.

Recomendar mejores prácticas identificadas para cada caso mos-

trando un ejemplo de su aplicación.

Incluir recomendaciones sobre medidas de seguimiento, la realiza-

ción de un análisis completo y las maneras de abordar los problemas

identificados.

Recomendar la reparación de los problemas de accesibilidad detec-

tados, la ampliación de los aspectos positivos y el mantenimiento y

seguimiento del portal.

Es posible encontrar un formato para presentar informes con los resultados

de su evaluación en una plantilla de WCAG disponible en:

http://www.w3.org/WAI/eval/template.html

Page 33: Evaluación de AccesibilidadEvaluación heurística Técnicas de Filtrado Pruebas c/usuarios Diseño x x Implementa-ción x x Testeo de la so-lución x x x x Gestión de Contenidos

Evaluación de accesibilidad | 33

Lecturas recomendadas

Guía para diseño e implementación de Portales Estatales.

Estos documentos están disponibles en el Portal de Agesic.

Referencias

W3C. (2006). Notas de prensa. Recuperado el 2011, de

http://www.w3c.es/Prensa/2006/nota061211_validaccesibilidad

Carreras, O. (2009). Metodología para la evaluación de la accesibilidad

Web. Recuperado el 2011, de Evaluating Web Sites for Accessibility:

http://olgacarreras.blogspot.com/2009/06/metodologia-para-la-evaluacion-

de-la.html

Henry, S. L. (2008). Simplemente pregunta. Recuperado el 2011, de

Integración de la accesibilidad en el diseño:

http://uiaccess.com/justask/es/index.html