Textos alternativos, imágenes accesibles. Herramientas de ayuda: mapa de decisión y wizard online
En este artículo os ofrezco dos herramientas para ayudaros a que vuestras imágenes sean accesibles.
Mapa de decisión para proporcionar textos alternativos adecuados a las imágenes de tu web
Descripción detallada de la imagen
Es un árbol de decisión de consulta rápida.
En función del tipo de imagen, su contexto y su función, recomienda la forma adecuada de incluir un texto alternativo a esa imagen.
Cada resultado del árbol incluye ejemplos y es un enlace a la página de resultados detallada de la segunda herramienta, el wizard online.
El mapa de decisión está en formato PNG e incluye una descripción detallada accesible.
Ir al mapa de decisión (PNG, 614KB)
Wizard online para adecuar el texto alternativo de tus imágenes al tipo de imagen, su contexto y función
Es un formulario online, basado en el mapa de decisión, que os guía, según el tipo de imagen, su contexto y su función, hasta llegar a una página de resultado final, con ejemplos, recursos y técnicas a usar en ese caso concreto.
Sobre las herramientas
Posiblemente uno de los requisitos de accesibilidad más conocidos es que las imágenes de una página web deben tener un texto alternativo.
Sin embargo, uno de los errores más habituales, incluso en los sitios que han trabajado la accesibilidad de sus páginas, es fácil encontrar textos alternativos inadecuados porque no se ha tenido en cuenta el tipo de imagen, su función o el contexto en el que se inserta.
Es más, incluso en los validadores automáticos de accesibilidad se reportan a veces falsos errores porque no se tienen en cuenta las diferentes casuísticas que se pueden dar (ver Falsos errores de validadores automáticos de accesibilidad basados en las WCAG 2.0 )
Esto me hizo pensar en idear alguna herramienta que permitiera consultar de forma sencilla la técnica más recomendable para incluir un texto alternativo en base al tipo de imagen, su propósito y función.
Las herramientas están basadas en el documento de apoyo de las WCAG 2.0 para comprender el criterio de conformidad 1.1.1 "Non-text Content: Understanding SC 1.1.1" donde se explican los diferentes casos y las técnicas o combinación de técnicas que se pueden aplicar.
El objetivo es divulgar estas buenas prácticas y facilitar su compresión y su aplicación. Se han seleccionado las técnicas comúnmente utilizadas, las más compatibles y mejor soportadas.
Las técnicas que se proponen no incluyen técnicas alternativas de WAI-ARIA o HTML5, pero como recursos complementarios se irán proponiendo:
- LONGDESC. Soporte y alternativas (WCAG 2.0, ARIA: "aria-describedby" y "aria-describedat", HTML5: <figure> y <picture>)
- La consulta de las técnicas específicas WAI-ARIA que proponen las WCAG 2.0 y expliqué en el artículo "Nuevas técnicas ARIA de las WCAG 2.0"
- Técnicas específicas de HTML5, disponibles en el documento del W3C, "HTML5: Techniques for providing useful text alternatives".
Cualquier comentario, propuesta o duda sobre las herramientas será muy bien recibida.
Otros artículos y herramientas relacionadas
- Herramienta de ayuda para validar de acuerdo a las WCAG 2.0 , es una herramienta que permite ir recogiendo los datos obtenidos durante la revisión automática y manual del sitio de acuerdo a las WCAG 2.0 y que te genera información de utilidad para realizar el informe. En cada criterio de éxito se incluye una descripción amigable de lo que hay que validar.
- Descripción extensa de una imagen: accesible con lector de pantalla y visible sin imágenes activas
- Artículos sobre accesibilidad y HTML 5
- Artículos sobre WAI-ARIA
- Sobre el uso de lectores de pantalla
- Más recursos y descargas
HTML 5 ya es hoy recomendación: http://www.w3.org/TR/html5/
El W3C también ha respondido a la objección formal de Apple al mantenimiento del atributo longdesc http://lists.w3.org/Archives/Public/public-html-admin/2014Oct/0099.html
Este permanecerá. HTML5 Image Description Extension (longdesc) es candidata a recomendación desde el 12/08/2014: http://www.w3.org/TR/html-longdesc/
Eliminar comentario de ' Olga Carreras ' con fecha de 29 de octubre de 2014, 8:46
Mapa de decisión de texto alternativo de las imágenes del W3C: https://www.w3.org/WAI/tutorials/images/decision-tree/
Eliminar comentario de ' Olga Carreras ' con fecha de 20 de septiembre de 2021, 11:20