Diferencia entre revisiones de «Principio 1/1.3 Adaptable/1.3.2-C»

De WCAG Wiki
Sin resumen de edición
Sin resumen de edición
Línea 4: Línea 4:
|wcag_titulo_criterio=1.3.2-C. Dirección del texto
|wcag_titulo_criterio=1.3.2-C. Dirección del texto
|wcag_nivel=A
|wcag_nivel=A
|wcag_version=2.2
|wcag_version=2.0
|wcag_principio=1_Perceptible
|wcag_principio=1_Perceptible
|wcag_principio_url=Principio_1
|wcag_principio_url=Principio_1
Línea 17: Línea 17:
   <span class="discapacidad-texto">[[:Categoría:Discapacidad visual total|Visual total]]</span> –
   <span class="discapacidad-texto">[[:Categoría:Discapacidad visual total|Visual total]]</span> –
   <span class="gravedad gravedad-grave">Barrera grave</span>
   <span class="gravedad gravedad-grave">Barrera grave</span>
</li>
<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-moderada">Barrera moderada</span>
</li>
</li>


|wcag_lista_discapacidades=
|wcag_lista_discapacidades=
[[Categoría:Discapacidad visual total]]
[[Categoría:Discapacidad visual total]]
[[Categoría:Discapacidad baja visión]]


|wcag_texto_criterioOAW=
|wcag_texto_criterioOAW=
Se deben identificar los cambios en la dirección de lectura del texto. :contentReference[oaicite:0]{index=0}
Se deben identificar los cambios en la dirección de lectura del texto.  


|wcag_descripcion_resumida=
|wcag_descripcion_resumida=
Línea 42: Línea 36:
|wcag_referencias=
|wcag_referencias=
<ul>
<ul>
<li>H34: Using Unicode RLM or LRM to mix text direction inline</li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG21/Techniques/general/G57 G57: Ordering the content in a meaningful sequence]</span></li>
<li>H56: Using the dir attribute on an inline element to resolve nested directional runs</li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG21/Techniques/html/H34 H34: Using a Unicode right-to-left mark (RLM) or left-to-right mark (LRM) to mix text direction inline]</span></li>
<li>G57: Ordering the content in a meaningful sequence</li>
<li><span lang="en">[https://www.w3.org/WAI/WCAG21/Techniques/html/H56 H56: Using the dir attribute on an inline element to resolve problems with nested directional runs]</span></li>
</ul> :contentReference[oaicite:1]{index=1}
</ul>


|wcag_recursos=
|wcag_recursos=
<strong> Consejos </strong>
<ul>
<ul>
<li>Usar marcadores Unicode (RLM, LRM) para mezclar direcciones de texto.</li>
<li>Usar marcadores Unicode ''RLM'' (Right-to-Left Mark) y ''LRM'' (Left-to-Right Mark) para mezclar direcciones de texto.</li>
<li>Usar el atributo <code>dir</code> para definir la dirección del texto en elementos cuando sea necesario.</li>
<li>Usar el atributo <code>dir</code> para definir la dirección del texto en elementos cuando sea necesario.</li>
<li>Validar mediante inspección del DOM y herramientas de accesibilidad que el orden de lectura es lógico.</li>
<li>Validar mediante inspección del DOM y herramientas de accesibilidad que el orden de lectura es lógico.</li>
</ul>
</ul>


|wcag_tipo_evaluacion=Comprobación manual
|wcag_tipo_evaluacion=Manual


|wcag_pasos_evaluacion=
|wcag_pasos_evaluacion=
<ol class="paso-list">
<ol class="paso-list">
<li><span class="paso-badge">Paso 1.</span> Localizar si existen textos en diferentes idiomas con distinta dirección de lectura.</li>
<li><span class="paso-badge">Paso 1.</span>  
<li><span class="paso-badge">Paso 2.</span> Usar la herramienta de inspección del navegador para comprobar que se han aplicado atributos como <code>dir="rtl"</code> o marcas Unicode adecuadas.</li>
Comprobar si existen en la misma página varios idiomas con diferente orden de lectura.
</ol> :contentReference[oaicite:2]{index=2}
</li>
<li><span class="paso-badge">Paso 2.</span>  
Usando la herramienta de inspección de código del navegador, verificar que se utilizan los atributos adecuados para identificarlos.
</li>
</ol>
 


|wcag_resultado_evaluacion=
|wcag_resultado_evaluacion=
Línea 66: Línea 66:


|wcag_ejemplo_evaluacion=
|wcag_ejemplo_evaluacion=
Ejemplo correcto:
<div class="accessibility-card">
<div class="accessibility-card">
Se muestra como se utilizan los valores de dirección del texto a la derecha (RTL).
<pre class="wcag-codigo-html">
<pre class="wcag-codigo-html">
<p>Texto en español y luego <span dir="rtl">مثال عربي</span> dentro de la frase.</p>
<p>Texto en español y luego <span dir="rtl">مثال عربي</span> dentro de la frase.</p>
</pre>
</div>
Ejemplo incorrecto:
<div class="accessibility-card-error">
<pre class="wcag-codigo-html">
<p>Texto en español ثم مثال عربي sin atributo dir.</p>
</pre>
</pre>
</div>
</div>
Línea 82: Línea 75:
|wcag_otras_herramientas_evaluacion=
|wcag_otras_herramientas_evaluacion=
<ul>
<ul>
<li>Inspector de código del navegador</li>
<li>'''Inspección del navegador''': comprobar el uso correcto de atributos de dirección como <code>dir="rtl"</code> o <code>dir="ltr"</code> y de <code>lang</code> cuando hay cambios de idioma o dirección en el contenido.</li>
<li>Lectores de pantalla (NVDA, JAWS, VoiceOver)</li>
<li>'''Lectores de pantalla''': (NVDA, JAWS, VoiceOver) verificar que el texto en idiomas RTL (p. ej. árabe, hebreo) se anuncia correctamente y en el orden adecuado.</li>
<li>'''Desactivación de estilos''': quitar CSS para comprobar que la dirección del texto sigue siendo correcta en modo lineal.</li>
<li>'''Validadores HTML y extensiones''': usar [https://validator.w3.org/nu/ W3C Validator] o herramientas del navegador para detectar ausencia o mal uso del atributo <code>dir</code>.</li>
</ul>
</ul>
}}
}}

