Diferencia entre revisiones de «Principio 1/1.3 Adaptable/1.3.2-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.3.2-A. Orden lógico de lectura''' ==
{{CriterioWCAG
<!-- 
|id_wcag_criterio=1.3.2
  Análisis interno:
|id_wcag_subcriterio=1.3.2-A
  Este criterio impacta principalmente a: Personas con discapacidad visual total 
|wcag_titulo_criterio=1.3.2-A. Orden lógico de lectura
  Problema grave: Si el orden de lectura en el código no coincide con la presentación visual, los lectores de pantalla transmiten información desordenada, afectando comprensión. 
|wcag_nivel=A
-->
|wcag_version=2.2
<html>
|wcag_principio=1_Perceptible
<!-- criterio 1.3.2-A -->
|wcag_principio_url=Principio_1
<article class="wcag-card">
|wcag_pauta=1.3_Adaptable
  <section class="wcag-info">
|wcag_pauta_url=Principio_1/1.3_Adaptable
    <ul>
|wcag_grupo=Estructura
      <li><span class="label">Nivel:</span><span class="value">A</span></li>
|wcag_subgrupo=Orden de lectura
      <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>
      <li><span class="label">Pauta:</span><span class="value">1.3 Crear contenido adaptable</span></li>
      <li><span class="label">Categoría:</span><span class="value">Estructura</span></li>
      <li><span class="label">Subcategoría:</span><span class="value">Orden de lectura</span></li>
    </ul>
  </section>


  <section class="wcag-users">
|wcag_discapacidades=
    <p>Usuarios más afectados</p>
<li class="discapacidad-item">
    <ul>
  [[Archivo:Sinvision.png|20px|class=icon-discapacidad|alt=Discapacidad visual total]]
      <li><img src="/images/4/4d/Sinvision.png" alt="Icono de una persona con discapacidad visual" /> Personas con discapacidad visual total - <span class="gravedad">Barrera grave</span></li>
  <span class="discapacidad-texto">[[:Categoría:Discapacidad visual total|Visual total]]</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 moderada</span></li>
  <span class="gravedad gravedad-grave">Barrera grave</span>
    </ul>
</li>
  </section>
<li class="discapacidad-item">
</article>
  [[Archivo:Bajavision.png|20px|class=icon-discapacidad|alt=Baja visión]]
</html>
  <span class="discapacidad-texto">[[:Categoría:Discapacidad baja visión|Baja visión]]</span> –
  <span class="gravedad gravedad-moderada">Barrera moderada</span>
</li>
 
|wcag_lista_discapacidades=
[[Categoría:Discapacidad visual total]]
[[Categoría:Discapacidad baja visión]]
 
|wcag_texto_criterioOAW=
Cuando la secuencia en que se presenta el contenido afecta a su significado, se puede determinar por software la secuencia correcta de lectura.
 
|wcag_descripcion_resumida=
El contenido debe aparecer en el código en un orden lógico y coherente, de modo que al ser linealizado o leído por tecnologías de apoyo, la secuencia mantenga el significado y la comprensión.
 
|wcag_objetivo=
Garantizar que la estructura narrativa y funcional del contenido se mantenga independientemente de la presentación visual, permitiendo una lectura natural y comprensible.
 
|wcag_importancia=
Los lectores de pantalla leen el contenido en el orden que aparece en el DOM. Si el orden visual y el orden en el código no coinciden, la comprensión se ve afectada y la experiencia se vuelve confusa o incoherente.
 
|wcag_referencias=
<ul>
<li>G57 – Ordenar el contenido en una secuencia significativa</li>
<li>C27 – Hacer coincidir el orden del DOM con el orden visual</li>
<li>G59 – Situar los elementos interactivos siguiendo la secuencia lógica</li>
</ul>
 
|wcag_recursos=
<ul>
<li>Hacer que el orden del DOM coincida con el orden visual</li>
<li>Evitar reordenamientos CSS que alteren el flujo lógico</li>
<li>Usar marcado estructural coherente para narrativas y formularios</li>
</ul>
 
|wcag_tipo_evaluacion=Semiautomática
 
|wcag_pasos_evaluacion=
<ol class="paso-list">
<li>Usar “Linearize Page” en Web Developer Toolbar</li>
<li>Leer el contenido de forma lineal</li>
<li>Verificar que el significado se preserva en el orden presentado</li>
</ol>
 
|wcag_resultado_evaluacion=
El contenido se presenta en un orden lógico dentro del DOM, permitiendo una comprensión secuencial adecuada.
 
|wcag_ejemplo_evaluacion=
Ejemplo correcto:
<pre class="wcag-codigo-html">
<label for="nombre">Nombre</label>
<input id="nombre" type="text">
</pre>
 
Ejemplo incorrecto:
<pre class="wcag-codigo-html">
<input id="nombre" type="text">
<label for="nombre">Nombre</label>
</pre>
 
|wcag_otras_herramientas_evaluacion=
<ul>
<li>Web Developer Toolbar – Linearize Page</li>
<li>Lectores de pantalla</li>
</ul>
 
}}

Revisión del 18:40 4 nov 2025

1.3.2-A. Orden lógico de lectura

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)

  • Cuando la secuencia en que se presenta el contenido afecta a su significado, se puede determinar por software la secuencia correcta de lectura.

Comprensión del criterio

Descripción resumida

El contenido debe aparecer en el código en un orden lógico y coherente, de modo que al ser linealizado o leído por tecnologías de apoyo, la secuencia mantenga el significado y la comprensión.

Objetivo

Garantizar que la estructura narrativa y funcional del contenido se mantenga independientemente de la presentación visual, permitiendo una lectura natural y comprensible.

Importancia de cumplir el criterio

Los lectores de pantalla leen el contenido en el orden que aparece en el DOM. Si el orden visual y el orden en el código no coinciden, la comprensión se ve afectada y la experiencia se vuelve confusa o incoherente.

Referencias WCAG

  • G57 – Ordenar el contenido en una secuencia significativa
  • C27 – Hacer coincidir el orden del DOM con el orden visual
  • G59 – Situar los elementos interactivos siguiendo la secuencia lógica

Recursos de apoyo

  • Hacer que el orden del DOM coincida con el orden visual
  • Evitar reordenamientos CSS que alteren el flujo lógico
  • Usar marcado estructural coherente para narrativas y formularios

Evaluación del criterio

Tipo de evaluación

Evaluación Semiautomática

Procedimiento de evaluación

  1. Usar “Linearize Page” en Web Developer Toolbar
  2. Leer el contenido de forma lineal
  3. Verificar que el significado se preserva en el orden presentado

Resultado esperado

El contenido se presenta en un orden lógico dentro del DOM, permitiendo una comprensión secuencial adecuada.

Ejemplo

Ejemplo correcto: 
<label for="nombre">Nombre</label>
<input id="nombre" type="text">

Ejemplo incorrecto: 

<input id="nombre" type="text">
<label for="nombre">Nombre</label>

Otras herramientas de evaluación

  • Web Developer Toolbar – Linearize Page
  • Lectores de pantalla










Ejemplos accesibles y no accesibles creados por alumnos

Comentarios

A continuación se muestran comentarios sobre el criterio 1.3.2-A. Orden lógico de lectura

Loading comments...




Obtenido de «https://wikiwcag.udl.cat/index.php?title=Principio_1/1.3_Adaptable/1.3.2-A&oldid=3332»