Alcance AA: umbrales para texto y texto grande
Conozca las relaciones mínimas para texto normal y grande.
Alcance AA: umbrales para texto y texto grande es una lección gratuita de Web Accessibility Academy en CoddyKit. Esta es la lección 2 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de Web Accessibility Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de Web Accessibility Academy incluye 4 lecciones en total.
Alcance el objetivo AA
La mayoría de los equipos se comprometen con el nivel AA de WCAG para el contraste. Es lo bastante estricto para ayudar a usuarios reales y lo bastante realista para implementarlo.
Texto normal: 4.5 a 1
Para el texto del cuerpo, AA exige al menos 4.5:1. Esto abarca los párrafos, las etiquetas y la mayoría de las palabras de la página.
Qué se considera grande
Texto grande significa 24px normal, o 18.66px en negrita. A ese tamaño las letras son más fáciles de leer, por lo que las reglas son menos exigentes.
Texto grande: 3 a 1
El texto grande solo necesita 3:1. Las formas más grandes tienen mayor peso visual, por lo que una diferencia de brillo menor sigue siendo claramente legible.
La negrita reduce el tamaño mínimo
El grosor importa: el texto en negrita se considera grande a partir de 18.66px, ya que los trazos más gruesos son simplemente más fáciles de percibir.
Puntos frente a píxeles
WCAG define el tamaño grande como 18pt normal o 14pt en negrita, que equivalen a 24px y 18.66px en CSS. Normalmente, las herramientas hacen la conversión por usted.
Componentes de la interfaz: 3 a 1
Los botones, las entradas y los indicadores de foco deben alcanzar 3:1 respecto a su entorno según el criterio 1.4.11, para que los controles sigan siendo visibles.
AAA va más allá
¿Quiere garantías más sólidas? AAA eleva el texto normal a 7:1 y el texto grande a 4.5:1, pero la mayoría de los productos toman AA como referencia mínima.
Los elementos desactivados y los logotipos están exentos
Algunos elementos no están sujetos a la regla: los controles desactivados, la decoración pura y los logotipos de marca no tienen un requisito mínimo de contraste.
El texto de marcador también cuenta
Ese marcador gris tenue es texto real, por lo que también debe cumplir 4.5:1. La mayoría de los valores predeterminados no lo hacen; oscúrezcalos deliberadamente.
Definir el tamaño del texto grande en CSS
Este encabezado alcanza el tamaño de large-text, por lo que una proporción de 3:1 basta para superar AA.
h2 {
font-size: 24px;
font-weight: 400;
}Comprobación rápida
Concretemos los valores AA para los distintos tipos de texto.
Repaso: alcanzar AA
Recuerde la pareja: 4.5:1 para el texto normal y 3:1 para el texto grande o las partes de la interfaz. Cumpla estos valores y el contraste superará AA. A continuación: no depender nunca solo del color. 🎯
Preguntas frecuentes
¿La lección «Alcance AA: umbrales para texto y texto grande» es gratis?
Sí — el texto completo de «Alcance AA: umbrales para texto y texto grande» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de Web Accessibility Academy, actualiza a CoddyKit PRO. El curso de Web Accessibility Academy incluye 4 lecciones en total.
¿Qué aprenderé en «Alcance AA: umbrales para texto y texto grande»?
Conozca las relaciones mínimas para texto normal y grande. Practicas Web Accessibility Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.
¿Necesito experiencia previa para empezar Web Accessibility Academy?
No se requiere experiencia previa. Web Accessibility Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 2 de 4.
¿Cuánto tiempo toma la lección «Alcance AA: umbrales para texto y texto grande»?
La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.
¿Puedo escribir y ejecutar código en esta lección de Web Accessibility Academy?
Sí. Cada lección de Web Accessibility Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.
Todas las lecciones de este curso
- Por qué existen las relaciones de contraste
- Alcance AA: umbrales para texto y texto grande
- Nunca dependa solo del color
- Compruebe el contraste con herramientas gratuitas