Principio 1/1.4 Distinguible/1.4.12-A

De WCAG Wiki

1.4.12-A. Ajustes de espaciado del texto

Discapacidades afectadas

Este criterio puede afectar a distintas personas con discapacidad. A continuación se indican las más relevantes.

Enunciado del criterio (Observatorio de Accesibilidad Web)

  • Si el lenguaje de marcado utilizado admite las propiedades de estilo, el texto se puede formatear de la siguiente manera sin perder contenido ni funcionalidad y sin necesidad de tocar otros estilos:
    • Espacio entre líneas: ≥ 1.5 × tamaño de fuente
    • Espacio entre párrafos: ≥ 2 × tamaño de fuente
    • Espacio entre letras: ≥ 0.12 × tamaño de fuente
    • Espacio entre palabras: ≥ 0.16 × tamaño de fuente

Comprensión del criterio

Descripción resumida

El contenido debe permitir que las personas aumenten interlineado, espaciado entre palabras, letras y párrafos sin que el texto se superponga, se corte o pierda funcionalidad. El diseño no debe impedir estos ajustes.

Objetivo

Facilitar la lectura y comprensión a personas con baja visión y con dificultades de procesamiento (p. ej., dislexia) permitiendo ajustar el espaciado sin romper el diseño.

Importancia de cumplir el criterio

Si el espaciado no puede modificarse o, al ajustarlo, el contenido se solapa o desaparece, la legibilidad y el uso del sitio se ven gravemente afectados.

Referencias WCAG

  • C36: Permitir anulación del espaciado de texto
  • C21: Usar line-height accesible
  • C28: Contenedores en unidades relativas (em)
  • F104: Fallo por texto cortado al aumentar espaciado

Recursos de apoyo

  • Evitar valores fijos que impidan reflujo del texto
  • Usar line-height, letter-spacing, word-spacing con valores relativos
  • Definir contenedores con em para permitir crecimiento
  • Probar con herramientas automáticas

Evaluación del criterio

Tipo de evaluación

Procedimiento de evaluación

  1. Paso 1. Aplicar el bookmarklet “Text spacing” de Steve Faulkner.
  2. Paso 2. Revisar que no haya solapamiento, recortes o pérdida de funcionalidad.
  3. Paso 3. Verificar controles, botones, formularios y menús.

Resultado esperado

El contenido mantiene legibilidad y funcionalidad al aplicar los valores mínimos de espaciado definidos.

Ejemplo

Ejemplo accesible:
body {
  line-height: 1.5;
  letter-spacing: 0.12em;
  word-spacing: 0.16em;
}

El texto puede espaciarse sin romper el diseño.

Ejemplo no accesible:

p { line-height: 1 !important; }

El uso de !important bloquea ajustes necesarios.

Otras herramientas de evaluación

  • Bookmarklet “Text spacing” (Steve Faulkner)
  • DevTools del navegador










Ejemplos accesibles y no accesibles creados por alumnos

Comentarios

A continuación se muestran comentarios sobre el criterio 1.4.12-A. Ajustes de espaciado del texto

Loading comments...