Accesibilidad

La recomendación Web Content Accessibility Guidelines (WCAG) 2.1, publicada en junio de 2018, establece una serie de consejos para hacer más accesibles las páginas web a usuarios con discapacidad visual, auditiva o de movimientos.

En cada apartado de la norma se detallan los criterios para conseguir hasta tres niveles de cumplimiento crecientes: A, AA y AAA.

En construcciónPor el momento, esta lección sólo comenta el criterio de contraste entre el color del fondo y el color del texto.

Contraste de colores

La recomendación WCAG 2.1 define el contraste entre los colores de fondo y el texto como un número entre 1 y 21,1 que se calcula a partir de ambos colores.

El nivel de cumplimiento AA se consigue:

El nivel de cumplimiento AAA se consigue:

El cuadro siguiente permite elegir colores de fondo y de texto (en formato HSL) moviendo los deslizadores y automáticamente calcula el contraste y el nivel de cumplimiento alcanzado en tamaños de letras grandes o en pequeños:

Color del Fondo
Valor
Matiz:
Saturación:
Luminosidad:
Color del Texto
Valor
Matiz:
Saturación:
Luminosidad:
CONTRASTE: >= 18pt >= 14pt < 18pt < 14pt Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet Lorem ipsum dolor sit amet