Lire les informations de contexte d’un lien avec un lecteur d’écran

Que dit la norme ?

Dans le critère de succès 2.4.4, la norme internationale WCAG indique que la fonction du lien est déterminée par le texte du lien seul ou par le texte du lien associé à un contexte du lien (« The purpose of each link can be determined from the link text alone or from the link text together with its programmatically determined link context »).

Dans le RGAA 4, c’est le critère 6.1 qui traite du sujet : « Chaque lien est-il explicite (hors cas particuliers) ? ».

Ce critère est de niveau A ^[1], ce qui signifie que s’il n’est pas respecté, certains utilisateurs et utilisatrices n’accéderont pas à ces informations (ou à une partie de ces informations).

Un lien est explicite si :

• le texte du lien, appelé « intitulé de lien », permet d’en comprendre la fonction et la destination ;
• ou l’intitulé du lien, additionné au contexte du lien, permet d’en comprendre la fonction et la destination.

L’intitulé du lien

L’intitulé d’un lien est constitué différemment selon les éléments qui le composent (texte et/ou image) :

• l’intitulé d’un lien textuel est constitué à partir du texte présent dans le lien ;
• l’intitulé d’un lien image est constitué à partir de l’alternative textuelle de l’image présente dans le lien (par exemple le contenu de l’attribut alt) ;
• l’intitulé d’un lien composite ^[2] est constitué à partir du texte présent dans le lien et de l’alternative textuelle de l’image, ou des images, présente·s dans ce même lien.

Selon les cas, l’intitulé du lien peut également être constitué du titre de lien, qui s’affiche lorsque l’on passe la souris sur le lien ou que l’on utilise le raccourci clavier approprié du lecteur d’écran. ^[3]

Le contexte du lien

Voici la définition du contexte du lien donnée dans le glossaire du RGAA :

Le contexte du lien représente les informations supplémentaires (on parle d’informations de contexte) qui peuvent être mises en relation par un programme informatique avec l’intitulé du lien. Les informations de contexte qui permettent de compléter l’intitulé du lien sont les suivantes :

• le contenu de la phrase dans laquelle le lien texte est présent ;
• le contenu du paragraphe (balise p) dans lequel le lien texte est présent ;
• le contenu de l’item de liste (balise li) ou le contenu d’un item de liste parent (balise li) dans lequel le lien texte est présent ;
• le contenu du titre (balise hx) précédent le lien texte ;
• le contenu de la ou les cellule(s) d’en-tête de tableau (balise(s) th) associée(s) à la cellule de donnée (balise td) dans laquelle le lien texte est présent ;
• le contenu de la cellule de donnée (balise td) dans laquelle le lien texte est présent.

Conséquences pour les personnes qui naviguent avec un lecteur d’écran

De nombreuses personnes utilisant un lecteur d’écran choisissent de naviguer dans une page web en affichant la liste des liens présents dans cette page.

• Avec JAWS et NVDA, il est possible d’afficher la liste des liens dans une fenêtre séparée avec la touche de commande du lecteur d’écran ^[4] + F7.

• Avec VoiceOver : il faut utiliser ce qu’Apple appelle le « rotor », qui permet de se déplacer dans la page par élément (liens, titres, champs de formulaires).

Cependant, en naviguant sur le web de cette manière, on n’a accès qu’à l’intitulé du lien, pas à son contexte. Ceci est particulièrement gênant dans le cas de pages qui contiennent des liens avec des intitulés identiques et peu explicites hors contexte, comme « cliquez ici », « ici », « lire », « lire plus », « plus d’informations », etc.

Comment utiliser les fonctionnalités de son lecteur d’écran pour connaître le contexte d’un lien ?

1. Utiliser la touche Tab ou la commande du lecteur d’écran pour se déplacer de lien en lien

Quel que soit le lecteur d’écran utilisé, si l’on se déplace de lien en lien à l’aide de la touche tabulation Tab, le curseur du lecteur d’écran se déplace avec le focus du navigateur.

On obtient le même comportement en appuyant sur la touche k avec NVDA, n avec JAWS, l avec VoiceOver.

Lorsque le lien est atteint, le lecteur d’écran lit son intitulé et son titre, s’il en a un.

2. Se servir d’un raccourci spécifique au lecteur d’écran pour obtenir plus d’informations sur un lien

Lorsqu’un lien n’est pas très explicite, il existe une méthode alternative à la précédente pour obtenir plus d’informations sur ce lien :

• avec JAWS et NVDA, il faut appuyer sur la touche du lecteur d’écran et la touche tabulation en même temps ;
• avec VoiceOver, il n’existe pas un tel raccourci. Néanmoins, en plus de la touche de tabulation Tab, la commande VO avec les flèches de direction donne le même résultat. Si on a coché l’option « lire les info-bulles » dans l’utilitaire de VoiceOver, alors le titre du lien sera lu automatiquement dès que le curseur arrivera sur le lien.

3. Utiliser la liste des liens de JAWS et NVDA

Sous JAWS et NVDA, la combinaison de touches JAWS+F7 ou NVDA+F7 permet d’afficher la liste des liens présents dans la page.

