Un contraste insuficiente entre el texto y el fondo es uno de los cuellos de botella que más aparece en los análisis de accesibilidad, y al mismo tiempo uno de los errores más fáciles de evitar. El problema ocurre cuando hay texto gris claro sobre un fondo blanco, cuando los botones solo son visibles por un cambio de color sutil, o cuando el texto de marcador de posición en un campo de formulario sirve como única indicación de lo que debe rellenarse. Para personas con discapacidad visual, pero también para cualquiera que use una pantalla bajo una luz solar intensa, el texto se vuelve literalmente ilegible.
WCAG 2.1, la norma a la que EN 301 549 hace referencia, prescribe para el nivel AA una relación de contraste mínima entre el texto y el fondo sobre el que se encuentra: generalmente 4,5 a 1 para texto normal y 3 a 1 para texto grande y para elementos interactivos como botones y bordes de formularios. Suena técnico, pero la idea subyacente es simple: el contraste no es una elección estética, es un requisito para transmitir información.
Dónde falla en la práctica
Los problemas de contraste rara vez son intencionales. Se cuelan a través de opciones de identidad corporativa que se ven bien en una pantalla grande y nítida en un estudio de diseño, pero en una pantalla promedio para un usuario promedio terminan justo por debajo de la norma. Un texto de botón gris claro sobre un fondo de color pastel es un ejemplo clásico. Lo mismo ocurre con los enlaces que solo se reconocen por una diferencia de color, sin subrayado u otra señal visual, lo que hace que las personas daltónicas simplemente no los vean como clicables.
Otro patrón recurrente es el estado de desplazamiento: un botón que en reposo cumple perfectamente, pero que cambia a una combinación de colores que no ha sido verificada al mover el ratón. Los mensajes de error en formularios también son un error común: texto rojo sobre un fondo rojo claro parece consistente con la identidad corporativa, pero a menudo no alcanza la relación requerida. Si le interesa ver cómo estos cuellos de botella se ven en su propio entorno, puede hacerlo en un par de preguntas ver dónde se encuentra su sitio sin necesidad de crear una cuenta primero.
Por qué un análisis automático resuelve esto parcialmente, pero no completamente
Las relaciones de contraste se pueden medir bien automáticamente: un analizador lee los valores de color del texto y el fondo y calcula la relación. Con esto, este es uno de los pocos criterios de WCAG que una herramienta puede verificar de manera confiable. Lo que un análisis no ve es el contraste que solo aparece después de una interacción, como un menú desplegable, una información que aparece al enfocar, o un estado que solo se vuelve visible después de una acción del usuario. Es precisamente por eso que cada informe indica qué parte se ha verificado automáticamente y qué parte requiere evaluación manual; el contraste es un punto fuerte de la verificación automática, pero no es todo el panorama.
Cómo evitarlo de manera estructural
La forma más común de evitar este problema de manera permanente es establecer el contraste en el nivel del sistema de diseño en lugar de página por página. Cuando los colores base de una identidad corporativa ya se verifican según la norma al establecerlos, un editor o desarrollador no tiene que comprobarlo repetidamente. Esto también previene que una nueva página, un banner de campaña temporal o un widget adquirido externamente comprometa inadvertidamente la relación de contraste.
Por otra parte, es aconsejable incluir el contraste explícitamente en todos los cambios visuales del sitio, no solo en la primera entrega. Una renovación de la identidad visual, un nuevo tema de temporada o un estilo de botón modificado pueden introducir un problema que no existía en la versión anterior. La accesibilidad no es en este sentido una casilla que marque una sola vez, sino un aspecto que requiere atención continua durante el mantenimiento. Para obtener más información sobre cómo funciona en la práctica este control continuo, lea una explicación de dónde procede la evaluación.
Por último, vale la pena no solo considerar la norma mínima, sino el propósito detrás de ella: ¿pueden todos, incluso en condiciones de iluminación menos ideales o en una pantalla más antigua, distinguir realmente el texto y los botones? Los casos dudosos frecuentes, como si un logotipo o una imagen decorativa también debe cumplir con el requisito de contraste, se explican en la página con respuestas a preguntas que se formulan con frecuencia.
¿Desea saber si el contraste y otros puntos críticos recurrentes también están presentes en su propio entorno? La quick-scan gratuita proporciona una primera indicación al respecto, y la base de conocimientos con temas organizados por situación muestra cómo esta cuestión se relaciona con el resto de las obligaciones en torno a la European Accessibility Act.