Tutoriel pour rendre son application Swing accessible aux non-voyants

Ce tutoriel s'intéresse à présenter les bonnes pratiques pour rendre une application Swing accessible aux non-voyants.

Pour réagir à cet article, un espace de dialogue vous est proposé sur le forum. 1 commentaire Donner une note à l'article (5).

Article lu   fois.

L'auteur

Liens sociaux

Viadeo Twitter Facebook Share on Google+   

I. Problématique

Pour utiliser un ordinateur, une personne non-voyante utilise un logiciel appelé lecteur d'écran, qui vocalise avec une synthèse vocale les éléments sous le curseur. Mais pour cela il faut qu'il y ait un texte à lire et que ce dernier soit focusable ou bien accessible au lecteur d'écran.

L'accessibilité d'une application lourde diffère beaucoup de celle d'une application web, car elle mélange des éléments focusables et non focusables. Contrairement à une page web, une application n'est pas un tout. On trouve :

  • un cadre ;
  • une barre de menu ;
  • des menus pop-up ;
  • des onglets.

Ainsi l'application est divisée en différentes parties qui regroupent des widgets :

  • boutons ;
  • champs de texte ;
  • etc.

C'est cette agrégation de composants qui permet de créer l'interface graphique d'une application. Mais ces ensembles peuvent se révéler hétérogènes. Il peut être compliqué de naviguer, au clavier, dans une partie de l'application, ou changer de sous-partie.

Une première façon de tester l'accessibilité d'une application est de l'utiliser sans souris, seulement au clavier. S'il est possible de réaliser les cas d'utilisation, l'application est déjà accessible en partie.

II. Qu'est-ce qu'un lecteur d'écran

Il s'agit d'un logiciel qui permet aux non-voyants d'utiliser un ordinateur.

Il vocalise les éléments textuels à l'écran avec une synthèse vocale. Dans le cadre de l'utilisation d'une application lourde, la navigation se fait au clavier, avec la touche tabulation, de composant en composant. Le lecteur d'écran annonce lors de la prise du focus :

  • le type de l'élément ;
  • l'état coché, activé, sélectionné, éditable ou non-éditable ;
  • le texte qu'il contient ;
  • le texte associé au composant, s'il existe.

C'est pourquoi, pour améliorer l'expérience des utilisateurs non-voyants, il faut mettre à portée du lecteur d'écran des informations textuelles qu'il pourra annoncer. C'est un travail qui revient aux développeurs.

III. Impact sur le développement

Si cela est fait dès la création de l'application, cela ne requiert pas beaucoup de travail. De plus l'ergonomie de l'application est améliorée pour les utilisateurs voyants travaillant au clavier. Par exemple, un utilisateur qui fait de la saisie au kilomètre travaillera plus vite si le focus est bien géré, qu'il n'a pas besoin de prendre sa souris pour revenir en début de formulaire pour saisir un nouvel enregistrement et qu'il peut passer de champ en champ avec la touche tabulation ou entrée.

La mise à niveau de l'accessibilité d'une application demande en premier lieu un audit de son accessibilité. Le travail se traduira surtout par l'ajout de propriétés aux composants utilisés et peu de correction du code en profondeur.

IV. Mise en pratique avec Java et Swing

La plateforme Java intègre un outil pour l'accessibilité : le JavaAccessBridge. Dans un premier temps, il suffit juste que les utilisateurs l'activent.

Sous Windows 7, il faut :

  • aller dans les « options d'ergonomie » avec la combinaison de touches Windows et u ;
  • aller dans « utiliser l'ordinateur sans écran » ;
  • cocher la case « activer le JavaAcessBridge ».

À partir de maintenant, les lecteurs d'écran seront plus efficaces avec les applications Java Swing.

IV-A. L'API d'accessibilité

Java intègre une API pour l'accessibilité : http://docs.oracle.com/javase/8/docs/technotes/guides/access/jaapi.html.

Cependant, dans la plupart des cas, il n'est pas nécessaire que le développeur l'utilise directement. Si le JavaAcessBridge est activé, elle se déclenchera d'elle-même.

Il suffit de respecter certaines règles, pour mettre à sa portée les informations, pour qu'elles soient vocalisées. C'est ce que j'évoquerai ci-dessous.

V. L'adaptation du code

V-A. Les fenêtres

En plus d'afficher la fenêtre avec setVisible(true), il est important de demander le focus pour que l'utilisateur n'ait pas à sélectionner l'application, car la rechercher parmi toutes les applications ouvertes peut s'avérer fastidieuse.

Ensuite il faut définir un titre pour l'application avec setTitle, car c'est la première information annoncée par le lecteur d'écran lorsqu'une fenêtre obtient le focus. C'est pourquoi il faut toujours attribuer un titre aux JFrame, JMdiFrame, ou JInternalFrame. S'il n'est pas défini, le lecteur d'écran annoncera cadre vide, ou sans titre, et cela peut être perturbant si on navigue entre plusieurs fenêtres sans titre.

