Le design inclusif, ou l'accessibilité garantie

Dans un monde où la technologie fait partie intégrante de nos modes de vie, il est essentiel de fournir à chacun des design toujours plus modernes et adaptés.

Chez DropD, l’accessibilité des designs c’est un choix mais surtout une nécessité, du Web au Print, aucun domaine n’est délaissé afin de ne jamais écarter une partie de votre audience.

‍

A qui s’adresse le design inclusif ?

‍

L’accessibilité dans la conception revient à s’intéresser de plus près et à comprendre les différences afin de répondre le plus justement possible au besoin de tous.

En France, près de 10 millions de personnes seraient touchées par un handicap permanent d’après l’INSEE. Ce chiffre plus qu’éloquent informe de l’obligation des designers de s’adapter constamment.

La première étape d’un design accessible consiste à comprendre les enjeux et problématiques de ces utilisateurs.

‍

La malvoyance

Selon l’INSEE, près de 2 millions de Français sont atteints de malvoyance, et l’OMS estime à 253 millions le nombre de malvoyants à l’échelle mondiale.

La malvoyance peut se manifester sous plusieurs formes dont la cécité, l’amblyopie, l’altération du champ visuel ou des couleurs, pour autant de problématiques d’accessibilité.

‍

La déficience auditive

Les personnes malentendantes font également partie des utilisateurs à prendre en compte.

Une publication de la Direction de la Recherche, des Etudes, de l’Evaluation et des Statistiques (DREES) indiquait en 2014 que 10 millions de Français souffraient d’un problème d’audition, soit 16% de la population française.

Les sous-titres et feedback visuels jouent un rôle primordial chez les personnes souffrant de ce handicap.

‍

La défaillance cognitive

La défaillance cognitive se présente sous de multiples formes pour autant de troubles psychologiques. Le principal facteur de déclin cognitif reste l’âge, et c’est 20% des personnes âgées de plus de 65 ans qui présentent des troubles cognitifs légers.

L’OMS estime que 35 millions de personnes souffrent de démence de type Alzheimer à travers le monde, et ce chiffre s’élève à 860 000 personnes en France.

Naviguer dans une interface peut être une épreuve pour les personnes atteintes de dyslexie, de trouble de l’attention ou de la mémoire et c’est en favorisant le pré-remplissage et les illustrations que leur charge cognitive est réduite.

‍

Le handicap moteur

Les déficiences motrices concernent environ 5.8% de la population active d’après une enquête de l’INSEE en 2007.

Les personnes à mobilité réduite peuvent également rencontrer des difficultés lors de leur navigation, comme l’impossibilité d’utiliser une souris. L’accessibilité est alors un critère qui doit être fortement soutenu, il garantit l’équité et l’égalité de tous les utilisateurs. Tous les produits et services numériques d’une entreprise doivent être conçus de manière à ce que les gens puissent utiliser les services mis à leur disposition quelles que soient leurs capacités, leur environnement ou les appareils qu’ils utilisent.

‍

L’âge

Avec le développement d’internet, le spectre des utilisateurs s’agrandit. Une étude de Statista datant de 2018 montre que près de la totalité des Français âgés de 12 à 40 ans se connectent à internet quotidiennement. La moitié des personnes âgées de plus de 60 ans se connecte quotidiennement

Les internautes sont désormais de tous âges et l’accessibilité s’adresse aux plus jeunes comme aux plus âgés.

‍

Savoir s’adapter

‍

L’accessibilité se présente sous de nombreuses formes, et s’adapter à tous les types d’utilisateurs relève souvent du challenge.

Après s’être intéressé aux catégories d’utilisateurs et aux caractéristiques de chacune d’elles, il s’agit de répondre concrètement aux problématiques en utilisant des outils adaptés.

Voici quelques recommandations :

‍

Les couleurs

Si le choix des couleurs est capital, il est important de privilégier le contraste. Au delà de l’importance évidente de la couleur d’un site internet, c’est le contraste, la saturation et les jeux de d’opacité qui le rendront réellement lisible. Il faut toujours garder à l’esprit que certains utilisateurs peuvent souffrir de maladies comme le daltonisme et qu’il est donc nécessaire de se servir des contrastes comme principal moyen de hiérarchisation des informations.

Cependant, si cette hiérarchisation est obligatoire, elle peut se trouver complétée par l’utilisation d’éléments graphiques afin d’accompagner convenablement l’utilisateur dans ses démarches.

Jouer avec les couleurs et les contrastes ne suffit pas non plus, il est aisé de se repérer lorsque notre vue est bonne, mais le temps d’identification des nuances de gris pour une personne ne distinguant pas les couleurs peut s’avérer très long, c’est pourquoi il ne faut pas s’appuyer uniquement sur les couleurs et leur utilisabilité, il va falloir les accompagner d’éléments graphiques.

L’outil contrastchecker est un outil permettant de vérifier que le rapport du constraste est suffisant entre deux couleurs.

Les Web Content Accessibility Guidelines (WCAG) 2.1 sont une liste de recommandations du World Wide Web Consortium (W3C) pour rendre les contenus web plus accessibles. Le W3C est un organisme dont l’objectif est de développer les nouveaux standards du web.

‍