Lorsque la liste des liens s’ouvre, JAWS et NVDA annoncent le nombre de liens de la page. On peut se déplacer d’un lien à l’autre en utilisant les flèches bas et haut. Lorsque JAWS et NVDA se déplacent sur le lien sans l’activer, ils annoncent également les informations supplémentaires du lien (par exemple, dans notre cas, son titre).

Dans cette liste de liens, il est également possible de :

• saisir la première lettre d’un lien dont on connaît la présence sur la page. Par exemple : le n pour trouver le lien « nous contacter » ou le c pour trouver le lien de notre test « ce lien » ;
• avec NVDA, filtrer les liens par une chaîne de caractères. Par exemple : afficher tous les liens qui commencent par « lire » ou afficher tous les liens qui contiennent l’expression « ce lien » ;
• avec JAWS, trier les liens par ordre de tabulation ou par ordre alphabétique.

Lorsqu’on a trouvé le lien qui nous intéresse dans la liste, on peut activer ce lien en appuyant sur la touche entrée.

4. Utiliser le rotor de VoiceOver

VoiceOver a une fonctionnalité appelée « rotor » qui permet d’afficher les éléments d’une page par catégorie : liens, images, titres, champs de formulaires, etc.

La façon la plus simple d’accéder au rotor est de procéder ainsi :

• appuyez sur VO+u ;
• utilisez les flèches droite et gauche afin d’atteindre la liste des liens. Lorsque l’élément lien est sélectionné, VoiceOver annonce combien il y a de liens sur la page ;
• parcourez la liste des liens avec les flèches haut et bas. Si vous saisissez la première lettre d’un lien, VoiceOver n’affichera plus que les liens commençant par cette lettre et vous ne pourrez plus naviguer vers les autres liens avec les flèches. Il faudra sortir du rotor, à l’aide de la touche échappe.

Lorsque vous avez trouvé le lien que vous souhaitez lire, appuyez sur entrée. VoiceOver annonce le lien, son titre s’il en a un et la phrase dans laquelle il se trouve.

6. Lire les liens dans leur contexte

Chaque lecteur d’écran possède ses propres commandes pour lire le contexte d’un lien : la phrase, le paragraphe, la liste, etc., dans lequel se trouve le lien. En voici une vue d’ensemble.

Élément de liste majuscule+i pour lire le début de l’élément de liste majuscule+i pour lire le début de l’élément de liste majuscule+i pour lire le début de l’élément de liste majuscule+i pour lire le début de l’élément de liste N/A, il n’est pas possible d’atteindre un élément de liste avec VoiceOver

Commandes de lecture des liens dans leur contexte par les trois lecteurs d’écran

Dans ce tableau, « bureau » se réfère à une utilisation du lecteur d’écran avec un clavier d’ordinateur de bureau, alors que « portable » correspond à une utilisation avec un clavier d’ordinateur portable.

Commande	NVDA bureau	NVDA portable	JAWS bureau	JAWS portable	VoiceOver
Phrase courante	NVDA ne permet de lire que la phrase précédente ou suivante : alt+flèche haut / alt+flèche bas	NVDA ne permet de lire que la phrase précédente ou suivante : alt+flèche haut / alt+flèche bas	JAWS+5 du pavé numérique	JAWS+h	VO+s
Paragraphe courant	N/A, possibilité de lire la ligne courante avec NVDA+flèche haut	N/A, possibilité de lire la ligne courante avec NVDA+l	JAWS+5 du pavé numérique	JAWS+ctrl+i	VO+p
Liste	majuscule+l pour lire le début de la liste	majuscule+l pour lire le début de la liste	majuscule+l pour lire le début de la liste	majuscule+l pour lire le début de la liste	Si la navigation par touche unique est activée, majuscule+x pour lire le début de la liste
Titre	majuscule+h pour lire le titre précédent	majuscule+h pour lire le titre précédent	majuscule+t pour lire le titre précédent	majuscule+t pour lire le titre précédent	Si la navigation par touche unique est activée, majuscule+h pour lire le titre précédent
En-tête de tableau ou cellule de données	Utiliser la commande pour se déplacer d’une cellule à l’autre dans un tableau	Utiliser la commande pour se déplacer d’une cellule à l’autre dans un tableau	Utiliser la commande pour se déplacer d’une cellule à l’autre dans un tableau	Utiliser la commande pour se déplacer d’une cellule à l’autre dans un tableau	Utiliser la commande pour se déplacer d’une cellule à l’autre dans un tableau

Notons que les commandes de lecture les plus faciles pour connaître le contexte d’un lien sont la lecture de la phrase, du titre précédent et, à défaut de la lecture du paragraphe, celle de la ligne courante.

Conclusion

Lorsqu’une personne a l’habitude de naviguer sur une page web en utilisant la liste des liens de son lecteur d’écran, elle n’aura pas connaissance des éléments de contexte des liens en question.

Si le lien seul n’est pas explicite, cela peut être un obstacle pour comprendre la fonction et destination du lien.

Mais rendre un lien explicite en dehors de son contexte est un critère de priorité AAA, c’est-à-dire hors du minimum légal requis.

Puisque les liens hors contexte ne doivent pas obligatoirement être explicites, il est important de connaître ces différentes astuces. La connaissance des commandes alternatives des lecteurs d’écran devient ainsi un atout supplémentaire pour une navigation plus fluide.

---