Jour 83 - Les modes d'interaction des lecteurs d'écran Windows

Quels sont les différents modes d’interaction de JAWS et NVDA avec une page web ?

Ce que j’ai fait :

Ce que j’ai appris

Deux modes d’interaction sous Windows

JAWS et NVDA - lecteurs d’écran sous Windows - restituent des informations provenant du navigateur, soit via l’arbre d’accessibilité, soit via les API d’accessibilité. Ces informations peuvent être restituées sous forme de deux modes :

  • le mode navigation
  • le mode formulaire

Note : le mode navigation est appelé “mode virtuel” sous JAWS.

Le mode navigation

Le mode navigation est celui par défaut quand on arrive sur une page web. C’est le mode qui permet de lire un document et de naviguer à l’intérieur. Par exemple, pour explorer un document, un internaute aveugle peut utiliser les flèches de direction gauche et droite pour se déplacer de caractères en caractères, ou les flèches haut et bas pour se déplacer d’une ligne à une autre. Cela est possible car en mode navigation, le comportement de la plupart des touches est géré directement par le lecteur d’écran.

Concrètement, le lecteur d’écran crée une copie du contenu de la page web appelée “tampon virtuel” : il s’agit d’une représentation textuelle du document avec laquelle les internautes vont pouvoir interagir. Le lecteur d’écran intercepte certains appuis sur le clavier avant qu’ils ne parviennent au navigateur, permettant ainsi de déclencher une interaction avec le document. C’est ce fonctionnement qui permet également l’utilisation de raccourcis clavier. Par exemple, appuyer sur la lettre “T” permet de se déplacer de titre en titre sur JAWS.

Note : tous les appuis clavier ne sont pas interceptés par le lecteur d’écran. Ainsi, l’utilisation de la touche “Tab”, pour déplacer le focus sur les différents éléments interactifs, est directement transmise au navigateur. C’est le cas aussi pour la touche “Espace” pour sélectionner une case à cocher, ou la touche “Entrée” pour activer un lien.

Dans certaines situations, il est nécessaire de quitter le mode navigation et de basculer en mode formulaire.

Le mode formulaire

Ce mode permet à l’internaute d’interagir avec le contenu : saisir un texte, cocher une case, dérouler une liste d’items…

Lorsqu’un internaute se retrouve à devoir saisir des informations - dans un formulaire pour passer une commande par exemple - il ou elle doit pouvoir appuyer sur la touche “T” afin se saisir ce caractère et non pas pour se déplacer de titre en titre. C’est donc bien le mode formulaire qui doit être actif dans ce cas là. Le comportement des touches est alors géré par le navigateur.

Il est possible de forcer JAWS et NVDA à basculer d’un mode à l’autre, mais la plupart du temps ce changement se fait automatiquement :

  • sur NVDA, lorsque la touche “Tab” est utilisée pour se déplacer d’un champ à l’autre du formulaire (l’utilisation des flèches de direction haut et bas fait rebasculer automatiquement en mode navigation)
  • sur JAWS, dès que le focus est activé sur un champ (que ce soit par le biais de la touche “Tab” ou des flèches de direction)

Le mode application avec ARIA

Le mode navigation est similaire au mode formulaire, au sens où dans ce mode le comportement des touches est géré par le navigateur. Il est généralement appliqué pour les composants d’interface riches.

L’utilisation de certains rôles ARIA permet de passer automatiquement en mode application. C’est le cas par exemple du rôle role="dialog" : lorsqu’une boîte de dialogue est affichée, la navigation avec les flèches n’est plus disponible et il faut utiliser la touche “Tab”.

Déclencher le mode application signifie que la gestion au clavier doit être prévue et gérée par un script, c’est-à-dire implémentée par une développeuse ou un développeur.

Note : il existe un rôle ARIA role="application" dont l’objectif est d’empêcher le lecteur d’écran de gérer le comportement des touches. Ce rôle doit être employé avec précaution car son utilisation empêche également d’utiliser tous les raccourcis clavier du lecteur d’écran. Marco Zehe, dans son article If you use the WAI-ARIA role “application”, please do so wisely!(lien externe) détaille les situations dans lesquelles on ne doit pas utiliser role="application" et donne l’exemple de l’interface webmail Yahoo! qui utilise ce rôle à bon escient.