ACCESSIBILITÉ ≠ OVERLAY · 37
Liens accessibles : savoir où l’on va avant de cliquer
📅 10 novembre 2026 · ⏱ 7 min de lecture
Un lien doit aider à choisir plutôt qu’obliger à deviner. Son texte, son contexte et son comportement déterminent si une personne peut s’orienter avec un lecteur d’écran, le clavier, la voix ou un agrandissement.
01. Quand tous les chemins s’appellent «ici»
Imaginez une page de services comportant huit liens intitulés «plus d’informations». En voyant toute la page, vous associez peut-être chacun à sa carte. Mais une personne qui écoute une liste de liens peut entendre huit noms identiques. Elle doit revenir au contenu, retrouver chaque bloc et reconstruire son rapport avec la destination. Une opération simple devient une recherche inutile.
Cela ne concerne pas uniquement les personnes aveugles. Avec un agrandissement, seule une partie de la carte peut être visible ; au clavier, chaque arrêt demande de décider s’il est pertinent. Un lien descriptif réduit l’effort avant son activation. La bonne question est ce que la personne peut anticiper à partir des informations réellement disponibles pour elle.
02. Décrivez le but plutôt qu’un ordre vide
«Consulter les horaires d’accueil» permet mieux d’anticiper la destination que «cliquez ici». «Télécharger le guide d’inscription» explique davantage que «télécharger». Inutile de transformer chaque lien en phrase interminable : choisissez les mots qui distinguent la ressource et évitez de répéter tout le paragraphe.
Le libellé doit correspondre au contenu visé. Si «Tarifs du service» ouvre une page commerciale sans tarifs, il ne permet pas d’accomplir la tâche. Revoyez les liens après le remplacement de documents ou la réorganisation du site. Un nom auparavant exact peut devenir trompeur même si l’URL fonctionne encore. La précision éditoriale relève de l’accessibilité et de la maintenance quotidienne. Les libellés doivent évoluer avec les ressources qu’ils décrivent.
03. Contexte valable et compréhension hors contexte
Les WCAG 2.2 distinguent comprendre la fonction d’un lien dans son contexte et l’exigence plus stricte de la comprendre à partir du seul nom. Le critère 2.4.4, de niveau A, permet d’associer le texte du lien à un contexte déterminable par les logiciels. Un paragraphe, un élément de liste ou une cellule liés peuvent fournir des informations pertinentes.
«Lire la suite» n’est donc pas automatiquement non conforme dans toutes les situations. Examinez l’association réelle, et pas seulement la proximité visuelle. Même si le contexte satisfait le critère, un nom précis facilite souvent les listes de liens et l’exploration rapide. Distinguez l’évaluation de conformité du choix d’une expérience plus claire. Une recommandation utile ne doit pas devenir une règle inventée.
04. Le nom visible et le nom annoncé doivent correspondre
Le nom accessible d’un lien peut venir du texte, d’une image ou d’un mécanisme comme aria-label. Si le libellé visible indique «Contacter» mais que le nom accessible est entièrement différent, une personne utilisant la commande vocale peut difficilement l’activer en prononçant ce qu’elle voit. Le critère 2.5.3 demande que le nom contienne le texte du libellé visible lorsque cela s’applique.
Améliorer le texte visible pour tout le monde est généralement la première option. Évitez d’ajouter partout de longues descriptions masquées sans examiner le nom obtenu. L’attribut title ne doit pas être le seul endroit expliquant la destination : son accès varie selon les appareils. Inspectez le nom calculé et écoutez son annonce dans l’interface réelle.
05. Une image cliquable a aussi une fonction
Si une image constitue le seul contenu d’un lien, son alternative textuelle doit transmettre la fonction de ce lien. Pour un logo menant à l’accueil, il importe d’identifier la navigation plutôt que de décrire toutes les courbes du dessin. Une loupe servant de lien ne devrait pas porter un nom de fichier comme «icone-finale-2.svg».
Lorsque image et texte appartiennent au même lien et que le texte en explique déjà le but, une image décorative peut recevoir une alternative vide afin d’éviter les répétitions. Examinez aussi les cartes contenant image, titre et bouton vers la même ressource. Plusieurs liens successifs peuvent multiplier les arrêts inutiles. Cherchez une solution cohérente sans imbriquer les liens ni supprimer la sémantique ou l’interaction native d’un conteneur entier.
06. Liens et boutons remplissent des rôles différents
Un lien mène à une ressource ou à un emplacement. Un bouton déclenche une action, comme ouvrir un panneau ou envoyer un formulaire. Leur apparence peut être semblable, mais leurs comportements et les attentes diffèrent. Utilisez les éléments natifs adaptés à la fonction ; un lien sans véritable destination n’est pas une solution universelle.
Ne remplacez pas cette base par un div doté d’un événement de clic et d’un rôle improvisé. Il faudrait également gérer le focus, l’activation au clavier et d’autres comportements déjà fournis par l’élément natif. Vérifiez que les liens fonctionnent avec Entrée et que les boutons répondent à l’interaction attendue. La technique doit accompagner la tâche, sans imposer de nouvelles surprises à chaque composant.
07. Des téléchargements et changements de contexte prévisibles
Si un lien conduit à un document, identifiez clairement son sujet. Indiquer le format et, si utile, le poids aide à décider de l’ouvrir sur un téléphone ou une connexion limitée. «Guide d’inscription, PDF» informe davantage qu’une adresse interminable ou une icône sans explication.
Évitez d’ouvrir de nouveaux onglets par habitude. Lorsqu’une raison le justifie, annoncer ce comportement aide à conserver ses repères. Cette bonne pratique ne signifie pas que chaque nouvel onglet enfreint automatiquement les WCAG. Un nom clair ne rend pas non plus le fichier accessible. Un PDF sans structure continue à présenter des obstacles malgré un excellent libellé. Examinez tout le parcours, du choix de la ressource jusqu’à sa consultation.
08. Visibilité, focus et espace d’activation
Dans un paragraphe, les liens doivent être identifiables sans dépendre uniquement de la couleur ; le soulignement offre souvent une solution claire et stable. Vérifiez le contraste et évitez que les états visité ou focalisé rendent le texte illisible. L’interaction doit être reconnaissable avant un survol à la souris.
Parcourez les liens avec Tab et Maj+Tab. L’indicateur de focus doit être visible et le composant qui reçoit le focus ne doit pas être entièrement masqué par du contenu créé par le site ; les WCAG 2.2 abordent ce dernier cas en 2.4.11. Examinez aussi l’espacement et les exigences applicables à la taille des cibles, avec leurs exceptions. Agrandir une zone cliquable ne doit pas provoquer de chevauchements activant accidentellement une autre destination.
09. Testez le choix avant de tester le clic
Choisissez une tâche réelle : trouver les horaires ou joindre l’assistance. Lisez les noms des liens sans les activer et notez la destination attendue. Suivez ensuite le parcours et comparez cette attente au résultat. Répétez avec lecteur d’écran, liste de liens, clavier et agrandissement selon les besoins.
Les outils automatiques peuvent détecter certains noms absents ou défauts de contraste, mais ne décident pas si «plus d’informations» promet la bonne ressource ou si une traduction conserve le sens. Documentez les ambiguïtés avec l’emplacement, le nom annoncé et la destination attendue. N’évaluez pas tout le site à partir d’un seul lien : menus, cartes, pied de page et contenu éditorial proviennent souvent de composants et de décisions différents.
10. Corrigez la source et préservez la clarté
Dans WordPress et Divi, examinez le texte de l’éditeur, le HTML et le nom accessible obtenu. Corrigez le module partagé lorsque de nombreuses cartes reproduisent un défaut. Traduisez les noms et vérifiez la langue des destinations : un libellé localisé aide peu si la ressource change soudainement de langue.
Un overlay ne connaît pas spontanément l’intention éditoriale de chaque lien et ne peut garantir qu’un nom générique décrit la bonne ressource. Les réglages visuels peuvent compléter le travail sans remplacer cette décision. Ajoutez une question simple à la relecture : la personne peut-elle choisir en connaissance de cause avant d’activer ? L’accessibilité progresse lorsqu’elle sait où elle va, atteint le contenu prévu et peut continuer de manière autonome.