Série RGAA en pratique · Épisode 9 · 6 min

Arrête d’écrire « Cliquez ici »

Pourquoi « cliquez ici », « en savoir plus » et « lire la suite » posent problème, et comment écrire des liens qui se comprennent hors de leur contexte.

Publié le 30 septembre 2026.Consulter la transcription de la vidéo Voir sur YouTube (nouvelle fenêtre)

Chapitres

Transcription

Texte intégral de la narration de l’épisode.

Situations du quotidien

Regarde une page de blog classique. Chaque article se termine par un lien : cliquez ici, en savoir plus, lire la suite. À l’œil, tout va bien, tu vois le titre juste au-dessus. Mais un lecteur d’écran propose une fonction qui liste tous les liens de la page, les uns après les autres, sortis de leur contexte. Et là, la liste devient : cliquez ici, cliquez ici, en savoir plus, lire la suite. Dix liens, dix intitulés interchangeables, impossible de savoir où chacun mène. Le RGAA a deux critères pour régler ça, et une règle simple : un lien doit se comprendre tout seul.

Un lien se comprend hors de son contexte

On va voir quatre réflexes. Premier, l’intitulé d’un lien doit dire où il mène, sans dépendre du texte autour : c’est le critère 6.1. Deuxième, chaque lien doit avoir un intitulé tout court, car un lien vide ou fait d’une icône sans nom n’existe pas pour le lecteur d’écran : critère 6.2. Troisième, tu choisis la bonne balise, un lien pour naviguer et un bouton pour déclencher une action, jamais une div bricolée : on est là dans la thématique Scripts, critère 7.1. Et quatrième, un lien noyé dans un paragraphe ne doit pas se repérer uniquement à sa couleur : critère 10.6. On les prend un par un.

De « en savoir plus » à un vrai intitulé

Voici le réflexe de base. À gauche, le lien affiche en savoir plus. Le titre Offre Pro est juste au-dessus, donc visuellement on comprend. Le problème, c’est quand le lien est extrait de ce contexte, dans la liste des liens ou lu isolément. À droite, l’intitulé devient en savoir plus sur l’offre Pro. Maintenant il se comprend tout seul. Le critère 6.1 accepte les deux façons de faire : soit l’intitulé se suffit à lui-même, soit il devient clair grâce à son contexte immédiat, par exemple le titre ou le paragraphe qui le porte. Mais le plus robuste, et de loin, c’est un intitulé explicite dès le départ. Tu n’as même pas besoin d’allonger : cible juste ce vers quoi tu envoies.

La liste des liens, sans le contexte

Concrètement, voilà ce que donne cette fonction de navigation. Le lecteur d’écran ouvre la liste des liens de la page, sortis de leur contexte. À gauche, une liste d’intitulés vagues : cliquez ici, en savoir plus, lire la suite, répétés à l’identique, impossible de les distinguer. À droite, la même liste avec des intitulés explicites : télécharger le rapport annuel 2026, contacter l’équipe support, créer un compte. Ceux-là, on sait exactement où ils mènent, même sortis de la page. Pour situer l’enjeu humain, on compte en France environ 61 000 personnes aveugles, d’après la DREES, et beaucoup s’appuient sur ce genre de liste pour naviguer. C’est tout le sens des critères 6.1 et 6.2 : chaque lien a un intitulé, et cet intitulé se comprend hors de son contexte visuel.

Une icône seule n’est pas un intitulé

Cas très fréquent : un lien ou un bouton qui n’affiche qu’une icône, une loupe, une enveloppe, une flèche. À gauche, rien pour le lecteur d’écran, il annonce juste lien, ou bouton, sans dire quoi. À droite, on ajoute un nom accessible : rechercher, contacter, page suivante. Pour un bouton, c’est un aria-label ou un texte masqué visuellement. Pour un lien image, cet intitulé, c’est l’alternative de l’image, et elle doit décrire la destination du lien, pas l’image en elle-même. Le critère 6.2 exige qu’aucun lien ne soit vide, et le 6.1 que cet intitulé soit explicite. Une icône, même parlante à l’œil, reste muette sans nom.

Lien pour naviguer, bouton pour agir

Autre confusion classique : la balise. Un lien, c’est la balise a, et ça sert à aller quelque part, changer de page ou d’ancre. Un bouton, c’est la balise button, et ça sert à déclencher une action : ouvrir un menu, envoyer un formulaire, ajouter au panier. Ce qu’il ne faut jamais faire, c’est une div ou un span rendus cliquables au JavaScript. À gauche, ce faux bouton en div : à la souris ça marche, mais le focus clavier ne l’atteint pas, le lecteur d’écran ne l’annonce pas comme un bouton, et Entrée ne fait rien. À droite, un vrai bouton natif : focus, clavier, rôle annoncé, tout est fourni. C’est le sens du critère 7.1, dans la thématique Scripts : un composant piloté par script doit rester compatible avec les technologies d’assistance.

Dans un texte, un lien ne tient pas qu’à la couleur

Dernier point, souvent oublié : un lien placé au milieu d’un paragraphe. Si le seul indice qui le distingue du texte autour, c’est sa couleur, alors une personne daltonienne ou malvoyante peut ne pas le voir du tout. Le critère 10.6 pose une condition claire pour ce cas : si le lien n’est signalé que par la couleur, cette couleur doit avoir un contraste d’au moins 3 pour 1 avec le texte environnant, et le lien doit aussi montrer un repère au survol et à la prise de focus, autre qu’un simple changement de couleur. Le plus simple pour cocher tout ça d’un coup, c’est de garder le soulignement des liens dans le corps de texte. Ce n’est pas ringard, c’est le repère le plus universel.

Checklist

Récapitulons en cinq réflexes. Un, écris des intitulés qui disent la destination, compréhensibles même seuls : c’est le critère 6.1. Deux, ne laisse jamais un lien vide, et donne un nom accessible aux liens et boutons en icône : critère 6.2. Trois, choisis la bonne balise, a pour naviguer, button pour agir, c’est le critère 7.1. Quatre, bannis les div et les span rendus cliquables au JavaScript, ils cassent le clavier et le lecteur d’écran. Et cinq, dans un paragraphe, un lien ne doit pas se repérer qu’à sa couleur : garde le soulignement, critère 10.6. Cinq réflexes, et tes liens redeviennent lisibles pour tout le monde.

CTA

À toi de jouer. Prends une page pleine de liens, un blog, une page d’accueil, et lis chaque intitulé à voix haute, sans regarder le reste. Si tu ne sais pas où il mène, il y a du travail. Pour analyser une page entière, repérer les liens à revoir et prioriser tes corrections, rends-toi sur rgaa-checker.com.

Approfondir dans le guide

Cet épisode aborde ces critères du RGAA 4.1.2. Ouvre leur fiche pour la méthode de test détaillée, les cas particuliers et les exemples.

D’autres épisodes qui abordent des critères proches, dans d’autres séries.

Navigation au clavier
Épisode 3Bases RGAA4 minEn ligne

Passer à l’action

La vidéo pose le cadre. Pour repérer des pistes d’amélioration sur un site réel, lance une analyse ou explore le guide des 106 critères.

Analyser un site Guide RGAA