Accesibilidad

La recomendación Web Content Accessibility Guidelines (WCAG) establece una serie de consejos para hacer accesibles las páginas web a usuarios con discapacidad visual, auditiva o de movimientos. En versiones recientes se detallan los criterios para conseguir hasta tres niveles de cumplimiento crecientes: A, AA y AAA y los procedimientos de comprobación del nivel conseguido.

La primera versión de la recomendación WCAG (publicada en mayo de 1999) incluía la recomendación genérica de que el color de texto tuviera suficiente contraste con el color de fondo para permitir su lectura en monitores en blanco y negro o por usuarios con deficiencias visuales. En la versión WCAG 2.0 (publicada en diciembre de 2008) se establecieron criterios numéricos que permiten evaluar el nivel conseguido de forma objetiva. En la versión WCAG 2.1 (publicada en junio de 2018) se añadieron criterios para el contraste entre colores contiguos.

La última edición publicada actualmente (octubre de 2023) Web Content Accessibility Guidelines (WCAG) 2.2, publicada en octubre de 2023, mantiene los criterios de la edición anterior.

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 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