Verifica el Contraste de Color WCAG y Genera Paletas Accesibles
El rápido zorro marrón salta sobre el perro perezoso
Al hacer que la accesibilidad forme parte de tu flujo de diseño web, mejorará la usabilidad de tu sitio web y tus usuarios tendrán una mejor experiencia, lo que puede resultar en ampliar tu audiencia, tus usuarios serán tus embajadores y eso puede llever a aumentar tu tráfico. Más que cuestiones legales, nuestro objetivo es fomentar la accesibilidad y la inclusión para todos, y ayudarte a que el diseño de tu sitio web sea consciente y compatible.
Estas pautas se basan en los estándares (niveles A y AA) de las Web Content Accessibility Guidelines (WCAG) (link externo), y aquí tienes una forma de verificar el cumplimiento hasta el nivel más alto de requisitos AAA.
El contraste de color es la diferencia de brillo entre los colores de primer plano y fondo. Se mide como una relación de 1:1 (sin contraste) a 21:1 (contraste máximo).
Un contraste mayor hace que el texto sea más fácil de leer, especialmente para usuarios con discapacidades visuales.
Un contraste de color adecuado garantiza que todos puedan leer tu contenido, incluidas las personas con baja visión, daltonismo o que estén viendo contenido bajo la luz solar intensa.
Las WCAG requieren ratios mínimos de contraste: 4.5:1 para texto normal (nivel AA) y 7:1 para accesibilidad mejorada (nivel AAA).
El texto más grande es más fácil de leer y requiere menos contraste. WCAG define "texto grande" como 18pt (24px) o más grande para peso regular, y 14pt (18.5px) o más grande para texto en negrita.
El texto grande solo necesita una relación de contraste de 3:1 para cumplimiento AA, en comparación con 4.5:1 para texto normal.