El objetivo de introducir este tema en el curso es el de orientar a un correcto diseño de páginas web en interfaz, contenido y tecnologías utilizadas. A lo largo del tema se resumen las pautas más importantes, dependiendo del nivel de accesibilidad que se quiera o se deba llegar habrá que cumplir con todas ellas o procurar cumplir las máximas posibles.
Índice
1. Introducción
La accesibilidad web significa que una página web va a poder ser utilizada por usuarios con algún tipo de discapacidad o bien utilizando distintos dispositivos.
La discapacidad puede ser visual (poca visión, ceguera, daltonismo), motriz (incapacidad de utilizar un ratón, por ejemplo), auditiva, cognitiva (como la dislexia), … Pero no solo se refiere a discapacidades físicas, también pueden venir derivadas del dispositivo (móvil, tablet, …), software (sistema operativo, navegador, …), idioma, etc.
Para lograr que una web sea accesible existen una serie de pautas recomendadas por la W3C y su Iniciativa de Accesibilidad Web (WAI). Estas pautas están agrupadas según tres niveles de accesibilidad de dificultad de cumplimiento creciente [1]:
- A Toda página web tiene que satisfacer estos requisitos para impedir que haya usuarios para los que le sea imposible utilizarla.
- AA Requisitos que la web debería satisfacer para no dificultar su uso a determinados usuarios.
- AAA Una página web podría cumplir estos requisitos para facilitar en todo lo posible su uso.
2. Pautas de Accesibilidad al Contenido en la Web (WCAG)
Su función principal es guiar el diseño de páginas Web hacia un diseño accesible, reduciendo de esta forma barreras a la información. WCAG consiste en 14 pautas que proporcionan soluciones de diseño y que utilizan como ejemplo situaciones comunes en las que el diseño de una página puede producir problemas de acceso a la información.
- Proporcionar equivalentes en formato texto al contenido visual o audiovisual.
- No apoyarse únicamente en el color.
- Utilizar marcadores y hojas de estilo de forma apropiada.
- Clarificar el lenguaje natural utilizado.
- Crear tablas que se muestren adecuadamente.
- Asegurarse de que las páginas que utilizan nuevas tecnologías se muestran adecuadamente.
- Permitir control del usuario sobre eventos variables en el tiempo.
- Asegurarse de la accesibilidad de los interfaces de usuario creados.
- Diseñar independientemente del dispositivo.
- Utilizar soluciones provisionales.
- Utilizar recomendaciones y tecnologías del W3C.
- Proporcionar información de contexto y orientación.
- Proporcionar mecanismos claros de navegación.
- Asegurarse de que los documentos son claros y simples.
Consideraciones generales
- Imágenes y animaciones: Use el atributo alt para describir la función de cada elemento visual.
- Mapas de imágen: Use el elemento map y texto para las zonas activas.
- Multimedia: Proporcione subtítulos y transcripción del sonido, y descripción del vídeo.
- Enlaces de hipertexto: Use texto que tenga sentido leído fuera de contexto. Por ejemplo, evite el clásico “pinche aquí”.
- Organización de las páginas: Use encabezados, listas y estructura consistente. Use CSS para la maquetación donde sea posible.
- Figuras y diagramas: Descríbalos brevemente en la página o use el atributo longdesc.
- Scripts, applets y plug-ins: Ofrezca contenido alternativo si las funciones nuevas no son accesibles.
- Marcos: Use el elemento noframes y títulos con sentido.
- Tablas: Facilite la lectura línea a línea. Resuma.
- Revise su trabajo: Verifique. Use las herramientas, puntos de comprobación y pautas.
Puntos de control nivel A
Es el nivel más básico de accesibilidad propuesto por el W3C.
- Proporcione un texto equivalente para cada elemento no textual. Esto incluye imágenes, representaciones gráficas del texto (símbolos incluidos), regiones de un mapa de imágenes, animaciones, applets, sonidos, video…
- Proporcione enlaces de texto redundantes para cada región activa de un mapa de imágenes.
- Hasta que los navegadores puedan leer el texto equivalente de una pista visual, proporcione una descripción de la información más importante del contenido visual o la presentación multimedia en cuestión.
- Para cualquier presentación multimedia dinámica (por ejemplo, o una película o una animación), sincronice las alternativas equivalentes (subtítulos, o descripciones auditivas de la pista visual) con la presentación.
- Asegúrese de que toda la información resaltada con colores también está disponible sin color, por ejemplo mediante el contexto o algún marcado especial.
- Identifique claramente los cambios en el lenguaje natural del texto y en los equivalentes textuales.
- Para las tablas de datos, identificar las cabeceras de columna y de fila.
- Para las tablas de datos que tienen dos o más niveles lógicos de cabeceras de columna o de fila, utilice marcado para asociar las celdas de datos y las celdas de cabecera.
- Organice los documentos de forma que se puedan leer sin una hoja de estilo. Por ejemplo, cuando un documento HTML sea mostrado sin una hoja de estilo, debe ser posible leerlo.
- Asegúrese de que los equivalentes para el contenido dinámico cambian cuando cambie el contenido dinámico.
- Asegúrese de que las páginas son utilizables cuando los scripts, applets o elementos similares están desactivados o el navegador no los soporta. Si esto no es posible, proporcione información equivalente en una página accesible.
- Hasta que los navegadores puedan permitir a los usuarios controlar parpadeos indeseados, evite utilizar técnicas que produzcan parpadeos en pantalla.
- Los elementos programados (scrips, applets…) deben ser directamente accesibles o serlo con alguna tecnología de ayuda.
- Proporcione mapas de imágenes que trabajen en el lado del cliente en vez de en el lado del servidor, salvo cuando las distintas regiones no puedan ser definidas con alguna forma geométrica disponible.
- Si, después de todos los esfuerzos, no se puede crear una página accesible, se debe proporcionar un enlace a una página alternativa que utilice tecnologías del W3C, sea accesible, tenga información (o funcionalidad) equivalente y sea actualizada tan frecuentemente como la página original.
- Ponga título a cada frame (marco) para facilitar la identificación y la navegación.
- Utilice el lenguaje más claro y más simple posible para todo el contenido.
Puntos de control nivel AA
Este es el siguiente nivel para las normas de accesibilidad web. Hay que tener en cuenta que los niveles se construyen uno encima de otro, de forma que para cumplir con el nivel AA hay que cumplir también con el nivel A. En este caso hay 29 puntos de control.
Los requisitos de nivel A son suficientes para hacer una web mínimamente accesible, pero aún será muy incómodo navegar por sus páginas si no se toman en consideración algunos puntos más. A continuación detallamos los más significativos.
- Asegúrese de que las combinaciones de colores de primer plano y fondo proporcionan suficiente contraste para que puedan ser visualizados por una persona con déficit visual o en un monitor monocromo.
- Cree documentos que validen de acuerdo a normas formales ya publicadas.
- Utilice hojas de estilo para controlar la presentación y la colocación de los elementos (nada de tablas).
- Etiquete las listas y sus elementos de forma apropiada.
- Marque las citas. No utilices las etiquetas de citaciones para realizar efectos de formato, tales como indentación.
- No utilice tablas para la presentación a no ser que la tabla pueda leerse de forma lineal y tenga sentido. Si no, proporcione una alternativa equivalente. (No utilizar tablas para otro propósito que no sea el de presentar datos tabulados).
- No haga que aparezcan ventanas nuevas ni cambie la ventana actual sin informar al usuario.
- Utilice tecnologías del W3C cuando estén disponibles y sean apropiadas para la tarea a realizar, y use las últimas versiones cuando estén soportadas.
Puntos de control nivel AAA
El nivel AAA es el último nivel del WCAG. Muchos programadores web llegan al nivel AA pero no se preocupan del nivel AAA, cuando muchas veces los puntos de control son muy fáciles de verificar y la mayoría se comprueban como válidos a simple vista. Este nivel consta de 19 puntos, a continuación desglosamos los más llamativos.
- Especifique el significado de una abreviatura o acrónimo la primera vez que aparece en un documento.
- Identifique el lenguaje principal del documento.
- Cree un orden lógico de navegación con la tecla tab a través de objetos, formularios y enlaces.
- Proporcione atajos de teclado a enlaces importantes, controles de formularios…
- Proporcione información para que los usuarios puedan recibir documentos de acuerdo a sus preferencias (por ejemplo en lo referente a idioma, formato…)
- Complemente el texto con presentaciones gráficas o auditivas allí donde faciliten la comprensión del contenido.
- Cree un estilo de presentación que sea consistente a través de todas las páginas.
Recursos
- Legislación y normativa sobre accesibilidad y TIC (Rafael García Cabrera, PDF).
