Criterios de Operable
OperablePauta 2.4 Navegable
2.4.1Evitar bloques
Nivel ALo exige la normativa (EN 301 549).
Qué pide
Hay una forma de saltar los bloques repetidos, como el menú, para ir directo al contenido.
A quién ayuda: Usuarios de teclado y de lector de pantalla.
Un caso real
Una web con un menú de 40 enlaces en cada página.
BienEl primer Tab muestra «Saltar al contenido», como en esta página.
MalHay que pulsar Tab 40 veces en cada página para llegar al contenido.
Cómo aplicarlo en código
Enlace para saltar al contenido y regiones
El enlace es lo primero que se enfoca con Tab. Puede estar oculto hasta recibir el foco, pero nunca con display: none.
<body>
<a class="saltar" href="#contenido">Saltar al contenido</a>
<header>…</header>
<nav aria-label="Principal">…</nav>
<main id="contenido">…</main>
</body>
<style>
.saltar { position: absolute; top: -10rem; left: 1rem; }
.saltar:focus { top: 1rem; }
</style><style>
.saltar { display: none; } /* tampoco se puede alcanzar con el teclado */
</style>Cómo comprobarlo
Pulsa Tab nada más cargar la página.