Scan gratuit

Corriger « Aucun moyen d'éviter les blocs répétés » en HTML

Pourquoi c'est un problème

Sans raccourci, une personne au clavier doit traverser le logo, le menu et tous les liens d'en-tête sur chaque page avant d'atteindre le contenu. axe-core accepte comme moyen d'évitement un lien interne, un titre ou une zone <main> ; le RGAA, lui, attend un lien d'évitement vers le contenu principal.

Comment corriger — HTML

Ajoutez un lien « Aller au contenu » en tout premier élément focusable de la page, pointant vers le <main>. Il peut n'apparaître qu'au focus. Structurez aussi la page avec <header>, <nav>, <main> et des titres : les lecteurs d'écran s'en servent pour sauter d'une zone à l'autre.

À éviter
<body>
  <div class="top">…menu…</div>
  <div class="content">…</div>
</body>
Correct
<body>
  <a class="skip" href="#contenu">Aller au contenu</a>
  <header>
    <nav aria-label="Navigation principale">…</nav>
  </header>
  <main id="contenu">…</main>
</body>

<style>
  .skip { position: absolute; left: -9999px; }
  .skip:focus { left: 1rem; top: 1rem; }
</style>

Vérifiez votre site en 30 secondes

Conformly détecte ce type de problème sur toutes vos pages, en continu, et vous alerte à chaque régression.

Scan gratuit

Autres corrections