Qu’est-ce que ça veut dire ? Pourquoi faire ? Comment le mettre en place ?🤔
Auteur
Manu
Lead designer
Publié le
13 juin 2023
Catégorie
NUMÉRIQUE RESPONSABLETout d’abord, qu’est-ce que le RGAA ? Sous son acronyme un peu barbare se cache une notion simple : rendre les sites et les services numériques accessibles à tous. Autrement dit, rendre les produits digitaux compréhensibles et utilisables par tous, notamment les utilisateurs en situation de handicap.
Les utilisateurs peuvent en effet être atteints de différents troubles comme des troubles visuels (daltonisme, malvoyance…), des troubles moteurs (difficulté ou impossibilité d’utiliser un clavier ou une souris…), des troubles du langage ou encore des troubles auditifs.
Le référentiel général d’amélioration de l’accessibilité (RGAA) comporte donc un ensemble de règles (106 au jour de l’écriture de cet article, pour être précis 🤓) à appliquer lors de la conception de son produit digital (site internet, application mobile…) pour s’assurer qu’il peut être utilisé par le plus grand nombre.
Au delà de s’adresser uniquement à des utilisateurs en situation de handicap, le respect de ces règles peut également bénéficier à tous vos utilisateurs grâce à des principes de contrastes, de lisibilité et de hiérarchie des informations. Mais on va y revenir juste en dessous. 👇
Il est bon, avant de parler de bonnes pratiques concrètes à appliquer dans la conception de son site ou de son application mobile, de préciser que ces règles d’accessibilité concernent dans leur implémentation aussi bien les designers que les développeurs. En effet, si certains points doivent être anticipés directement à l’étape de la création des maquettes de l’interface (on en parlait déjà dans cet article sur quelques règles du design d’interface), d’autres devront être abordés dans leur intégration technique.
Voici une liste (non exhaustive) de quelques points qui nous semblent particulièrement importants à mettre en place :
Assurez-vous d'utiliser des combinaisons de couleurs offrant un bon contraste entre le texte et l'arrière-plan pour une meilleure lisibilité. Dans le même esprit, faites attention à la taille de la typographie utilisée pour l’affichage de vos textes. Une police trop petite peut rendre le texte compliqué à lire ou plus simplement fatiguer les yeux du lecteur. Au contraire, une typographie trop grande peut rendre la lecture confuse.
Une règle fondamentale de l’UI Design est de faire correspondre les couleurs des différents éléments interactifs de votre produit avec l’interaction qu’il y a derrière. Pour résumer : un élément positif sera généralement en vert et un élément négatif en rouge. Mais il est important de se rappeler que tout le monde ne perçoit pas les couleurs de la même manière ! Un utilisateur daltonien (et il n’y a d’ailleurs pas qu’un seul type de daltonisme) aura du mal à s’y retrouver si les messages sont communiqués uniquement par la couleur. Pensez donc à lier des éléments textuels clairs à chacune de vos interactions.
Organisez le contenu de manière claire et cohérente en utilisant des en-têtes et des sous-titres appropriés. Cela facilite la navigation et la compréhension pour les utilisateurs, en particulier ceux qui utilisent des lecteurs d'écran.
Concevez une navigation facile à utiliser, en fournissant des menus déroulants, des liens clairs et des indications visuelles pour aider les utilisateurs à se déplacer dans votre site ou application. Assurez-vous que la navigation soit également accessible au clavier.
Pour les images, utilisez des descriptions alternatives (attributs alt) qui décrivent le contenu de l'image de manière concise et pertinente. Cela permet aux utilisateurs ayant une déficience visuelle d'accéder à l'information véhiculée par les images.
Assurez-vous que les formulaires soient bien structurés avec des étiquettes claires et des indicateurs d'erreur appropriés. Les contrôles interactifs, tels que les boutons et les menus déroulants, doivent être facilement utilisables au clavier et compatibles avec les technologies d'assistance.
Concrètement, comment savoir si notre site ou notre application est accessible ? On vous parlait plus tôt dans cet article des 106 critères du RGAA à respecter. A chaque critère est associé différents tests permettant de le valider ou non.
Prenons un exemple simple avec un critère dans la catégorie “Couleur”. Selon le critère 3.1 du RGAA : “Dans chaque page web, l’information ne doit pas être donnée uniquement par la couleur”. Il existe ici 6 tests différents pour s’assurer que ce critère est bel est bien respecté. Il nous suffit donc de parcourir notre site ou application mobile et d’appliquer la méthodologie correspondante à chaque test.
Pour notre exemple, si on se réfère au test 3.1.1, nous devons nous assurer que : “Pour chaque mot ou ensemble de mots dont la mise en couleur est porteuse d’information, l’information ne doit pas être donnée uniquement par la couleur”.
La méthodologie de ce test est la suivante :
Retrouver dans le document les informations données par la couleur dans un mot ou un ensemble de mots ;
Pour chacune de ces informations, vérifier qu’il existe un autre moyen de récupérer cette information (présence d’un attribut title, d’une icône ou d’un effet graphique de forme ou de position, un effet typographique…) ;
Si c’est le cas pour chaque information, le test est validé.
C’est ce processus qui est appliqué sur la majorité des sites et applications conçus et développés chez Uxer. Des audits externes peuvent même être demandé par nos clients pour s’assurer de la conformité de leur produit.
Ça a été le cas par exemple avec Cdiscount, pour qui nous avons travaillé à la refonte de leur site dédié à l’emploi. Et plus récemment encore avec le groupe Ociane Matmut, pour lequel l’audit réalisé a démontré un taux de conformité d’environ 75% sur l’ensemble de l’application développée.
Au delà des chiffres, critères et méthodologies de tests, il est important de se rappeler que tout ce travail a pour but de lutter contre les discriminations des personnes handicapées et de créer des sites et applications mieux conçus et plus utilisables, pour tous.
Découvrez un autre article
Le terme ne vous parle peut-être pas, ou vous en avez entendu parler, mais vous vous demandez clairement de quoi il s’agit. Et pourtant, il s’agit d’une étape très importante dans le processus de création ou de refonte de votre produit ou site internet.