Revisión del 09:22 5 nov 2025

1.3.2-C. Dirección 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)

  • Se deben identificar los cambios en la dirección de lectura del texto.

Comprensión del criterio

Descripción resumida

Cuando en una misma página existen idiomas o fragmentos con diferentes direcciones de lectura (por ejemplo, de derecha a izquierda y de izquierda a derecha), deben emplearse los atributos adecuados para que los agentes de usuario presenten el contenido en el orden correcto.

Objetivo

Garantizar que la secuencia de lectura puede determinarse por software incluso cuando aparecen idiomas o frases con distinta dirección de lectura, manteniendo la comprensión adecuada del contenido.

Importancia de cumplir el criterio

Si no se marca correctamente la dirección del texto, los lectores de pantalla leerán el contenido en un orden inadecuado, lo que puede generar confusión grave y pérdida de significado, especialmente en páginas multilingües.

Referencias WCAG

Recursos de apoyo

Consejos
  • Usar marcadores Unicode RLM (Right-to-Left Mark) y LRM (Left-to-Right Mark) para mezclar direcciones de texto.
  • Usar el atributo dir para definir la dirección del texto en elementos cuando sea necesario.
  • Validar mediante inspección del DOM y herramientas de accesibilidad que el orden de lectura es lógico.

Evaluación del criterio

Tipo de evaluación

Evaluación Manual

Procedimiento de evaluación

  1. Paso 1. Comprobar si existen en la misma página varios idiomas con diferente orden de lectura.
  2. Paso 2. Usando la herramienta de inspección de código del navegador, verificar que se utilizan los atributos adecuados para identificarlos.

Resultado esperado

El contenido mantiene un orden de lectura correcto y comprensible, incluso cuando se mezclan idiomas con diferente orientación.

Ejemplo

Se muestra como se utilizan los valores de dirección del texto a la derecha (RTL).

<p>Texto en español y luego <span dir="rtl">مثال عربي</span> dentro de la frase.</p>

Otras herramientas de evaluación

  • Inspección del navegador: comprobar el uso correcto de atributos de dirección como dir="rtl" o dir="ltr" y de lang cuando hay cambios de idioma o dirección en el contenido.
  • Lectores de pantalla: (NVDA, JAWS, VoiceOver) verificar que el texto en idiomas RTL (p. ej. árabe, hebreo) se anuncia correctamente y en el orden adecuado.
  • Desactivación de estilos: quitar CSS para comprobar que la dirección del texto sigue siendo correcta en modo lineal.
  • Validadores HTML y extensiones: usar W3C Validator o herramientas del navegador para detectar ausencia o mal uso del atributo dir.










Ejemplos accesibles y no accesibles creados por alumnos

Comentarios

A continuación se muestran comentarios sobre el criterio 1.3.2-C. Dirección del texto

Loading comments...