Checklist de accesibilidad para el Gobierno de la Ciudad de Buenos Aires
March 12th, 2010En el mes de febrero de 2010, colaboré en la construcción de un checklist de accesibilidad para el área de maquetación del GBCBA, que ha pasado a ser el estándar requerido para los nuevos trabajos.
La responsable del proyecto ha sido Verónica Traynor, head de usabilidad en GBCBA. A continuación, cito su post en el cual detalla el checklist en su totalidad:
Con el fin de que nuestros Sitios sean perceptibles, comprensibles, compatibles y operables generamos este listado de verificación para maquetadores (para seguir revisando!) basado en las Directrices de Accesibilidad del Contenido Web 2.0.
HTML Y CSS
- ¿Las etiquetas utilizadas son sintácticamente correctas?
- ¿Están íntegramente independizados los estilos a través de CSS?
- ¿Se usan unidades relativas (% y em) en todos los casos en lugar de absolutas (px)?
- ¿Se han definido las fuentes en una unidad de medida relativa(em)?
- En caso de aumentar la fuente predeterminada del navegador a 26 px (en lugar de 16px como está establecida), se agrandan los textos sin desarmarse el diseño?
- ¿El uso de tablas se restringe a la tabulación de datos y no para diagramar el contenido del Sitio Web?
- ¿Se puede navegar el Sitio íntegramente a través de un teclado?
- Se pueden navegar a través de un teclado los objetos incrustados (Ejemplo reproductor de audio)?
Compatibilidad con Navegadores
- ¿El Sitio es compatible con el navegador Internet Explorer 6?
- ¿El Sitio es compatible con el navegador Internet Explorer 7?
- ¿El Sitio es compatible con el navegador Internet Explorer 8?
- ¿El Sitio es compatible con el navegador Mozilla Firefox?
- ¿El Sitio es compatible con el navegador Safari?
- ¿El sitio es compatible con un lector de pantalla como JAWS o NVDA?
Identificación del lenguaje:
- El lenguaje está identificado de esta forma: <HTML lang=”es”>
- Las abreviaturas se encuentran señaladas con el atributo <abbr>? (Ejemplo “Alte”: <abbr title=”Almirante”>Alte.</abbr>)
- Las abreviaturas se encuentran restringida a las definidas por la Real Academia Española (Evitando por ejemplo “ascend.” para decir “ascendente”)
- ¿Los acrónimos se encuentran señalados con el atributo <acronym>? Ejemplo: “GCBA”: <acronym title=”Gobierno de la Ciudad de Buenos Aires”> GCBA </acronym>)
- ¿Las etiquetas <abbr> y <acronym> han sido utilizadas exclusivamente para su función y no para mostrar como “tooltip” información adicional de otra naturaleza? (Ejemplo de mala práctica: <acronym title=”Founded in 2006″> Twitter </acronym>)
Imágenes y animaciones:
- ¿Todas las imágenes y animaciones cuentan con un texto alternativo?
- ¿Los textos alternativos representan una alternativa válida para transmitir la misma información que comunica el formato no textual? (NOTA: Quien elabore el contenido debe proveer el texto alternativo para las imágenes informativas, de forma que el programador pueda incluirlas.)
- Ejemplos:El texto alternativo de un banner debe incluir la descripción de los objetos y/o textos que figuren en la imagen. No debe decir “banner”.El texto alternativo de una flecha (botón) debe decir “siguiente” o “volver”. No debe decir “flecha”.
- ¿Todas las animaciones pueden ser controladas (pausadas) por el usuario?
Multimedia:
- ¿Los audiovisuales o archivos de audio se encuentran subtitulados o incluyen el texto en un archivo tipo HTML u opciones Word o PDF accesible?
- ¿La voz principal se distingue con facilidad del sonido ambiente?
PDF:
- ¿Los documentos PDF pueden ser interpretados por un lector de pantallas para no videntes?(Validar con un lector de pantallas Ejemplo NVDA )
- Las imágenes del PDF, ¿cuentan con un texto alternativo?
- Si un documento PDF no fuera accesible, ¿existe una versión alternativa accesible en Word o HTML?
- ¿El enlace se encuentra acompañado con el ícono de Adobe PDF para indica claramente su formato?
- ¿El PDF abre en una nueva ventana?
Formularios: Carteles de error:
- ¿Evitan el lenguaje técnico y abreviaturas, utilizando un lenguaje claro y comprensible?
- ¿Hacer una descripción exacta del problema, en lugar de utilizar mensajes vagos y genéricos como “error de sintaxis”?
- ¿Señalan claramente el campo en cuestión (no basándose sólo en el color, sino, acompañándolo también de un icono)?
Enlaces
- ¿Se encuentran todas las rutas verificadas de tal modo que ninguna lleve a una ruta equivocada o inexistente?
- ¿Es navegable el Sitio con JavaScript desactivado?
Validadores:
- W3C
- SIDAR
- Accesibilidad.com
- Lector de Pantallas NVDA
facebook
Otros