De plus en plus de sites implémentent des liens particuliers connus sous le nom de "liens d'évitement" ou "liens de navigation interne" comme "Aller au menu", "Aller au contenu", "Retour en haut de page"...
Bien qu'ils ne soient qu'une exigence de niveau AAA pour WAI/WCAG ou Argent pour Accessiweb (*), ces liens sont pourtant indispensables, notamment pour les utilisateurs de la navigation clavier.
Comme tout dispositif nécessitant une adaptation spécifique de la page, ils doivent être utilisés à bon escient et réclament de respecter quelques règles d'implémentation.
Petit tour d'horizon de ces liens, regroupés sous la dénomination générale de "liens d'aide à la navigation dans la page".
(*) NDLR : ce tutoriel a été publié fin 2006 et fait référence à la recommandation WCAG 1.0 en vigueur à l'époque ainsi qu'au référentiel Accessiweb 1. En ce début d'année 2012, la recommandation officielle du W3C en matière d'accessibilité des contenus web est WCAG 2.0, et le référentiel Accessiweb en est à la version 2.1, très bientôt 2.2. Pour ce qui est des WCAG 2.0, le critère de succès 2.4.1 se rapproche de l'objet de ce tutoriel et est à présent une exigence de niveau A. Le critère 12.11 du référentiel Accessiweb 2.1 est sans surprise de niveau Bronze.
A l'origine, le lien d'évitement (skip link en anglais) est décrit comme un mécanisme permettant de passer un regroupement de liens.
C'est le sujet de l'item WCAG 1.0 13.6 : "Regrouper les liens de même nature, identifier le groupe (pour les agents-utilisateurs), et jusqu'à ce que les agents utilisateurs le permettent, donner un moyen de s'affranchir du groupe." (NDLR : depuis la publication de cet article, WCAG 2.0 est devenu la recommandation officielle du W3C en matière d'accessibilité des contenus web. Le critère de succès 2.4.1 se rapproche de l'objet de cet article).
On peut voir ce type d'implémentation en action sur les pages du W3C, notamment pour passer le très long menu de gauche :
<h2 class="navhead"><a name="technologies" id="technologies">W3C A to Z</a></h2>
<ul>
<li class="invisible">
<a class="navlink" title="Skip W3C A-Z" href="#news">Skip to News</a>
</li>
</ul>
Ces liens sont connus notamment pour permettre l'accès direct à différentes portions du document, pour les navigateurs vocaux, afin d'éviter (c'est le cas de le dire) de "lire" linéairement tout un contenu qui ne serait pas pertinent, selon ce que l'on cherche, en début de document.
