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

De WCAG Wiki
← Edición anterior
VisualWikitexto
Sin resumen de edición
Sin resumen de edición
 
(No se muestran 4 ediciones intermedias del mismo usuario)
Línea 1: Línea 1:
== '''EN DESARROLLO''' ==
{{CriterioWCAG
|id_wcag_criterio=1.4.12
|id_wcag_subcriterio=1.4.12-A
|wcag_titulo_criterio=1.4.12-A. Ajustes de espaciado del texto
|wcag_nivel=AA
|wcag_version=2.1
|wcag_principio=1_Perceptible
|wcag_principio_url=Principio_1
|wcag_pauta=1.4_Distinguible
|wcag_pauta_url=Principio_1/1.4_Distinguible
|wcag_grupo=Texto
|wcag_subgrupo=Espaciado
 
|wcag_discapacidades=
<li class="discapacidad-item">
  [[Archivo:Bajavision.png|20px|class=icon-discapacidad|alt=Baja visión]]
  <span class="discapacidad-texto">[[:Categoría:Discapacidad baja visión|Baja visión]]</span> –
  <span class="gravedad gravedad-grave">Barrera grave</span>
</li>
<li class="discapacidad-item">
  [[Archivo:Cognitiva.png|20px|class=icon-discapacidad|alt=Cognitiva]]
  <span class="discapacidad-texto">[[:Categoría:Discapacidad cognitiva|Cognitiva]]</span> –
  <span class="gravedad gravedad-moderada">Barrera moderada</span>
</li>
 
|wcag_lista_discapacidades=
[[Categoría:Discapacidad baja visión]]
[[Categoría:Discapacidad cognitiva]]
 
 
|wcag_texto_criterioOAW=
Debe permitirse un ajuste de las siguientes características del texto sin que se pierda contenido o funcionalidad:
* Ajustar el alto de la línea hasta al menos 1.5 veces el tamaño de la fuente
* Espaciar los párrafos hasta al menos el doble del tamaño de la fuente
* Ajustar el espacio entre letras hasta al menos 0.12 veces el tamaño de la fuente
* Ajustar el espaciado entre palabras hasta al menos 0.16 veces el tamaño de la 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><span lang="en">[https://www.w3.org/WAI/WCAG22/Techniques/css/C36 C36: Allowing for text spacing override]</span></li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/Techniques/css/C35 C35: Allowing for text spacing without wrapping]</span></li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/Techniques/css/C8 C8: Using CSS letter-spacing to control spacing within a word]</span></li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/Techniques/css/C21 C21: Specifying line spacing in CSS]</span></li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/Techniques/css/C28 C28: Specifying the size of text containers using em units]</span></li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG22/Techniques/failures/F104 F104: Failure of Success Criterion 1.4.12 due to clipped or overlapped content when text spacing is adjusted]</span></li>
</ul>
 
|wcag_recursos=
<strong> Consejos </strong>
<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=Semiautomatica
 
|wcag_pasos_evaluacion=
Uso de [https://www.html5accessibility.com/tests/tsbookmarklet.html Bookmarklet “Text spacing”]
<ol class="paso-list">
<li><span class="paso-badge">Paso 1.</span>
En la barra de marcadores del navegador, pulsar sobre el marcador <strong>“Text spacing”</strong>. 
El aspecto gráfico de la web deberá cambiar para aplicar ajustes de espaciado del texto que cumplen los criterios correspondientes.
</li>
 
<li><span class="paso-badge">Paso 2.</span>
Comprobar que con la nueva visualización no existen:
<ul>
<li>a. Textos cortados.</li>
<li>b. Superposiciones de textos.</li>
</ul>
</li>
</ol>
 
 
|wcag_resultado_evaluacion=
El contenido mantiene legibilidad y funcionalidad al aplicar los valores mínimos de espaciado definidos.
 
|wcag_ejemplo_evaluacion=
<div class="accessibility-card">
El texto puede espaciarse sin romper el diseño.
<pre class="wcag-codigo-html">
body {
  line-height: 1.5;
  letter-spacing: 0.12em;
  word-spacing: 0.16em;
}
</pre>
</div>
 
 
|wcag_otras_herramientas_evaluacion=
<ul>
<li>'''Prueba de espaciado''': aplicar los valores de referencia (line-height 1.5, espacio entre párrafos 2×, letter-spacing 0.12em, word-spacing 0.16em) mediante herramientas del navegador y comprobar que todo sigue siendo legible y usable.</li>
<li>'''Inspección del navegador''': revisar CSS para evitar reglas que impidan el ajuste de espaciado (p. ej. <code>!important</code>, alturas fijas o contenedores que recorten texto).</li>
<li>'''Revisión visual''': verificar que al aumentar el espaciado no se produce solapamiento, recorte de texto, pérdida de elementos o necesidad de scroll horizontal excesivo.</li>
<li>'''Prueba asistiva''': (NVDA, JAWS, VoiceOver) confirmar que el contenido sigue siendo accesible al modificar el espaciado y que el foco no se pierde.</li>
</ul>
 
}}

Revisión actual - 12:38 6 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)

  • Debe permitirse un ajuste de las siguientes características del texto sin que se pierda contenido o funcionalidad:
    • Ajustar el alto de la línea hasta al menos 1.5 veces el tamaño de la fuente
    • Espaciar los párrafos hasta al menos el doble del tamaño de la fuente
    • Ajustar el espacio entre letras hasta al menos 0.12 veces el tamaño de la fuente
    • Ajustar el espaciado entre palabras hasta al menos 0.16 veces el tamaño de la 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

Recursos de apoyo

Consejos
  • 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 Semiautomatica

Procedimiento de evaluación

Uso de Bookmarklet “Text spacing”
  1. Paso 1. En la barra de marcadores del navegador, pulsar sobre el marcador “Text spacing”. El aspecto gráfico de la web deberá cambiar para aplicar ajustes de espaciado del texto que cumplen los criterios correspondientes.
  2. Paso 2. Comprobar que con la nueva visualización no existen:
    • a. Textos cortados.
    • b. Superposiciones de textos.

Resultado esperado

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

Ejemplo

El texto puede espaciarse sin romper el diseño. 

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

Otras herramientas de evaluación

  • Prueba de espaciado: aplicar los valores de referencia (line-height 1.5, espacio entre párrafos 2×, letter-spacing 0.12em, word-spacing 0.16em) mediante herramientas del navegador y comprobar que todo sigue siendo legible y usable.
  • Inspección del navegador: revisar CSS para evitar reglas que impidan el ajuste de espaciado (p. ej. !important, alturas fijas o contenedores que recorten texto).
  • Revisión visual: verificar que al aumentar el espaciado no se produce solapamiento, recorte de texto, pérdida de elementos o necesidad de scroll horizontal excesivo.
  • Prueba asistiva: (NVDA, JAWS, VoiceOver) confirmar que el contenido sigue siendo accesible al modificar el espaciado y que el foco no se pierde.










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=3713»