Criterios de Perceptible
PerceptiblePauta 1.3 Adaptable
1.3.2Secuencia significativa
Nivel ALo exige la normativa (EN 301 549).
Qué pide
Si el orden de lectura importa, el orden del código coincide con el orden lógico.
A quién ayuda: Usuarios de lector de pantalla y quien usa estilos personalizados.
Un caso real
Una ficha de producto coloca el precio a la derecha con CSS.
BienEn el código el precio va justo después del nombre del producto.
MalEl lector de pantalla lee el precio al final, tras el pie de página.
Cómo aplicarlo en código
El orden del código es el orden de lectura
Los lectores de pantalla leen el HTML en orden. Si reordenas con CSS, lo que se oye no coincide con lo que se ve.
<ol class="pasos">
<li>Elige la talla</li>
<li>Añade al carrito</li>
<li>Paga</li>
</ol><div class="pasos" style="display: flex">
<p style="order: 2">Paso 2: añade al carrito</p>
<p style="order: 1">Paso 1: elige la talla</p>
<p style="order: 3">Paso 3: paga</p>
</div>Cómo comprobarlo
Navega con lector de pantalla o desactiva el CSS y lee de arriba abajo.