Espaciado de texto

Qué exige este criterio

Los usuarios con dislexia, baja visión o discapacidades cognitivas instalan con frecuencia extensiones de navegador u hojas de estilo de usuario que amplían una tipografía demasiado compacta. El criterio define cuatro modificaciones específicas —altura de línea 1,5 veces el tamaño de fuente, espaciado entre párrafos 2 veces el tamaño de fuente, espaciado entre letras 0,12 em, espaciado entre palabras 0,16 em— y exige que la página siga funcionando cuando se aplican. Sin texto recortado, sin desbordamiento, sin contenido perdido.

Cómo cumplirlo

• Defina las alturas de contenedor con min-height en lugar de height fija para que crezcan cuando el texto se expande.
• Evite alturas fijas en píxeles para botones, elementos de navegación, tarjetas e insignias: permita que crezcan con el contenido.
• Realice pruebas pegando el marcador de texto conocido (existe un marcador de WCAG 1.4.12 para espaciado de texto) que aplica las cuatro modificaciones de forma simultánea.
• Permita que el texto se ajuste de forma natural; no use white-space: nowrap en etiquetas que puedan crecer.
• Verifique que los menús de navegación, pestañas y etiquetas de pestañas siguen ajustándose cuando el espaciado entre letras se amplía.

Fallos frecuentes

• Botones con height: 40px que recortan la etiqueta cuando la altura de línea crece hasta 1,5.
• Etiquetas de pestañas con white-space: nowrap que desbordan su contenedor cuando el espaciado entre letras aumenta.
• Tarjetas con alturas fijas donde el texto queda oculto tras un degradado de «leer más».
• Tooltips e insignias que recortan su texto cuando el espaciado entre párrafos crece.
• Encabezados fijos con alturas fijas que se superponen al contenido de la página cuando el texto de navegación crece.

Por qué importa

Este criterio detecta maquetaciones diseñadas para un único conjunto de espaciado, en las que el diseñador ha bloqueado todo en función de una altura de línea perfecta en Figma. Los usuarios de herramientas de apoyo a la lectura aplican modificaciones de espaciado de forma constante. La corrección habitual consiste en pasar de height a min-height y eliminar white-space: nowrap —cambios mecánicos y sencillos que repercuten positivamente en toda la interfaz.