Les nouveautés de NVDA 2020.4
NVDA a connu pas moins de quatre mises à jour depuis la publication de notre article sur les nouveautés de NVDA 2019.3.1 pour l’accessibilité en mars 2020.
La version 2020.4 de NVDA est la dernière en date : elle a été publiée le 19 février 2021. C’est donc le moment idéal pour faire le tour des dernières évolutions notables de NVDA au service de l’accessibilité numérique.
Parmi les nouveautés de NVDA, certaines modifications concernent tout le logiciel, d’autres améliorent l’utilisation de certaines applications, tandis que d’autres évolutions s’appliquent à l’utilisation de NVDA sur le web.
Ajout d’une aide contextuelle avec la touche F1
Cette première nouveauté concerne NVDA proprement dit. Dans les boîtes de dialogue de NVDA, l’appui sur F1 affiche de l’aide contextuelle sur le dialogue en cours.
Cela peut être utile pour les personnes qui ne connaissent pas encore très bien le logiciel et qui ont encore besoin d’aide pour apprendre à s’en servir.
Faites le test !
Pour comprendre ce qu’apporte cette nouvelle fonctionnalité, effectuez les actions suivantes :
- ouvrez la liste des synthétiseurs de NVDA en appuyant sur NVDA + CTRL + S ;
- appuyez sur F1 ;
- NVDA ouvre le guide de l’utilisateur dans votre navigateur par défaut et vous place dans la section consacrée au choix du synthétiseur.
Note : sous Firefox, il se peut que le navigateur bloque le chargement du guide et vous demande d’autoriser l’ouverture de la page concernée.
Changement de nom dans la boîte de dialogue de visualisation du focus
NVDA dispose d’une fonctionnalité intégrée qui permet à une personne voyant l’écran de visualiser où se trouve le focus/le curseur du lecteur d’écran. Cette fonctionnalité est toujours la même, mais son nom a changé : « Mettre en évidence le focus » a été renommé en « Mise en évidence visuelle ».
Ce paramétrage est constitué de 4 cases à cocher, situées au début de l’onglet « Vision » des paramètres de NVDA.
Lorsque l’on coche la première case, « Activer la mise en évidence », les trois autres sont cochées automatiquement :
- Mettre en évidence le focus système (c’est-à-dire le curseur système qui est utilisé avec ou sans le lecteur d’écran) ;
- Mettre en évidence l’objet navigateur (c’est-à-dire le curseur du lecteur d’écran dans le jardon NVDA) ;
- Mettre en évidence le curseur du mode navigation.
Cela permet aux personnes qui évaluent l’accessibilité d’une interface, ou qui accompagnent une personne débutante sur NVDA, de savoir à quel endroit NVDA se trouve dans une page web, une application ou tout autre endroit de Windows.
Ces indications sont données par un contour rectangulaire coloré.
- Lorsque le curseur de NVDA suit le curseur système, sa position est indiquée en bleu.
- L’élément sur lequel se trouve le focus système est indiqué en bleu pointillé.
- Le curseur de NVDA est indiqué en rose.
- Le curseur virtuel utilisé en mode navigation (qui permet de se déplacer dans une page HTML ou dans un document PDF) est indiqué en jaune.
Faites le test !
Pour comprendre à quoi sert cette mise en évidence, procédez comme suit :
- Allez dans les paramètres de NVDA en appuyant sur NVDA + N, puis P, puis Entrée.
- Choisissez l’onglet « Vision ».
- Le premier groupe de boutons radio est intitulé « Mise en évidence visuelle », au lieu de « Mettre en évidence le focus » sur les versions précédentes de NVDA.
- Si ce n’est pas déjà fait, cochez la case « Activer la mise en évidence ». Cette action permettra de cocher également les trois cases suivantes : « Mettre en évidence le focus système », « Mettre en évidence l’objet navigateur » et « Mettre en évidence le curseur de l’objet navigation ».
- Rendez-vous sur une page web de votre choix et déplacez-vous avec la tabulation ou les flèches de direction. Vous devriez voir les différentes couleurs de curseurs.
Affichage des étiquettes de champs de formulaire grisés
Dans la précédente boîte de dialogue de paramétrage de NVDA, lorsqu’un contrôle n’était pas activable, non seulement cela n’était pas indiqué visuellement, mais il était aussi possible de se déplacer sur l’élément, malgré son état inactif.
Ce bug a été corrigé dans la version 2020.4 de NVDA. En effet, les contrôles inactifs sont maintenant grisés, ce qui aidera les personnes ayant un reste visuel à identifier qu’ils ne peuvent pas être activés.
De plus, il n’est plus possible de se déplacer sur ce contrôle avec un raccourci NVDA.
Faites le test !
Pour tester, procédez comme suit.
- Ouvrez les paramètres braille de NVDA : appuyez sur NVDA + N, puis P, puis Entrée, puis choisissez l’onglet « Braille ».
- Décochez la case « Montrer le curseur ». Le champ « Forme du curseur pour le mode focus » est grisé.
- Appuyez sur le raccourci Alt + F pour atteindre ce champ. Puisqu’il est grisé, NVDA ne peut pas y accéder alors qu’il le faisait dans les versions précédentes.
Ne plus annoncer les images
Lorsque NVDA arrive sur une image, il restitue son alternative si elle est présente, qu’il préfixe automatiquement par le mot « graphique ».
Par exemple, « graphique, République française, visité lien graphique, Accueil service-public.fr ».
Code HTML correspondant :
Or, cette restitution du mot « graphique » avant chaque image peut être gênante dans des applications contenant de nombreuses images dont l’attribut alt est manquant dans le code. NVDA dira alors quand même « graphique » à chaque fois, ce qui ralentit la lecture inutilement.
Depuis la version 2020.3 de NVDA, il est désormais possible de demander à NVDA de ne plus annoncer le mot « graphique » lorsqu’il restitue une image et son alternative.
À noter que par défaut, l’annonce du mot « graphique » est activée.
Note : pour rappel, quand une image possède bien l’attribut alt, mais que celui-ci est vide, NVDA ne restitue pas du tout l’image ni le mot « graphique ». C’est tout à fait normal.
Faites le test !
- Rendez-vous sur le site de service-public.fr.
- Appuyez sur la touche G, pour atteindre le premier graphique avec alternative.
- NVDA annonce : « graphique République française ».
- Pour que NVDA ne dise plus « graphique » pour chaque image restituée, ouvrez les paramètres de mise en forme des documents : NVDA + CTRL + D, ou allez dans « Préférences », puis « Paramètres », puis dans l’onglet « Mise en forme des documents ».
- Décochez la case « Graphiques ».
- Confirmez avec OK.
- Remontez en haut de la page de Service-public.fr avec CTRL + Début, puis appuyez à nouveau sur la touche G. NVDA annonce : « République française » tout court.
Note : le choix de faire annoncer des éléments d’une page web par NVDA existait déjà pour l’annonce ou non des liens, titres, citations, listes, éléments cliquables. L’option de vocalisation du mot « graphique » a été ajoutée suite à la demande d’utilisateurs et utilisatrices de NVDA afin de ne plus entendre des séries de graphiques dans des applications inaccessibles contenant de nombreuses images dont l’attribut alt est manquant dans le code.
Naviguer rapidement vers un système d’onglets (tabpanel) et ses composants
Interagir au clavier avec un système d’onglets (tabpanel) est clairement défini par le motif de conception ARIA Tabs.
On accède aux onglets en tabulant, puis on peut naviguer entre les onglets et leur contenu à l’aide de raccourcis.
Néanmoins, il peut être utile de naviguer d’un onglet à l’autre sans interagir avec le système d’onglets.
NVDA permet désormais de naviguer vers un système d’onglets à l’aide du raccourci F, et de se déplacer d’un onglet à l’autre en continuant à appuyer sur F, comme si chaque onglet était un contrôle de formulaire.
L’avantage de ce nouveau moyen de navigation est que l’on peut atteindre rapidement la liste des onglets sans avoir à tabuler plusieurs fois parmi tous les éléments tabulables de la page.
Il y a néanmoins un inconvénient dans cette technique de navigation : en effet, NVDA n’active pas le mode formulaire quand on arrive sur le système d’onglets. En conséquence, le nombre d’onglets présents et la position de chaque onglet dans la liste des onglets ne sont pas restitués.
Pour obtenir cette information malgré tout, il faut appuyer sur NVDA + espace afin d’activer le mode formulaire/application.
Ci-dessous, une démonstration en vidéo de ce comportement.
- [Sylvie] Voici comment naviguer selon les spécifications ARIA dans un système d’onglets.
- Je suis donc sur un site
- [Synthèse vocale] Parole activée. Visité lien, aller au contenu principal.
- [Sylvie] Donc je peux utiliser le lien pour aller directement au contenu principal, entrée.
- [Synthèse vocale] Principal, région article lien domestique, onglet sélectionné train, onglet bus, onglet hôtel, lien acheter une carte ou un abonnement groupe, itinéraire…
- [Sylvie] Donc là il me lit tout le contenu donc si j’y vais à la tabulation,
- [Bip] [Synthèse vocale] article, onglet, train onglet sélectionné, 1 sur 3.
- [Sylvie] On entend un petit bip, qui indique que le mode formulaire s’est activé.
- Et NVDA annonce « train, onglet 1 sur 3 ». Donc j’ai le nom de l’onglet sélectionné, le nombre d’onglets qu’il y a et la position dans la liste des onglets.
- Ensuite, je peux utiliser les flèches
- pour aller d’un onglet à l’autre
- [Synthèse vocale] Bus onglet sélectionné, 2 sur 3.
- Hôtels, onglet sélectionné, 3 sur 3.
- Train, onglet sélectionné, 1 sur 3.
- [Sylvie] Et on revient à la liste, enfin au premier onglet.
- [Bip]
- [Sylvie] Je quitte le mode formulaire, avec Échappe, et je vais maintenant vous montrer comment on peut naviguer avec la nouvelle commande de NVDA.
- Donc je reviens en haut.
- [Synthèse vocale]
- [Sylvie] Voilà, je suis sur mon lien pour accéder au contenu, et si je tape F, cela va me permettre d’aller d’élément de formulaire en élément de formulaire.
- [Synthèse vocale] Liste de deux éléments, accepter bouton.
- Bannière région, menu bouton.
- Accessibilité bouton.
- France bouton.
- Votre panier est vide bouton.
- article, train onglet sélectionné.
- [Sylvie] Donc là j’arrive sur le train onglet sélectionné. Mais dans cette configuration-là je me suis juste positionnée sur le premier onglet mais je ne sais pas combien il y en a dans la liste.
- Si je rappuie sur F
- [Synthèse vocale] Bus onglet.
- [Sylvie] Je suis à nouveau sur le 2ème onglet bus.
- [Synthèse vocale] hôtel onglet.
- [Sylvie] Mais je ne sais pas combien il y en a dans ma série d’onglets.
- Donc pour le savoir, je suis obligée de réactiver le mode formulaire avec NVDA + Espace,
- [Bip]
- [Sylvie] Et là, j’ai bien
- [Synthèse vocale] sélectionné, train onglet sélectionné, 1 sur 3.
- Bus onglet sélectionné, 2 sur 3.
- Hôtel, onglet sélectionné, 3 sur 3.
- [Sylvie] Donc quoiqu’il arrive, il faudra passer en mode formulaire, ensuite, pour avoir une information sur le nombre d’onglets et la position dans les onglets.
Afficher la liste d’éléments en mode formulaire/application
Dans les applications web qui supportent le mode navigation (navigateurs, documents PDF, Word, etc.), il est désormais possible d’afficher la liste des éléments à l’aide de NVDA + F7 en mode formulaire/application, tout comme en mode navigation.
Voici une petite démonstration en vidéo.
- [Sylvie] J’utilise l’ancienne version de NVDA et je vais vous montrer l’affichage des liens ou non dans le mode formulaire.
- Pour cela, je vais sur le site d’Access42, par exemple,
- [Synthèse vocale] parole activée.
- [Sylvie] Je tabule dans le champ de saisie de recherche
- [Synthèse vocale] : [Bip], renseignez un mot clé, édition autocomplétion sélectionné.
- [Sylvie] Vous avez entendu peut-être un Bip, qui indique l’activation du mode formulaire et le nom du champ avec l’instruction de renseigner un mot clé.
- J’appuie sur NVDA + F7.
- [Synthèse vocale] Navigation au curseur, l’appui sur F7 active ou désactive la navigation au curseur.
- [Sylvie] Donc cette instruction est une instruction Firefox, quand on appuie sur F7, et cela ne prend pas du tout en compte l’appui sur NVDA + F7.
- Pour avoir ma liste de liens, il faut donc que je sorte du mode formulaire,
- [Synthèse vocale] accueil. Bip.
- Voilà, vous avez entendu le Bip pour sortir de ce mode.
- Et là, si j’appuie sur NVDA + F7
- [Synthèse vocale] liste d’éléments, liens dialogue. Arborescence, niveau 1 aller au contenu, 1 sur 28.
- [Sylvie] Vous avez bien la liste des liens.
- [Sylvie] J’utilise maintenant la nouvelle version de NVDA et je retourne sur le site.
- [Synthèse vocale] parole activée.
- [Sylvie] Je vais sur le champ de saisie de la recherche.
- [Bip] [Synthèse vocale] Renseignez un mot clé édition autocomplétion, sélectionné.
- [Sylvie] Là vous entendez le petit Bip annonçant l’entrée en mode formulaire. Et on va voir maintenant si la liste des liens s’affiche avec NVDA F7.
- [Synthèse vocale] Liste d’éléments, liens dialogue. Arborescence, aller au contenu 1 sur 28, niveau 0.
- Et contrairement à la version précédente, la liste des liens s’affiche bien.
Suppression des mises à jour ARIA live
La propriété aria-live a pour rôle d’avertir les personnes utilisant un lecteur d’écran de certains changements d’états ou d’alertes, par exemple lorsqu’un contenu important est mis à jour sur une page de manière dynamique.
Or, cette propriété est parfois utilisée de manière inappropriée, générant une vocalisation gênante lorsqu’elle se produit trop souvent.
Par exemple, si un champ de saisie possède la propriété aria-live, à chaque fois que l’utilisatrice saisira un caractère dans ce champ, NVDA prononcera tout le contenu du champ. Pénible !
Lorsqu’on estime que ces annonces perturbent trop la navigation, NVDA permet dorénavant de désactiver l’annonce des changements dynamiques de contenu dans ces zones live.
Faites le test !
Pour tester cela, procédez comme suit :
- Affichez les paramètres de NVDA en appuyant sur NVDA + N, puis P et Entrée.
- Allez dans l’onglet « Présentation des objets » et décochez la case « Annoncer les changements dynamiques de contenu ».
- Confirmez avec OK.
Attention : cette option n’est utile que lorsque la vocalisation est gênante. Si vous la désactivez en permanence, vous risquez de ne plus avoir accès à certaines informations primordiales, car plus aucune vocalisation ne sera possible lorsqu’un attribut aria-live sera utilisé.
Autres améliorations apportées par les versions 2020 de NVDA
Pour le web
- NVDA gère maintenant l’attribut
aria-roledescriptionsur les éléments de contenus éditables sur une page web. - Dans une liste éditable sur le web, le déplacement de caractère en caractère ou de mot en mot permet maintenant à NVDA d’annoncer chaque changement d’élément de liste, ce qui n’était pas le cas auparavant.
- En ce qui concerne les tableaux ARIA Grid, ils sont maintenant restitués correctement comme des tableaux classiques sous Firefox et Chrome. Sur l’exemple du W3C, NVDA annonce dorénavant la présence du tableau et le nombre de lignes et de colonnes.
Autres améliorations
- Prise en charge de nouveaux afficheurs braille.
- Corrections de bogues et améliorations dans des applications telles que Mail, Outlook, Teams, Visual Studio, Azure Data Studio, Foobar2000.
- Meilleure gestion des contenus MATHML dans Word.
- Amélioration de l’accessibilité du gestionnaire de mots de passe 1Password.
- Amélioration des performances pour les applications MS Office.
- Corrections de bogues dans la restitution de cases à cocher dans des formulaires sous Chrome par exemple.
- Améliorations dans Google Docs.
Conclusion
Nous n’avons choisi de ne traiter que quelques exemples de nouvelles implémentations dans les versions 2020 de NVDA, en particulier pour la version 2020.4.
Mais il y en a d’autres ! Pour découvrir toutes les nouveautés de ce lecteur d’écran, vous pouvez consulter une liste des changements en anglais ou leur traduction en français.
Ces nouveautés montrent que NVDA s’adapte régulièrement aux évolutions du numérique et que les personnes qui le développent tentent de les traiter en fonction des retours des utilisateurs et des utilisatrices.
Si vous avez des remarques sur une fonctionnalité à ajouter, une amélioration à suggérer ou un dysfonctionnement à signaler, vous pouvez les publier sur le compte GitHub de NV Access, l’organisme qui développe NVDA.
Les commentaires sont désormais fermés, mais vous pouvez toujours nous contacter pour réagir à cet article !