Il peut être intéressant d'ajouter au titre une information sur les données chargées dans l'application, comme le nom du document, surtout si on souhaite ouvrir plusieurs fois l'application. Par exemple « mon document - mon application ».

Cela est à l'inverse de la convention. Mais lorsque le lecteur d'écran annonce le titre de la fenêtre, il relit tout. Comme le nom du document est placé en première position, et que cette information est plus précise, il rend le nom de l'application superflu. L'utilisateur à la possibilité, à tout moment, de stopper la lecture de la synthèse vocale, avec la touche CTRL, s'il a obtenu les informations qui lui sont nécessaires.

Ensuite le lecteur d'écran va lire les informations du composant qui a le focus, à l'intérieur de la fenêtre. C'est pourquoi il est judicieux de placer le focus sur le composant qui doit être utilisé en premier dans l'application, par exemple pour une application où l'utilisateur saisit dans des formulaires, avec l'une des fonctions suivantes, de préférence après l'appel de setVisible(true) sur la JWindows :

  • Request focus();
  • requestFocusInWindow().

V-B. Association d'un composant à un label

Lors de la prise de focus, le lecteur d'écran va par défaut annoncer une information sur le type du composant puis lire son contenu ou son état. Cependant il manque une information décrivant la fonction du composant. En général, pour définir un composant, on place à côté un JLabel. Comme ce dernier n'est pas focusable, le lecteur d'écran l'ignore. C'est pourquoi il faut associer le composant avec le JLabel qui le décrit. Et s'il n'y en a pas, définir un tooltip text.

Il est possible de définir les deux à la fois. Cela ne pose pas de problème, car le lecteur d'écran n'en lira qu'un seul.

Ainsi une fois le focus obtenu par le composant, le lecteur d'écran lira en plus le texte du JLabel associé, ce qui permettra de connaître sa fonction et comment l'utiliser.

 
Sélectionnez
1.
2.
3.
4.
5.
6.
7.
8.
9.
JTextField champsNom = new JTextField(25);
champsNom.setToolTipText("Nom");
 
JLabel label = new JLabel("Nom :");
panel.add(label);
label.setLabelFor(champsNom);
 
panel.add(champsNom);
champsNom.requestDefaultFocus();

Sont concernés :

  • les zones de texte (JTextField, JEditorPane) ;
  • les JCheckBox ;
  • les boutons radios JRadioButton;
  • les JTable ;
  • les JButton ne comportant pas de texte, mais une image.

Ne sont pas concernés, car disposant d'un texte par défaut : les boutons JButton.

V-C. Les JTable

Le problème posé par les JTable est que lorsqu'elles obtiennent le focus, les données qu'elles contiennent ne sont pas concernées par le focus. Il faut placer la sélection sur une cellule de la JTable, de préférence aux coordonnées 0-0, car par défaut la JTable n'a pas de sélection. C'est pourquoi il faut cliquer avec la souris pour commencer la saisie. Il faut utiliser le code suivant qui passe par la JTableModel, pour placer la sélection en haut à gauche de la matrice.

 
Sélectionnez
1.
tableModel.changeSelection(0,0) ;

Lors de la navigation, le lecteur d'écran peut annoncer le nom de la colonne et de la ligne qui viennent d'être sélectionnées, en fonction des préférences du lecteur d'écran. L'utilisateur dispose de raccourcis pour obtenir ces informations. Il faut savoir que pour sortir d'une JTable, au clavier, il faut appuyer sur la combinaison de touches CTRL plus tabulation, puisque l'appui sur la touche tabulation fait avancer d'une cellule.

V-D. Les JPane

Les Jtable évoquées ci-dessus permettent de structurer l'affichage et la saisie des informations. Néanmoins ce sont des composants un peu lourds à utiliser. C'est pourquoi si vous ne proposez pas la modification des données à vos utilisateurs, elles peuvent être avantageusement remplacées par des JEditorPane, affichant des données au format HTML. Le HTML a l'avantage d'être très bien reconnu par les lecteurs d'écran.

 
Sélectionnez
1.
2.
JEditorPane editor = new JEditorPane();
editor.setEditorKit(new HTMLEditorKit());

V-E. Les menus pop-up

Il faut s'assurer que les menus contextuels soient gérés à la fois à la souris et au clavier. Cela est valable pour tous les composants qui ne géreraient que les évènements de la souris.

V-F. Les menusBar

Par défaut la barre de menus n'est pas accessible avec la touche ALT. Pour cela, il faut utiliser la touche F10. Quand on appuie sur la touche ALT, on entre dans le menu de la fenêtre (fermer, agrandir, quitter). C'est un comportement propre à Swing.

V-G. Les JList et les JComboBox

