Les liens d’évitement sont des liens particulièrement importants dans le domaine de l’accessibilité web. Ils permettent aux utilisateurs de naviguer facilement sur les sites Web, en contournant les contenus répétitifs ou inutiles.

Pour comprendre l’importance des liens d’évitement, il est essentiel de saisir les bases de l’accessibilité web.

L’accessibilité web vise à rendre les sites Web, les applications et les documents en ligne accessibles à tous les individus, y compris aux personnes souffrant de limitations visuelles, auditives, motrices ou cognitives.

Les normes et les directives, telles que les WCAG (Web Content Accessibility Guidelines), et en France, le RGAA fournissent des principes clés pour améliorer l’accessibilité et garantir une navigation fluide à tous les utilisateurs.

Comprendre les liens d’évitement

Les liens d’évitement sont des éléments de navigation, des raccourcis qui permettent aux utilisateurs de sauter directement vers des parties spécifiques du contenu d’une page Web, en évitant ainsi les éléments répétitifs tels que les menus de navigation :

  • La navigation
  • La zone principale des articles
  • Le pied de page
  • La recherche

Les liens d’évitement, aussi connus sous le nom de « liens d’accès rapide », jouent un rôle crucial dans l’accessibilité web en permettant aux utilisateurs d’éviter certaines parties de pages.

Ils facilitent ainsi la navigation en donnant la possibilité d’accéder plus aisément au contenu souhaité et de se focaliser sur les éléments importants. Que l’on navigue au clavier, que l’on ait du mal à se repérer dans une page longue ou que le défilement soit difficile, ces liens d’évitement offrent une solution pour rendre l’expérience utilisateur plus fluide et accessible.

Il existe plusieurs types de liens d’évitement :

Liens d’évitement vers le contenu principal

Ces liens permettent aux utilisateurs de sauter directement au contenu principal de la page, en évitant les éléments de navigation répétitifs. 

Liens d’évitement vers les fonctionnalités

Ces liens sont utilisés pour permettre aux utilisateurs de sauter rapidement vers des fonctionnalités du site telles que :

  • la barre de recherche,
  • les formulaires
  • ou les zones de contenu interactives. 

A qui sont-ils destinés?

Les liens d’évitement sont particulièrement utiles pour les internautes :

  • Utilisateurs d’un lecteur d’écran ou qui naviguent uniquement au clavier.
  • Utilisateurs avec des difficultés pour parcourir de longues pages, ou souffrant de problèmes moteurs (fatigabilité ou limitations motrices) ou encore navigant sur leur smartphone
  • Les personnes malvoyantes, qu’ils utilisent ou non une loupe d’écran, et qui ont du mal à saisir rapidement la structure globale de la page.

Les liens d’évitement permettent donc de réduire la dépendance aux touches de navigation clavier et d’économiser des gestes lors de la navigation à l’intérieur de la page.

Bonnes pratiques pour concevoir des liens d’évitement

Ou placer les liens d’évitement ?

Pour garantir une expérience utilisateur optimale, il est essentiel de concevoir des liens d’évitement bien pensés.

Les liens d’évitement doivent être placés en début de page, juste avant le contenu principal pour qu’ils soient rapidement accessibles. L’idée est de permettre aux utilisateurs de les trouver facilement dès qu’ils accèdent à la page, en utilisant un lecteur d’écran ou une navigation au clavier.

Veillez à ce qu’ils soient bien visibles et distincts, en utilisant des couleurs contrastées et un libellé clair.

Une autre bonne pratique consiste à fournir des descriptions concises pour les liens d’évitement, qui décrivent leur destination.

Les liens d’évitement doivent être clairement identifiés dans le code HTML en utilisant des attributs tels que "tabindex" et "aria-label".

Code HTML pour créer des liens d’évitement :

<!DOCTYPE html>
<html>
<head>
<title>Mon site web accessible</title>
</head>
<body>
<!– Lien d’évitement vers le contenu principal –>
<a href= »#main-content » class= »skip-link »>Aller au contenu principal</a>
<!– Barre de navigation –>
<nav>
           <ul>

<li><a href= »# »>Accueil</a></li>
 <li><a href= »# »>À propos</a></li>
<li><a href= »# »>Services</a></li>
<li><a href= »# »>Contact</a></li>

        </ul>

</nav>

    <!– Contenu principal de la page –>

    ……

Dans l’exemple ci-dessus, le lien d’évitement est placé juste avant la barre de navigation.

Le lien utilise un attribut href avec la valeur « #main-content », ce qui permettra aux utilisateurs de sauter directement au contenu principal de la page lorsqu’ils cliquent dessus.

L’utilisation de la class "skip-link" est une pratique courante pour styliser visuellement le lien d’évitement et le rendre distinctif, mais elle n’est pas obligatoire.

Vous pouvez personnaliser le style CSS de la class "skip-link" selon vos préférences de conception.

En plaçant le lien d’évitement en début de page, vous assurez que les utilisateurs peuvent facilement accéder au contenu principal sans avoir à parcourir tous les éléments de navigation en haut de la page, améliorant ainsi leur expérience de navigation.

Conclusion 

En conclusion, les liens d’évitement jouent un rôle important pour rendre un site plus accessible, et pour offrir une meilleure expérience utilisateur.

Ils permettent aux utilisateurs en situation de handicap, tels que ceux utilisant des lecteurs d’écran ou des claviers uniquement, de naviguer efficacement sur les sites Web en sautant les éléments répétitifs tels que les menus de navigation.

En mettant en pratique les bonnes pratiques de conception, telle que la placement stratégique en début de page et l’utilisation d’un libellé clair et descriptif, les créateurs de sites Web peuvent contribuer à rendre leur contenu plus accessible à tous les visiteurs, sans exclusion.

Il est essentiel de garder à l’esprit que les liens d’évitement ne sont qu’un aspect de l’accessibilité numérique. En poursuivant d’autres pratiques telles que la fourniture d’alternatives aux médias, la création d’une navigation intuitive et la réalisation de tests d’accessibilité réguliers, nous pouvons créer un environnement en ligne plus inclusif pour chacun.

En travaillant ensemble pour intégrer l’accessibilité numérique dans la conception Web, nous pouvons faire progresser une expérience Internet équitable, où chaque individu, quel que soit son handicap, peut accéder aux informations et services en ligne de manière autonome et sans barrières. L’accessibilité numérique n’est pas seulement une responsabilité éthique, mais elle ouvre également de nouvelles opportunités pour toucher un public plus large et offrir une expérience utilisateur optimale pour tous.

Chaque projet est unique, souhaitez-vous un devis ?

Parlez-moi de votre projet
Retourner en haut de la page