Le niveau AA des WCAG 2.1 préconise un rapport de contraste de 4.5:1 pour les paragraphes et 3:1 pour les textes en gras. Le niveau AAA requiert 7:1 pour les paragraphes et 4.5:1 pour les textes en gras.

L’extension de navigateur NoCoffee vision permet de comprendre les problèmes auxquels font face les malvoyants en simulant une déficience visuelle.

Cette extension couvre la majorité des formes déficiences visuelles ce qui permet de détecter les différents problèmes d’une page web. De la simulation d’une faible acuité visuelle aux problèmes de cataractes, en passant par le contraste, NoCoffee Vision permet également de tester une page selon 8 types de daltonisme ainsi qu’à travers un champ de vision réduit.

‍

L’outil colorPalette de A11Y rocks permet de concevoir une palette de couleur centrée sur l’accessibilité. Les combinaisons de couleurs sont classées selon leur rapport de contraste pour aider à sélectionner celle qui est plus adaptée au contexte.

‍

‍

‍

Les indications

Indiquer les différentes actions via des icônes d’indication est recommandé.
Lorsque l’on remplit un formulaire, dans la majeure partie des cas nous retrouvons une cellule rouge si nous avons oublié de remplir cette dernière, si nous nous sommes tromper d’adresse ou de mots de passe ou encore si nous avons mis des caractères inadaptés. Cette indication par la couleur
ne convient pas à tout le monde, comme par exemple certains cas de daltonisme.

Il est important d’intégrer des indications sur les zones d’interaction de votre site Le code couleur n’est pas suffisant.

‍

La navigation par la voix

Ce système de navigation se démocratise de plus en plus, notamment via nos smartphones ( Siri, Alexa…). Il suffit de parler à son ordinateur ou à son smartphone afin d’avoir un feedback auditif ou visuel sur notre écran.
Prenons l’exemple des malvoyants l’utilisation de la voix comme outil de navigation est impérative. Sans la possibilité de naviguer par la voix, l’utilisateur malvoyant est contraint d’utiliser des services
parfois couteux et pas forcément adapté.

‍

La typographie

Dans le cas de la typographie web, les éléments à prendre en compte sont identiques que sur les autres
médias, en revanche les ressources vont changer pour s’adapter à ses utilisateurs. Il n’est pas suffisant
De s’en tenir à un modèle précis, il y a trop de variables. Il est plus important de savoir à quelle moment
Les utilisateurs ont un impact sur le choix de la typographie et éviter au maximum de rendre les textes
illisibles.

Plus une typographie est simple dans son exploitation mais également dans ses tracés, plus elle sera comprise par la majeure partie des utilisateurs.
Helvetica est l’une des typographie les plus connues, sa modernité et sa simplicité ont forgées son succès.

‍

Le feedback

Dans la majeure partie des cas, votre navigation sur un appareil, qu’il s’agisse de votre ordinateur ou votre smartphone, entraîne des retours visuels, sensitifs et auditifs.

Ces réactions, appelées également “feedback”, sont réfléchis pour aider et correspondre à tous types d’utilisateurs.

• Le feedback sonore est alors un outil majeur pour informer une personne malvoyante lors d’une navigation sur internet.
• Des interventions sonores peuvent être utilisées pour informer l’utilisateur d’une erreur lors d’une manipulation ou pour agréer son action.
• Le feedback visuel, majoritairement utilisé, est un outil indispensable pour accompagner un utilisateur. Plus qu’un guide, il se fond littéralement dans l’interface où il aide à fluidifier la navigation tout en restant imperceptible.
• Le feedback sensitif, présent majoritairement sur mobile, est un moyen de rendre l’expérience de l’utilisateur plus immersive et d’accompagner les autres feedbacks pour un rendu et une expérience plus cohérente.

Ces feedbacks, qu’ils soient envisagés seuls ou réunis, permettent une réduction de la charge cognitive et se servent des sens humains pour rendre l’expérience plus facile et agréable. L’idée étant donc de se servir de code et d’image claire pour aider l’utilisateur tout au long de sa navigation.

‍

La hiérarchisation de l’information

La hiérarchie visuelle garantit la simplicité d’une interface. Cette simplicité peut parfois être indispensable pour certains utilisateurs, notamment pour que l’accès à l’information soit le plus rapide possible. Elle a pour effet de réduire la charge cognitive tout en préservant la lisibilité du contenu, s’adaptant ainsi au plus grand nombre.

La hiérarchisation visuelle est une des lois de la Gestalt, théorie sur les principes de la perception humaine. Cette hiérarchisation permet de catégoriser et de prioriser l’information, de guider l’utilisateur à travers cette dernière, et de créer de véritables points d’intérêts pour l’oeil et ainsi mettre certains éléments en avant.

‍

Pour conclure

‍

Longtemps délaissée, l’accessibilité est une problématique à ne pas négliger. Elle doit désormais se retrouver au cœur de la conception et s’aborder dès le début de celle-ci. Il est beaucoup plus simple de la prendre en compte pendant les processus de création que de l’inclure lorsque ces derniers sont terminés.

Adapter son site web ou son application ne doit plus être vu comme une problématique mais bien comme une véritable valeur ajoutée pour les solutions digitales.