Test utilisateur avec des personnes atteintes de handicaps
Dans l'idéal, vous devez tester vos produits avec des utilisateurs réellement atteints de handicaps. Il peut être utile de parcourir votre interface avec un clavier ou un lecteur d'écran, mais ces exercices ne vous donnent pas d'informations sur la manière dont les utilisateurs réels navigueront sur le site à l'aide des technologies d'assistance.
Même si vous pouvez effectuer des tests avec des personnes atteintes de handicaps, sachez que les utilisateurs de technologies d'assistance sont divers et que l'expérience de l'un d'entre eux n'est pas forcément représentative de celle des autres. Un utilisateur de lecteur d'écran qui a récemment perdu la vue utilisera sa TA d'une manière très différente d'une personne qui est née aveugle. Les deux expériences doivent être prises en compte, mais si vous avez appliqué un modèle spécifique qui ne semble pas intuitif ou facile à utiliser pour une personne, vous ne devez pas l'abandonner au profit d'une solution de contournement qui améliore l'expérience de cette personne. Il est généralement préférable de s'en tenir aux conventions établies et aux meilleures pratiques. L'objectif du test utilisateur doit être de constituer un pool varié représentatif de besoins divers, et de voir comment il influe sur l'expérience.
Si les tests avec de vrais utilisateurs reste la meilleure approche, dans la mesure où vous avez conscience des limites, réaliser les tests vous-même pour vous assurer que le site satisfait aux exigences minimales et offre de nombreux avantages.
Testez la navigation alternative avec un clavier
L'utilisation d'un site avec un clavier est utile, car elle permet de faire d'une pierre plusieurs coups. Naviguer entre les éléments de la page à l'aide de la touche TAB pour avancer et de Maj + TAB pour revenir en arrière permet d'identifier si :
Toutes les fonctions sont accessibles avec un clavier (SC 2.1.1).
Le focus reste bloqué quelque part sur la page (SC 2.1.2).
Un lien d'accès direct au contenu vous permet de passer rapidement des blocs de navigation qui se répètent (SC 2.4.1).
L'ordre de focus des éléments est logique (SC 2.4.3).
Un indicateur de focus est visible (SC 2.4.7).
Souvent, les concepteurs n'ont pas conscience que l'accessibilité au clavier est également importante sur les appareils mobiles. De nombreux smartphones et tablettes prennent en charge des claviers Bluetooth qui peuvent être utiles pour les utilisateurs qui éprouvent des difficultés avec les interactions tactiles. Les utilisateurs peuvent également augmenter la taille d'un site web sur un ordinateur de bureau jusqu'à ce qu'il s'affiche en vue mobile, ce qui déclenche souvent un menu de navigation entièrement différent. Si le site que vous examinez dispose d'une vue mobile, en particulier si celle-ci est différente de la vue sur ordinateur, vous devez également la tester. Les vues mobiles sont plus susceptibles d'influer sur l'utilisabilité du clavier et l'ordre du focus.
Vous pouvez tester les sites web sur un ordinateur de bureau ou connecter un clavier Bluetooth à votre appareil. Veuillez noter qu'actuellement, les appareils iOS ne prennent pas pleinement en charge la navigation au clavier. Ils permettent aux utilisateurs de taper du texte dans les champs à l'aide d'un clavier, mais pas d'utiliser des applications, par exemple. La plupart des appareils Android prennent en charge l'utilisation du clavier.
Testez la présentation alternative avec un lecteur d'écran (web et mobile)
Lecteurs d'écran sur ordinateur de bureau
Comme je l'ai déjà évoqué, savoir utiliser un lecteur d'écran n'est pas la même chose qu'être un utilisateur de lecteur d'écran. Gardez à l'esprit que votre objectif n'est pas de simuler l'expérience d'utilisateurs non voyants, mais plutôt d'inspecter le site afin de détecter les problèmes sous-jacents. Pour cette raison, je ne plaide généralement pas en faveur de la coupure de l'écran pendant les tests sur lecteur d'écran, même si cela peut sembler s'approcher davantage d'une expérience sur lecteur d'écran. Au lieu de cela, recherchez les incohérences entre le design visuel et les informations qui vous sont communiquées par le lecteur d'écran. Certains états sont-ils uniquement clairs en mode visuel ? Par exemple, l'onglet sélectionné, le fait qu'une section soit développée ou réduite. Les images sont-elles décrites de manière précise ? La structure de la page dans le contenu est-elle prise en charge dans la structure des rubriques et les repères de page ?
Avant de commencer le test, lisez l'un des articles suivants ou les deux, en fonction du lecteur d'écran que vous allez utiliser :
Tester l’accessibilité d’une page web ou d’un PDF avec NVDA (ou Using NVDA to Evaluate Web Accessibility en anglais) ;
À propos de notions élémentaires de VoiceOver (ou Using VoiceOver to Evaluate Web Accessibility en anglais).
À vous de jouer : utilisez un lecteur d'écran pour interagir avec votre site
À vous de jouer désormais ! Utilisez l'un des deux lecteurs d'écran (ou les deux !). Essayez de vous déplacer dans le contenu des trois manières suivantes :
Lecture séquentielle de tout le contenu
VoiceOver : Ctrl+Option (touches VO) et flèches Gauche/Droite. Pour explorer les groupes de contenu en profondeur, appuyez sur VO+Maj+Bas. Pour quitter les groupes, appuyez sur VO+Maj+Haut.
NVDA : Utilisation des touches fléchées Haut/Bas
Navigation uniquement dans les éléments et informations interactifs
NVDA et VoiceOver : utilisez TAB pour avancer et Maj+TAB pour revenir en arrière
Par repère
NVDA : utilisez la touche D pour passer d'un repère à un autre.
VoiceOver : appuyez sur VO+U pour afficher le menu Rotor. Accédez aux repères à l'aide des touches fléchées Gauche/Droite. Déplacez-vous dans les repères à l'aide des touches fléchées Haut/Bas.
N'hésitez pas à utiliser les autres raccourcis et options de navigation présentés dans les articles ci-dessus, notamment pour passer d'une rubrique à l'autre et naviguer dans les formulaires et les tableaux.
Si de nouveaux problèmes surviennent lorsque vous explorez le site avec le lecteur d'écran, pensez à les consigner dans votre rapport.
Lecteurs d'écran sur mobile
Vous pouvez également tester les interfaces à l'aide du lecteur d'écran intégré à votre appareil mobile. Les appareils mobiles étant tactiles, l'interaction avec le lecteur d'écran sera très différente de l'expérience sur un ordinateur de bureau. Vous pouvez en principe utiliser le balayage vers la gauche et la droite pour vous déplacer entre les différents éléments à l'écran.
Vous pouvez également vous déplacer entre des types d'éléments spécifiques tels que les rubriques, les liens ou les commandes. Sur iOS, vous pouvez le faire à l'aide de la fonction Rotor. Décrivez un cercle avec deux doigts comme pour faire tourner un cadran afin d'accéder à l'élément de votre choix, puis balayez vers la gauche et la droite pour vous déplacer entre les différents éléments. Avec TalkBack, vous pouvez vous déplacer entre les différents types d'éléments en balayant vers le haut et le bas, puis passer d'un élément à l'autre en balayant vers la gauche et la droite.
En résumé
Testez si le site prend correctement en charge la saisie alternative en le parcourant à l'aide d'un clavier.
Testez s'il prend correctement en charge la restitution alternative à l'aide d'un lecteur d'écran.
Les lecteurs d'écran peuvent être utilisés à la fois sur les appareils fixes et mobiles.
Avec un peu de chance, tous les tests d'accessibilité que vous avez effectués vous ont ouvert les yeux ! Dans la partie suivante, nous allons découvrir comment concevoir de manière plus inclusive dès le départ. Du design visuel à l'interaction, pour communiquer vos conceptions accessibles dans les différents équipes.
