Los elementos deben tener suficiente contraste de color (regla mejorada)

Según los umbrales de relación de contraste WCAG 2 AAA, todos los elementos de texto deben tener suficiente contraste entre el texto de primer plano y los colores de fondo.

Algunas personas con problemas de visión tienen poco contraste, lo que significa que hay pocas áreas brillantes u oscuras. Todo parece aproximadamente del mismo brillo, lo que dificulta detectar contornos, bordes, límites y detalles. El texto cuya luminancia (brillo) es demasiado similar al fondo puede ser difícil de leer.

Casi tres veces más personas sufren de baja visión que de ceguera total. Aproximadamente el 8% de los hombres y el 0,4% de las mujeres en Estados Unidos no pueden ver el espectro completo típico de colores. Una persona con visión deteriorada o daltonismo no puede distinguir el texto contra un fondo con contraste insuficiente.

En el fondo, tanto la transparencia como la opacidad del color se tienen en cuenta.

La transparencia y opacidad de los colores en primer plano son más difíciles de detectar y considerar debido a:

• Los colores de fondo y primer plano son iguales.
• Fondos de gradiente en CSS
• Colores de fondo para pseudo-elementos en CSS.
• Colores de fondo generados usando bordes CSS.
• Superposición por otra pieza en primer plano - esto puede presentar desafíos de posicionamiento.
• Elementos desplazados fuera de la ventana de visualización usando CSS.

Qué verifica esta regla de accesibilidad

Examina cada elemento de texto para verificar que el contraste entre el texto de primer plano y los colores de fondo cumple con los requisitos de relación de contraste WCAG 2 AAA.

Esta regla no reporta elementos de texto que tengan un background-image, estén ocultos por otros componentes, o sean imágenes de texto.

Esta verificación adicionalmente busca elementos hijos de botones deshabilitados para que puedan ser ignorados y prevenir un valor falso.

Learn more:

Deque Reference

Deque University - How To Fix

→