Técnica Técnicas generales WCAG 2.2
G14Garantizar que la información transmitida mediante diferencias de color también esté disponible en texto
En resumen
Cuando el color se usa para transmitir información (campos obligatorios en rojo, categorías por colores en un calendario, botones verdes para continuar), esta técnica pide que esa misma información aparezca también en texto, de forma explícita y no condicional. Beneficia a personas con daltonismo o baja visión, a quienes usan lector de pantalla y a cualquiera que vea la página en blanco y negro o con poca luz. Aplíquela en formularios, agendas, gráficos y leyendas.
Aplicabilidad
Todas las tecnologías que admiten color y texto.
Descripción
El objetivo de esta técnica es garantizar que, cuando se utilizan diferencias de color para transmitir información, como los campos obligatorios de un formulario, la información transmitida por esas diferencias de color se transmita también de forma explícita en texto.
Ejemplos
Un programa codificado por colores
El programa de sesiones de un congreso tecnológico se organiza en tres itinerarios. Las sesiones del itinerario 1 se muestran sobre fondo azul. Las sesiones del itinerario 2 se muestran sobre fondo amarillo. Las sesiones del itinerario 3 se muestran sobre fondo verde. Tras el nombre de cada sesión aparece un código en texto que identifica el itinerario: T1 para el itinerario 1, T2 para el itinerario 2 y T3 para el itinerario 3.
Un programa codificado por colores con iconos
El programa de sesiones de un congreso tecnológico se organiza en tres itinerarios. Junto al título de cada sesión hay un icono formado por un círculo de color con un número en el centro que indica a qué itinerario pertenece: los círculos azules con el número 1 representan el itinerario 1, los círculos amarillos con el número 2 representan el itinerario 2 y los círculos verdes con el número 3 representan el itinerario 3. Cada icono está asociado a una alternativa textual que dice «Track 1», «Track 2» o «Track 3» (itinerario 1, 2 o 3), según corresponda.
Un formulario con campos obligatorios
Un formulario contiene varios campos obligatorios. Las etiquetas de los campos obligatorios se muestran en rojo. Además, al final de cada etiqueta hay un carácter asterisco, *. Las instrucciones para rellenar el formulario indican que «todos los campos obligatorios se muestran en rojo y marcados con un asterisco *», seguidas de un ejemplo.
Es posible que no todos los lectores de pantalla lean los asteriscos (en todos los modos de lectura) y que resulten difíciles de ver para los usuarios con baja visión, porque se muestran en un tamaño menor que el texto predeterminado. Es importante que los autores incluyan el texto que indica que se utiliza el asterisco y que consideren aumentar el tamaño del asterisco que se presenta.
Un formulario con un botón de envío verde
Una solicitud de préstamo en línea explica que los botones verdes avanzan en el proceso y los botones rojos lo cancelan. Un formulario contiene un botón verde con el texto Go. Las instrucciones dicen: «Pulse el botón etiquetado Go para enviar sus resultados y pasar al siguiente paso».
Pruebas
Procedimiento
Para cada elemento en el que se utilice una diferencia de color para transmitir información:
- Comprobar que la información transmitida también está disponible en texto y que dicho texto no es contenido condicional.
Resultados esperados
- La comprobación n.º 1 es verdadera.
Cómo lo comprobamos en ADDAW
En las auditorías de accesibilidad de ADDAW revisamos cada criterio de conformidad siguiendo este catálogo de técnicas: comprobamos si la web aplica una técnica suficiente y documentamos cada fallo común con capturas y el código afectado, para que el equipo de desarrollo sepa exactamente qué corregir. Los informes siguen la metodología del Observatorio de Accesibilidad y la norma UNE-EN 301 549.
Fuente y licencia
Traducción al español, no oficial, realizada por ADDAW a partir de la técnica G14 del documento «Techniques for WCAG 2.2» del W3C (versión del repositorio público del W3C a 22/10/2026). Copyright © W3C® (MIT, ERCIM, Keio, Beihang). Se publica conforme a la licencia de documentos del W3C. El texto normativo de referencia es el original en inglés; si detecta un error en la traducción, escríbanos.