Il est préférable de sélectionner un item par défaut, car il peut arriver que, sans cela, on ne puisse pas prendre le focus sur le composant.

 
Sélectionnez
1.
2.
jComboBox.setSelectedIndex(0);
jList.setSelectedIndex(0);

Si vous définissez un item null ou vide, évitez de mettre son texte à vide. Donnez-lui un nom comme « aucun, none, null… ».

Dans le cas où les données contenues dans la liste sont modifiées, il faut replacer le focus sur l'item par défaut, ou bien sur le ou les items présélectionnés par l'utilisateur, lors des actions précédentes. Il est à noter que la sélection de plusieurs éléments au clavier dans une JList est compliquée, pour un utilisateur non-voyant.

V-H. Des causes possibles de régressions de l'accessibilité

Les mises à jour logicielles peuvent entrainer une régression de l'accessibilité d'une application. C'est pourquoi les utilisateurs non-voyants sont réticents à faire certaines mises à jour de leurs logiciels. Les principales causes sont :

  • la mise à jour du système d'exploitation ;
  • le changement du système d'exploitation ;
  • la mise à jour ou changement de version du lecteur d'écran ;
  • la mise à jour du JRE ou du JDK, c'est une des plus fréquentes dans notre cas.

En général, la seule solution est de conseiller à l'utilisateur de revenir à la version antérieure, en attendant un correctif.

V-I. Gestion du focus

Si l'application permet de saisir des informations au kilomètre, après la validation d'un enregistrement, il faut :

  • afficher une boîte de dialogue informant que l'opération a réussi. Les boîtes de dialogues sont accessibles : n'hésitez pas à les utiliser. Cette solution est préférable à l'affichage d'un texte, dans le bas du cadre de l'application, qui ne sera pas lu par le lecteur d'écran ;
  • puis replacer le focus sur le premier champ du formulaire. Ainsi l'utilisateur n'a pas besoin d'utiliser sa souris ou de naviguer au clavier, pour retourner au début du formulaire, pour passer à l'enregistrement suivant.

V-J. Code d'exemple

Vous trouverez une application d'exemple qui permet de faire la table d'addition ou de multiplication d'un nombre entier , entre 1 et 10. Elle utilise des composants courants et applique les conseils évoqués dans ce document.

  • Les composants sont associés à un JLabel ou une infobulle.
  • Les champs de texte et la liste déroulante n'utilisent pas de listener, pour utiliser volontairement un bouton.
  • Les données sont affichées dans une JTable et JEditorPane qui sont affichées dans des onglets.
  • L'appui sur le bouton « Calculer » replace le focus dans la JTable des résultats, en haut à gauche.
  • Le JEditorPane affiche les résultats sous forme d'un tableau HTML.

VI. Conclusion

Pour rendre une application Swing accessible il faut :

  • renseigner un titre pour les fenêtres ;
  • placer le focus sur un élément au démarrage de l'application ;
  • s'assurer que tous les éléments sont focusables ou accessibles au clavier ;
  • que les composants ont un texte descriptif accessible ;
  • que les éléments comportant des informations sélectionnables soient accessibles via le clavier.

Il existe plusieurs lecteurs d'écrans qui ne se comportent pas de la même façon. Les conseils énoncés dans ce document peuvent s'avérer utiles avec un logiciel, mais pas avec un autre qui est capable de vocaliser l'information. Mais il est judicieux de tous les appliquer, car ils ne dégraderont pas l'expérience utilisateur. De plus ils peuvent améliorer l'ergonomie pour les utilisateurs voyants. En effet l'accessibilité concerne également les utilisateurs qui souhaitent utiliser une application au clavier, car une application accessible est une application utilisable au clavier. Ces stratégies sont valables pour d'autres langages et toolkits graphiques.

Concernant Java, il est à noter que SWT est plus accessible, car plus proche de la couche graphique native de Windows. C'est pourquoi j'utilise Eclipse en place de NetBeans.

Rendre une application métier accessible permet de favoriser l'intégration de déficients visuels dans le monde du travail, mais cela améliore aussi l'ergonomie pour tous les utilisateurs, donc il faut l'envisager comme un vecteur d'amélioration pour tous. Le but recherché est d'améliorer l'accessibilité pour tous les déficients ou non.

VII. Remerciements

Nous tenons à remercier Malick SECK pour la relecture de cet article, Mickael Baron pour la mise au gabarit et Joël Drigo pour sa relecture technique.

Vous avez aimé ce tutoriel ? Alors partagez-le en cliquant sur les boutons suivants : Viadeo Twitter Facebook Share on Google+   

  

Les sources présentées sur cette page sont libres de droits et vous pouvez les utiliser à votre convenance. Par contre, la page de présentation constitue une œuvre intellectuelle protégée par les droits d'auteur. Copyright © 2016 2016. Aucune reproduction, même partielle, ne peut être faite de ce site ni de l'ensemble de son contenu : textes, documents, images, etc. sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts.