Técnica Técnicas generales WCAG 2.2

G209Proporcionar suficiente contraste en los límites entre colores adyacentes

En resumen

Esta técnica indica cómo conseguir que, en gráficos con varios colores contiguos (gráficos de sectores, mapas, diagramas), los límites entre zonas se distingan: o bien los colores adyacentes contrastan al menos 3:1 entre sí, o bien se añade un borde que contraste 3:1 con cada color. Beneficia a las personas con baja visión moderada y a quienes perciben mal el color. Úsela al diseñar o auditar gráficos que dependan de distinguir áreas de color.

Aplicabilidad

Para gráficos que utilizan varios colores adyacentes entre sí.

Descripción

El objetivo de esta técnica es garantizar que las personas con baja visión moderada puedan distinguir los límites entre segmentos de color contiguos.

El criterio de conformidad sobre contraste no textual utiliza el término «objeto gráfico» para abarcar tanto los gráficos pequeños y sencillos como las partes de gráficos más grandes y complejos. Esta técnica se centra en los segmentos de color sólido en los que los límites entre colores transmiten significado.

Al seleccionar los colores de gráficos con varios colores, tenga en cuenta los colores contiguos y compruebe que la relación de contraste es de al menos 3:1. Si los colores contiguos tienen una relación de contraste inferior a 3:1 entre sí, añada un borde con una relación de contraste de al menos 3:1 con cada uno de los colores.

Ejemplos

Gráfico de sectores con colores claros y oscuros alternos

Gráfico de sectores de los sabores de caramelo favoritos, con etiquetas de texto y segmentos que contrastan entre sí. — El contraste entre los segmentos contiguos del gráfico de sectores va de 5,8 a 9,4.

Gráfico de sectores con bordes entre los segmentos

Gráfico de sectores de los sabores de caramelo favoritos, con etiquetas de texto y bordes contrastados entre los segmentos. — El contraste entre los segmentos del gráfico de sectores va de 1,1 a 1,8. Se ha añadido un borde con una relación de contraste de al menos 3:1 con los colores para distinguir los segmentos.

Mapa con límites marcados por bordes

Mapa que muestra regiones sencillas con colores de fondo oscuros y un borde claro entre las regiones. — El contraste de color entre las áreas del mapa va de 1,3 a 1,8. Se añade una línea de límite con una relación de contraste de al menos 3:1 con los colores de las áreas.

Gráfico de sectores con bordes en blanco y negro

Gráfico de sectores de los sabores de caramelo favoritos, con etiquetas de texto y bordes en blanco y negro entre los segmentos. — Las áreas coloreadas del gráfico son tanto oscuras como claras. Se añade una línea de límite en blanco y negro para garantizar un contraste suficiente tanto con los colores claros como con los oscuros.

Pruebas

Procedimiento

Para cada objeto gráfico necesario para la comprensión, utilizar una herramienta de contraste de color para:

Medir la relación de contraste de cada color respecto al color o colores adyacentes o al borde (si existe).
Comprobar que la relación de contraste es de al menos 3:1 para cada color adyacente o borde (si existe).

Resultados esperados

La comprobación n.º 2 es verdadera.

Recursos

Comprender el criterio de conformidad 1.4.3 Contraste mínimo enumera herramientas de contraste de color.

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.

Solicitar una auditoría

Fuente y licencia

Traducción al español, no oficial, realizada por ADDAW a partir de la técnica G209 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.