Diferencia entre revisiones de «Principio 1/1.4 Distinguible/1.4.12-A»

De WCAG Wiki
← Edición anteriorEdición siguiente →
VisualWikitexto
Sin resumen de edición
Sin resumen de edición
Línea 1: Línea 1:
== '''1.4.12-A. Ajustes de espaciado del texto''' ==
{{CriterioWCAG
<!-- 
|id_wcag_criterio=1.4.12
  Análisis interno:
|id_wcag_subcriterio=1.4.12-A
  Este criterio impacta principalmente a: Personas con baja visión y discapacidad cognitiva 
|wcag_titulo_criterio=1.4.12-A. Ajustes de espaciado del texto
  Problema grave: Si no se permite ajustar interlineado, espaciado entre párrafos, letras o palabras, los usuarios con baja visión tendrán dificultades para leer, y los usuarios con discapacidad cognitiva pueden encontrar el texto confuso, provocando barreras graves a moderadas.
|wcag_nivel=AA
-->
|wcag_version=2.2
<html>
|wcag_principio=1_Perceptible
<!-- criterio 1.4.12-A -->
|wcag_principio_url=Principio_1
<article class="wcag-card">
|wcag_pauta=1.4_Facilitar_ver_y_escuchar_contenido
   <section class="wcag-info">
|wcag_pauta_url=Principio_1/1.4_Facilitar_ver_y_escuchar_contenido
    <ul>
|wcag_grupo=Texto
      <li><span class="label">Nivel:</span><span class="value">AA</span></li>
|wcag_subgrupo=Espaciado
      <li><span class="label">Versión:</span><span class="value">2.2</span></li>
 
      <li><span class="label">Principio:</span><span class="value">1. Perceptible</span></li>
|wcag_discapacidades=
      <li><span class="label">Pauta:</span><span class="value">1.4 Facilitar ver y escuchar contenido</span></li>
<li class="discapacidad-item">
      <li><span class="label">Categoría:</span><span class="value">Texto</span></li>
   [[Archivo:Bajavision.png|20px|class=icon-discapacidad|alt=Baja visión]]
      <li><span class="label">Subcategoría:</span><span class="value">Espaciado</span></li>
  <span class="discapacidad-texto">[[:Categoría:Discapacidad baja visión|Baja visión]]</span> –
    </ul>
  <span class="gravedad gravedad-grave">Barrera grave</span>
  </section>
</li>
  <section class="wcag-users">
<li class="discapacidad-item">
    <p>Usuarios más afectados</p>
  [[Archivo:Cognitiva.png|20px|class=icon-discapacidad|alt=Discapacidad cognitiva]]
    <ul>
  <span class="discapacidad-texto">[[:Categoría:Discapacidad cognitiva|Cognitiva]]</span> –
      <li><img src="/images/b/b7/Bajavision.png" alt="Icono baja visión" class="icono-discapacidad" /> Personas con baja visión – <span class="gravedad">Barrera grave</span></li>
  <span class="gravedad gravedad-moderada">Barrera moderada</span>
      <li><img src="/images/4/40/Cognitiva.png" alt="Icono discapacidad cognitiva" class="icono-discapacidad" /> Personas con discapacidad cognitiva – <span class="gravedad">Barrera moderada</span></li>
</li>
    </ul>
 
  </section>
|wcag_lista_discapacidades=
</article>
[[Categoría:Discapacidad baja visión]]
</html>
[[Categoría:Discapacidad cognitiva]]
 
|wcag_texto_criterioOAW=
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
 
|wcag_descripcion_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.
 
|wcag_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.
 
|wcag_importancia=
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.
 
|wcag_referencias=
<ul>
<li>C36: Permitir anulación del espaciado de texto</li>
<li>C21: Usar line-height accesible</li>
<li>C28: Contenedores en unidades relativas (em)</li>
<li>F104: Fallo por texto cortado al aumentar espaciado</li>
</ul>
 
|wcag_recursos=
<ul>
<li>Evitar valores fijos que impidan reflujo del texto</li>
<li>Usar <code>line-height</code>, <code>letter-spacing</code>, <code>word-spacing</code> con valores relativos</li>
<li>Definir contenedores con <code>em</code> para permitir crecimiento</li>
<li>Probar con herramientas automáticas</li>
</ul>
 
|wcag_tipo_evaluacion=Comprobación manual
 
|wcag_pasos_evaluacion=
<ol class="paso-list">
<li><span class="paso-badge">Paso 1.</span> Aplicar el bookmarklet “Text spacing” de Steve Faulkner.</li>
<li><span class="paso-badge">Paso 2.</span> Revisar que no haya solapamiento, recortes o pérdida de funcionalidad.</li>
<li><span class="paso-badge">Paso 3.</span> Verificar controles, botones, formularios y menús.</li>
</ol>
 
|wcag_resultado_evaluacion=
El contenido mantiene legibilidad y funcionalidad al aplicar los valores mínimos de espaciado definidos.
 
|wcag_ejemplo_evaluacion=
Ejemplo accesible:
<div class="accessibility-card">
<pre class="wcag-codigo-css">
body {
  line-height: 1.5;
  letter-spacing: 0.12em;
  word-spacing: 0.16em;
}
</pre>
<p>El texto puede espaciarse sin romper el diseño.</p>
</div>
 
Ejemplo no accesible:
<div class="accessibility-card-error">
<pre class="wcag-codigo-css">
p { line-height: 1 !important; }
</pre>
<p>El uso de <code>!important</code> bloquea ajustes necesarios.</p>
</div>
 
|wcag_otras_herramientas_evaluacion=
<ul>
<li>Bookmarklet “Text spacing” (Steve Faulkner)</li>
<li>DevTools del navegador</li>
</ul>
}}

Revisión del 19:07 4 nov 2025

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

Evaluación Comprobación manual

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




Obtenido de «https://wikiwcag.udl.cat/index.php?title=Principio_1/1.4_Distinguible/1.4.12-A&oldid=3346»