Accessibilité : état des lieux

Chez UX-Republic, nous rencontrons toujours de nouvelles têtes. En l’occurrence, une mission chez Ipedis nous a donné l’opportunité de collaborer avec des experts en accessibilité. Voici notre retour d’expérience, ce que l’on a pu approfondir ou découvrir grâce à Moïse Akbaraly, Jonathan Chiche, Aïda Djemel, Sarah Guenkine et Sébastien Lopes !
GIF hello

L’accessibilité, quésaco ?

En France, on compte environ 20% de personnes touchées par un handicap permanent. Cette proportion double si l’on y inclut les personnes touchées par un handicap temporaire. (LE WEBZINE OKEENEA, 2015)
L’accessibilité numérique concerne 4 grandes catégories de handicap faisant appel à différentes technologies d’assistance.

  • Visuel : les personnes atteintes de cécités ou d’un handicap visuel peuvent naviguer sur les supports numériques à l’aide de lecteurs d’écran.
  • Physique : les personnes à mobilité réduite ne peuvent majoritairement pas se servir de la souris. Elles utilisent des claviers adaptés ou des claviers classiques en s’aidant du “focus” – petit encadré montrant les actions possibles sur une interface – pour naviguer et interagir sur la page.
  • Auditif : les personnes ayant une déficience auditive ont, pour certaines, un problème d’élocution et de compréhension écrite. Les problèmes rencontrés sont principalement liés à des supports vidéo ou vocaux. Il s’agit alors de proposer des alternatives de contenu (sous-titres sur une vidéo, retranscription écrite, etc.)
  • Cognitif : les personnes atteintes d’une défaillance cognitive (troubles de l’attention, de la mémoire, de la réflexion et de la perception) ont besoin d’aides à la consultation et à la navigation, que ce soit via support humain ou une technologie d’assistance.

Il convient de souligner que le respect des normes permet également une amélioration considérable de la consultation des sites et applications, ainsi que de l’expérience utilisateur de tous sur le Web. (IPEDIS, 2016)

Qui est responsable de l’accessibilité ?

GIF on vous surveille36% par les équipes éditoriales
ex. webmasters, chargés de communication
59% par les équipes techniques
ex. développeurs
18% par les équipes graphiques
ex. designers UX, designers UI
(IPEDIS, 2016)

Et concrètement, comment ça se passe ?

Sébastien Lopes, expert non-voyant chez Ipedis, nous a montré et expliqué comment il travaillait, ses points de frictions, mais aussi les bonnes pratiques à mettre en place.
Les personnes atteintes de cécité ou d’une déficience visuelle sont les plus concernées par l’accessibilité numérique. Elles naviguent  principalement à l’aide d’un lecteur d’écran et, potentiellement d’une plage braille. Sébastien utilise ces deux technologies d’assistance.
Les technologies d’assistance font la transition entre le code source et l’utilisateur. Elles permettent de naviguer convenablement sur un appareil numérique et un site web.
Fonctionnement technologie d'assistance

(IPEDIS, 2016 : 12)

LECTEUR D’ÉCRAN

Capture d'écran VoiceOverUn lecteur d’écran est un logiciel de synthèse vocale qui énonce chaque élément affiché à l’écran.
Quelques uns des lecteurs d’écran les plus courants :
JAWS (Job Access With Speech, payant) sur PC
NVdA (NonVisual desktop Access, gratuit) sur PC
VoiceOver intégré nativement sur MAC
Ces logiciels allient une navigation intégralement clavier – l’utilisation de la souris est remplacée par des raccourcis clavier et des outils propres au lecteur d’écran – ainsi qu’une vocalisation de chaque élément sur lequel l’utilisateur passe. L’utilisateur peut percevoir l’intitulé des différents éléments, comprendre la structure hiérarchique et la nature de ceux-ci, et anticiper leur fonction.
Il est à noter qu’un lecteur écran vocalise chaque élément en fonction de son intégration dans le code source et non dans l’ordre d’apparition à l’écran. De même, le curseur de la navigation clavier se déplacera en fonction de l’ordre d’intégration des éléments.
L’utilisateur a la possibilité de régler la vitesse de lecture de l’écran. L’habitude aidant, l’utilisateur navigue très rapidement : les mots ont à peine le temps d’être vocalisés par la technologie d’assistance qu’il est déjà sur le contenu suivant. Si le site n’est pas accessible, ces personnes ne retiendront pas les informations importantes et quitteront tout simplement votre site. C’est dur… On sait.
GIF c'est dur on sait

PLAGE BRAILLE

