Cet article retrace la conférence de David Renoux, Directeur de Neopixl et responsable de l’offre mobile du groupe Smile et Arnaud Poffé, Senior UX/UI Designer, expert en accessibilité web et mobile chez Neopixl, lors de la première édition de l’UX-Conf – Human First. Cette conférence porte sur l’importance des bonnes pratiques UX d’accessibilité qui doivent constituer la base de toutes UX et comment pousser ces pratiques plus loin en innovant.
L’accessibilité est l’un des piliers du Numérique Responsable : celui consacré à l’inclusivité des services numériques.
L’iPhone a changé complètement la vie de millions de personnes en 2007. En effet, dès sa première sortie, il inclut de nombreuses fonctionnalités ciblant des déficiences visuelles, auditives ou motrices.
Le numérique, les apps, les sites web sont des leviers incroyables de possibilités digitales permettant de pallier des problèmes physiques.
Quelques constats
L’accessibilité coûte un certain prix:
- De +10% à +40% pour une application mobile
- +25% pour un site web
Pourquoi ? Et bien parce que l’accessibilité implique un travail de Design et de développement (environ 50/50). Cela peut donc être perçu pour de nombreuses entreprises comme une contrainte, un frein.
La population est vieillissante et on note que 15 % de la population mondiale sont porteurs d’un handicap. En 2050, on estime qu’il y aurait plus de 2 milliards de seniors (+ de 60 ans) dans le monde contre 962 millions en 2017.
Les déficiences
Petit rappel en image des grandes catégories de déficiences. Il est important de rappeler qu’il existe des solutions digitales pour chacune d’elle.
Quid des normes et de la réglementation
La Loi Européenne oblige le secteur public à se mettre en ordre au niveau AA pour 2025. Tout nouveau projet dans le secteur public doit, dès à présent, prendre en considération cette norme.
Les critères d’acceptation AA sont régis par le WCAG et par le gouvernement du pays. En France, le RGAA est le référentiel des critères d’acceptation minimum.
Attention, les pays ont le droit de repousser les dates d’échéance. La France a repoussé l’année 2025 à 2027 pour une mise à niveau du secteur public.
À partir de 2025, le secteur privé devra aussi se mettre à jour.
Très certainement, le WCAG 3.0 sera en vigueur avec des règles plus strictes que le référentiel 2.1 actuel. Les critères d’évaluation seront aussi revus passant de A, AA, AAA à bronze, silver et gold.
Quelques ressources pour en savoir plus :
Quelles solutions concrètes ?
Il n’y a pas de recette miracle. Chaque cas demandera une appréciation particulière et des tests pour confirmer la mise en place des solutions.
Cependant, il existe des bonnes pratiques communes à chaque projet. L’utilisation de celles-ci vous rapprochera d’un produit accessible et élargira votre audience.
- Le choix de la typographie sera essentiel. Éviter d’utiliser des typographies fantaisistes garantira une facilité de lecture. Pour le corps de texte, on privilégiera une typographie de type, Sans Serif (police sans empattement) Il n’est pas déconseillé d’utiliser une typo Serif (police avec empattement). Il faudra limiter son utilisation pour des titres et des textes courts.
- Les contrastes seront un élément important. En fonction du critère visé, le WCAG donne des recommandations. Cela concerne tous les éléments graphiques mis à disposition de l’utilisateur.
- Pour une norme A, il faudra atteindre un ratio contraste de 3 minimum
- Pour une norme AA, il faudra atteindre un ratio contraste de 4.5 minimum
- Pour une norme AAA, il faudra atteindre un ratio contraste de 7 minimum .
- La hiérarchie de l’information va être un élément important. Une bonne hiérarchie assure une bonne lecture de l’information par tout le monde, surtout par les personnes utilisant un lecteur d’écran.
- Éviter de faire des textes compliqués à comprendre. Faciliter la compréhension de l’information permettra à l’utilisateur de comprendre le message que vous essayez de passer. Certaines personnes ont du mal à comprendre un langage trop compliqué (déficience intellectuelle, pas dans sa langue maternelle). Soyez clair et concis.
- Le WCAG et les différents navigateurs internet utilisant la technologie ARIA. Cette technologie permet d’assurer la transmission de la bonne information et parfois même un complément aux systèmes d’assistance disponibles.
- Les alternatives permettent de décrire des éléments visuels au format textuel. Elles sont très utiles pour les personnes atteintes de déficience visuelle. Attention toutefois à son utilisation abusive. Elles seront seulement essentielles sur des images dites “informatives”. Les images de type décorative n’auront pas besoin d’alternative car elles ne transmettent aucune information et ne sont là que pour faire “joli”.
- L’utilisation de la bonne sémantique est non seulement essentielle pour tous les projets mais encore plus pour assurer une bonne accessibilité. Les systèmes d’assistance vont lire votre le code de haut en bas comme un livre. Il est donc essentiel de faire venir les éléments un par un par ordre de lecture et surtout qu’il soit valide. La validité du code code assure la génération d’un accessibility tree propre et utilisable par les systèmes d’assistance.
Zoom sur l’outil indispensable – Stark
Le principe de l’handicap de situation
Généralement on pense au handicap permanent, celui irréversible et on oublie très souvent le handicap temporaire, comme par exemple, une personne qui s’est cassée le bras, une personne en béquilles ou encore qui a subi une intervention chirurgicale aux yeux, etc.
En tenant compte du groupe d’utilisateurs, il est probable qu’à un moment donné, une partie d’entre eux puisse temporairement avoir un handicap. C’est pourquoi il est essentiel de ne pas les négliger.
Ensuite, il y a le concept de handicap de situation. Une sorte de handicap temporaire très court créé par une déficience artificielle d’une situation dans laquelle la personne se trouve. Par exemple, une personne à vélo ou qui marche dans la rue tout en utilisant son smartphone. Ses facultés cognitives sont alors diminuées, ses gestes probablement aussi (si cette personne tient un sac ou une valise dans ses mains). Un technicien peut être également dans une situation inconfortable, lorsqu’utilise une app de GMAO sur un smartphone, accroupi dans la pénombre pour relever des informations d’un compteur de gaz. Dans tous ces cas, les gestes, l’observation ou encore la concentration sont limitées et les principes de base de l’accessibilité nous permettent de sécuriser une expérience efficace.
Aller plus loin, innover sur ces bases
L’idée de ce chapitre de la présentation est d’aller plus loin : au delà de “sécuriser” l’expérience il s’agit de surenchérir et de pousser la solution encore plus loin pour y trouver en quelque sorte un nouvel usage…
Un usage sans les mains
Exemple de use case :
Situation de handicap artificiel où l’utilisation des mains n’est pas possible, où la saisie clavier est complexe
Directement inspiré de VoiceOver, ici une solution sur le mobile est d’utiliser un assistant vocal qui va permettre de dicter les actions de l’écran et les données à saisir.
Nous avons, par exemple, utilisé cette technique pour des applications industrielles et permettre à des techniciens ou autres opérateurs de dicter les actions qu’ils réalisent. Attention, il ne s’agit pas d’une simple dictée disponible sur n’importe quel clavier de smartphone, mais d’une IA capable de comprendre le langage naturel. Cette IA est entraînée avec des phrases similaires permettant de reconnaître les actions et les données. L’IA répète ensuite en dictant avec une voix de synthèse (reformule) les données saisies et l’utilisateur confirme, encore par la voix, la saisie.
Un usage sans les yeux
Exemple de use case:
Situation de handicap artificiel où l’on doit repérer des détails dans une photo, faire preuve d’une observation accrue…
En partant des solutions de déficiences visuelles, même faibles, on peut imaginer d’augmenter les capacités visuelles de n’importe qui, y compris de quelqu’un qui n’a pas de déficience.
Prenons l’exemple d’un technicien qui installe de la fibre optique. Lorsqu’il intervient dans une armoire technique, il y a des centaines de câbles. En modifiant le branchement d’un câble, il doit s’assurer de ne plier aucune autre, sous réserve de couper la connexion internet d’une autre personne. Compte tenu de l’énorme quantité de câble, cette opération est très délicate, et les erreurs sont fréquentes nécessitant alors des retours sur terrains souvent quelques jours plus tard. Les coûts de chaque erreur sont donc importants. Pour l’éviter il y a l’IA, encore elle ! Elle nous permet d’augmenter d’une certaine façon les capacités visuelles du technicien en analysant une simple photo des câbles et réduisant considérablement les risques en détectant des pliures.
Un usage sans se déplacer
Exemple de use case :
Situation de handicap artificiel où se déplacer n’est pas possible…
Forcément dans ces situations le digital est la solution et quand on pousse la réflexion on pense à la réalité virtuelle ou la réalité augmentée qui permettrait de simuler une situation dans le lieu où on ne peut pas se rendre…
En effet, prenons l’exemple du make up. Essayer un maquillage dans un magasin est une étape clé dans l’achat, mais comment faire si on ne peut pas s’y rendre ou s’ il n’y a tout simplement pas de magasin. Et bien la réalité augmentée permet d’y répondre. C’est une technologie extrêmement mature qu’à vrai dire est aujourd’hui un must pour n’importe quelle app de cosmétique, impossible d’y échapper car toutes les apps le font.
Il y a beaucoup de domaines transposables ou l’analyse vidéo et la réalité augmentée apporte des solutions distantes, par exemple :
- identifier des problèmes d’arythmie, cardio vasculaires etc. grâce à des vidéos selfie
- Le virtual makeup (visage, ongles…)
- Les diagnostiques de la peau
- La réalité augmentée pour visualiser un produit et faire des simulations de placement
Un usage sans lecture
Exemple de use case :
Situation de handicap artificiel où l’on n’a pas le temps de lire des descriptions…
Nous connaissons tous plus ou moins ce cas en situation de mobilité par exemple, le smartphone dans une main, la valise dans une autre. Ici, il est primordial d’aller à l’essentiel et les pictogrammes sont notre meilleur allié : avoir le même aspect visuel à travers le site ou l’app (uniformité), répondre aux principes universels (téléphone, toilettes,…), passer un seul message à la fois et s’adapter à la culture du pays. Alors oui, les pictogrammes sont des outils UX très puissants.
Conclusion
La conférence organisée dans le cadre de l’UX-Conf 2023 sur l’accessibilité met en lumière l’importance de reprendre toutes les bonnes pratiques accessibles comme racines de l’expérience utilisateur.
D’une part, parce qu’elles permettent de répondre à de nombreuses déficiences insoupçonnées des utilisateurs et donc à une proportion importante des nos cibles. D’autre part, parce que certains de nos utilisateurs peuvent se retrouver dans des situations de handicap temporaire ou dites “de situation”, et qu’en respectant les bonnes pratiques, il est possible de leur permettre d’accéder à l’exhaustivité des services.
Même si l’on sent que les normes et les obligations légales vont se durcir à l’avenir en imposant le respect de standards déjà obligatoires dans les services publics, rien ne nous empêche de prendre les devants, cela ne fera qu’élargir le public ciblé et nous rendre plus empathique.
>> Télécharger le support de présentation de la conférence
David Renoux, Managing Director chez neopixl