Photo d'une plage brailleUne plage braille est une tablette comportant un certain nombre de cellules composées de points Braille amovibles, pouvant se lever ou s’abaisser, pour former une lettre. Elle apporte un affinage du contenu par rapport au lecteur d’écran seul (mauvaise prononciation d’acronymes, noms à consonances étrangères, orthographe exacte d’un mot).
L’exploitation de tableaux devient plus aisée avec le Braille qu’avec une synthèse vocale. La plage permet de lire une cellule du tableau, de visualiser mentalement les différentes en-têtes et structures des éléments.
Ce support peut être optionnel lors d’une navigation lambda, un complément à la synthèse vocale. En revanche, dès qu’il s’agit de contenu plus technique ou pointu, une plage Braille devient indispensable.

Les critères d’accessibilité primordiaux

Il existe 3 niveaux d’accessibilité donnés par le RGAA (IPEDIS, 2016 : 6) :

  • A. Site conforme à 100% au regard des critères d’accessibilité concernés.
  • AA. Site optimisé pour améliorer le confort de consultation des utilisateurs.
  • AAA. Niveau requis pour les sites dont les utilisateurs sont en situation de handicap.

Ci-dessous, une liste des critères d’accessibilité incontournables.
Critères d’accessibilité incontournables

(IPEDIS, 2016 : 17-18)

En somme, ce sont des habitudes à prendre afin de proposer un contenu adapté à chacun.

QUELQUES POINTS DE FRICTIONS
  • Limite des lecteurs d’écran
    Certains éléments peuvent ne pas être correctement détectés, voire pas du tout. Par exemple, un tableau de mise en forme ou une vidéo non-identifiée disparaîtra du contenu et de la navigation de l’utilisateur atteint de cécité.
  • Navigateur
    Internet Explorer et Firefox restent, encore aujourd’hui, les meilleurs navigateurs pour les technologies d’assistance. On peut noter que Google Chrome améliore de plus en plus sa compatibilité avec les technologies d’assistance.
  • Smartphone
    Seuls les iPhone sont munis nativement d’une technologie d’assistance : VoiceOver. Pour les Android, TalkBack fonctionne bien. Toutefois, la diversité des systèmes Android ne favorise pas la compatibilité et la navigation peut rapidement devenir complexe.
  • Interface commune : l’exemple du guichet automatique
    Les guichets de banque automatique sont munis de prise audio pour que les utilisateurs non-voyants entendent les instructions en privé. Initiative louable, mais des écouteurs coupent une personne non-voyante de son environnement direct. Une assistance humaine est souvent nécessaire pour contourner un sentiment d’insécurité inévitable.
  • Contenu graphique ou photographique à lire
    Chaque image doit être identifié dans le code à l’aide d’une “alternative” (alt) limitée à 256 caractères. Un lecteur d’écran vocalisera de base cette alternative. Afin d’apporter des précisions dans la description du contenu visuel, il est possible d’ajouter une description longue (longdesc) dans le code source.
  • Contenu graphique ou photographique à partager
    Choisir une photo de profil ou un contenu photographique à partager est aujourd’hui quasi-impossible sans une assistance humaine. Une technologie d’assistance liée à l’intelligence artificielle serait-elle à envisager dans un futur proche ?

Pour conclure

Aujourd’hui, nous sommes encore loin d’une majorité de sites accessibles. Nombreux sont les sites web optimisant une expérience autour d’une catégorie d’utilisateurs. Les personnes en situation de handicap se retrouvent souvent délaissés, prises en compte en toute fin de projet lorsqu’il s’agit de valider légalement un niveau d’accessibilité.
Les entreprises se sont vues contraintes à faire des efforts en termes d’accessibilité numérique depuis l’entrée en vigueur de la loi 2005-102. Nous pouvons profiter de cette ouverture. Les designers ont la capacité de jouer un rôle clef afin d’amener l’accessibilité à chaque étape du projet, et que cela devienne une habitude. Une évangélisation autour de cet aspect doit être faite.
GIF acquiescement
Qui sont les utilisateurs ? Comment les aider à naviguer normalement ? Quelles sont leurs habitudes de navigation et de navigateur ? Quelles sont les contraintes technologiques ?
Il est primordial de prendre en compte l’accessibilité dès le début du projet, de penser nos interfaces avec un persona supplémentaire en tête, touché directement par l’accessibilité. Si un argument pratico-pratique peut vous convaincre : un site conçu en accessibilité coûte 20% plus cher, en revanche rendre un site non-accessible accessible coûte 100% plus cher. Ce sont des réflexes à mettre en place, on finira par faire évoluer l’accessibilité de nos sites au fur et à mesure.
On en profite : merci à l’équipe Ipedis pour leur accueil et leur partage de connaissances !
GIF de remerciement
Charlotte Boquet, UX-Evangelist @UXRepublic
Manon Campait, UX-Activist @UXRepublic
Pour en savoir plus sur l’accessibilité
L’UX FACE À L’ACCESSIBILITÉ de Stéphane Chilton

Sources
IPEDIS (2016), Livre blanc de l’accessibilité numérique, 59 pages.
LE WEBZINE OKEENEA (2015), “Handicap : quoi, qui et combien ?