Pensez à votre site Web ou application préférés. Qu'est-ce qui en fait votre préféré ? Pensez maintenant à un site Web ou une application que vous n'aimez pas. Qu'est-ce qui vous déplaît ? La façon dont les utilisateurs interagissent avec votre conception et leur expérience sur votre site Web et votre application peuvent varier.
Cette expérience peut changer en fonction de l'heure de la journée, du type d'appareil utilisé, du fait que l'utilisateur ait suffisamment dormi la nuit précédente, qu'il soit malade, qu'il utilise une technologie d'assistance, et bien plus encore. Avec près de huit milliards de personnes dans le monde, les possibilités d'utilisation et d'expérience de vos conceptions sont illimitées.
Conception inclusive
Comment répondre à tous les besoins potentiels des utilisateurs à la fois ? C'est là qu'intervient la conception inclusive. Elle utilise une approche centrée sur l'humain qui combine inclusivité, facilité d'utilisation et accessibilité.
Contrairement à la conception universelle, qui se concentre sur une conception unique que le plus grand nombre de personnes possible peut utiliser, les principes de conception inclusive sont axés sur la conception pour une personne ou un cas d'utilisation spécifique, puis sur l'extension de cette conception à d'autres.
Voici sept principes de conception inclusive axés sur l'accessibilité :
- Offrez une expérience comparable : assurez-vous que votre interface offre une expérience égale à tous les utilisateurs, afin qu'ils puissent effectuer des tâches de manière adaptée à leurs besoins sans compromettre la qualité du contenu.
- Tenez compte de la situation : assurez-vous que votre interface offre une expérience intéressante aux utilisateurs, quelles que soient leurs circonstances.
- Soyez cohérent : utilisez des conventions connues et appliquez-les de manière logique.
- Donnez le contrôle : assurez-vous que les utilisateurs peuvent accéder au contenu et interagir avec lui de la manière qu'ils préfèrent.
- Offrez le choix : envisagez de proposer différentes façons d'effectuer des tâches, en particulier celles qui sont complexes ou non standard.
- Priorisez le contenu : aidez les utilisateurs à se concentrer sur les tâches, les fonctionnalités et les informations essentielles en organisant ces éléments dans l'ordre de leur choix dans le contenu et la mise en page.
- Apportez de la valeur ajoutée : tenez compte de l'objectif et de l'importance des fonctionnalités, et de la façon dont elles améliorent l'expérience des différents utilisateurs.
Personas
Lorsqu'elles développent une nouvelle conception ou fonctionnalité, de nombreuses équipes s'appuient sur des user personas pour les guider tout au long de le processus. Les personas sont des personnages fictifs qui utilisent vos produits numériques, souvent basés sur des études quantitatives et qualitatives des utilisateurs.
Les personas offrent également un moyen rapide et peu coûteux de tester et de hiérarchiser ces fonctionnalités tout au long du processus de conception et de développement. Ils permettent de concentrer les décisions concernant les composants du site en ajoutant une couche de considération du monde réel à la conversation pour aider à aligner la stratégie et à créer des objectifs axés sur des groupes d'utilisateurs spécifiques.
Intégrer les handicaps
"Les gens sont tous différents. Je ne peux parler que de mon expérience. Quand vous rencontrez une personne sourde, vous en avez rencontré une, pas toutes."
Meryl Evans, de la conférence ID24 Deaf Tech: Travel Through Time from Past to Future.
Les personas peuvent être utilisés comme outil de conception inclusive lorsque vous y intégrez des personnes handicapées. Il existe de nombreuses façons de procéder. Vous pouvez créer des personas spécifiques aux handicaps, ajouter des handicaps aux personas d'utilisateurs existants ou même créer un spectre de personas pour refléter la réalité dynamique des handicaps situationnels, temporaires et permanents
Quelle que soit la façon dont vous intégrez des personnes handicapées à vos personas, elles ne doivent pas être basées sur des personnes réelles ni sur des stéréotypes. De plus, les personas ne remplacent jamais les tests utilisateur.
- Nom : Jane Bennet
- Âge : 57 ans
- Lieu : Essex, Royaume-Uni
- Profession : ingénieure UX
- Handicap : tremblements des mains dus à la maladie de Parkinson précoce
- Objectifs : utiliser la saisie vocale pour faciliter l'ajout de suggestions de code ; trouver du matériel de vélo en ligne avec un minimum de frappes.
- Frustrations : sites Web ne prenant pas en charge le clavier uniquement ; applications de conception avec de petites zones d'interaction tactile.
En tant qu'ingénieure UX, Jane conçoit et crée des pages essentielles pour maintenir la pertinence du site de son entreprise. Elle aide de nombreux membres de l'équipe tout au long de la journée. Elle est la reine de la résolution des problèmes techniques, et tout le monde dans le service s'adresse à elle en cas de problème inattendu.
La perte de sa motricité fine due à des tremblements lui rend de plus en plus difficile l'utilisation d'une souris. Elle s'appuie de plus en plus sur le clavier pour naviguer sur le Web. Jane a toujours été très attachée à sa forme physique. Elle aime les courses sur route et le BMX. C'est pourquoi l'annonce de sa maladie de Parkinson précoce l'année dernière a été un coup dur.
Simulateurs de handicap
Soyez extrêmement prudent lorsque vous utilisez des simulateurs de handicap pour émuler ou compléter vos personas.
Les simulateurs de handicap sont une arme à double tranchant, car ils peuvent susciter la sympathie ou l'empathie. Cela peut dépendre de la personne, du contexte dans lequel le simulateur est utilisé et de nombreux autres facteurs incontrôlables. De nombreux défenseurs de l'accessibilité sont opposés à l'utilisation d'outils de simulation de handicap et recommandent de rechercher des films, des démonstrations, des tutoriels et d'autres contenus créés par des personnes handicapées, et de se renseigner sur leurs expériences de première main.
"Je pense que nous devons être tout à fait honnêtes : toute activité de simulation n'a pas d'impact sur certaines des compréhensions les plus importantes que nous voulons que les voyants connaissent dans leur cœur et leur esprit. La cécité n'est pas la caractéristique qui nous définit, mais plutôt les malentendus et les faibles attentes à son sujet qui sont notre plus grand obstacle.
Ces malentendus créent des barrières artificielles qui nous empêchent de participer pleinement, et ces fausses limites se transforment en quelque chose qui nous retient."
Mark Riccobono, président de la National Federation of the Blind.
Heuristiques d'accessibilité
Envisagez d'ajouter des heuristiques à votre workflow lorsque vous créez vos personas et vos conceptions. Les heuristiques sont des règles de conception d'interaction, introduites en 1990 par Jakob Nielsen et Rolf Molich. Ces dix principes ont été développés sur la base de plusieurs années d'expérience dans le domaine de l'ingénierie de la facilité d'utilisation. Ils sont utilisés dans les programmes de conception et d'interaction homme-machine depuis lors.
En 2019, l'équipe de conception de Deque a créé et partagé un nouvel ensemble de heuristiques axées sur l'accessibilité numérique. Selon leurs recherches, jusqu'à 67% de tous les bugs d'accessibilité d'un site Web ou d'une application peuvent être évités lorsque l'accessibilité fait partie du processus de conception. Il s'agit d'un impact considérable qui peut être obtenu avant même d'écrire une seule ligne de code.
Comme pour l'ensemble d'heuristiques d'origine, il existe dix heuristiques d'accessibilité à prendre en compte lors de la planification de votre conception.
- Méthodes et modalités d'interaction : les utilisateurs peuvent interagir efficacement avec le système à l'aide de la méthode de saisie de leur choix (souris, clavier, tactile, etc.).
- Navigation et orientation : les utilisateurs peuvent naviguer, trouver du contenu et déterminer où ils se trouvent à tout moment dans le système.
- Structure et sémantique : les utilisateurs peuvent comprendre la structure du contenu de chaque page et savoir comment utiliser le système.
- Prévention des erreurs et états : les commandes interactives comportent des instructions persistantes, explicites pour éviter les erreurs, et fournissent aux utilisateurs des états d'erreur clairs qui indiquent les problèmes et comment les résoudre chaque fois qu'ils sont renvoyés.
- Contraste et lisibilité : les utilisateurs peuvent facilement distinguer et lire le texte et d'autres informations importantes.
- Langue et lisibilité : les utilisateurs peuvent facilement lire et comprendre le contenu.
- Prévisibilité et cohérence : les utilisateurs peuvent prédire l'objectif de chaque élément. La relation entre chaque élément et le système dans son ensemble est claire.
- Timing et conservation : les utilisateurs disposent de suffisamment de temps pour effectuer leurs tâches et ne perdent pas d'informations si leur temps (c'est-à-dire une session) est écoulé.
- Mouvement et clignotement : les utilisateurs peuvent arrêter les éléments de la page qui bougent, clignotent ou sont animés. Ces éléments ne doivent pas distraire les utilisateurs ni leur nuire d'une autre manière.
- _Alternatives visuelles et auditives_ : les utilisateurs peuvent accéder à des alternatives textuelles pour tout contenu visuel ou auditif qui transmet des informations.
Une fois que vous avez une compréhension de base de ces heuristiques d'accessibilité, vous pouvez les appliquer à un persona ou à une conception à l'aide de la feuille de travail sur les heuristiques d'accessibilité et en suivant les instructions fournies. Cet exercice est plus instructif lorsque vous recueillez plusieurs points de vue.
Voici un exemple d'examen heuristique de l'accessibilité pour le point de contrôle de la navigation et de l'orientation :
| Points de contrôle pour la navigation et l'orientation | Excellent (+2 pts) | Réussi (+1 pt) | Échec (-1 pt) | N/A (0 pt) |
|---|---|---|---|---|
| Un indicateur clair et visible est-il défini sur tous les éléments actifs lorsqu'ils sont sélectionnés ? | ||||
| La page comporte-t-elle un texte de titre explicite, avec des informations spécifiques à la page en premier ? | ||||
| L'élément de titre de la page et le H1 sont-ils identiques ou similaires ? | ||||
| Chaque section principale comporte-t-elle des titres explicites ? | ||||
| L'objectif des liens est-il défini à partir du texte du lien seul ou de son contexte immédiat ? | ||||
| Un lien d'accès rapide est-il fourni tout en haut de la page et est-il révélé lors de la sélection ? | ||||
| L'organisation des éléments de navigation facilite-t-elle l'orientation ? |
Une fois que tous les membres de l'équipe ont examiné la page ou le composant et effectué leur examen heuristique de l'accessibilité, les totaux sont calculés pour chaque point de contrôle. À ce stade, vous pouvez décider comment résoudre les problèmes détectés ou corriger les omissions essentielles pour prendre en charge l'accessibilité numérique.
Annotations d'accessibilité
Avant de transmettre votre conception à l'équipe de développement, vous devez envisager d'ajouter des annotations d'accessibilité.
En général, les annotations permettent d'expliquer les choix créatifs et de décrire différents aspects de la conception. Les annotations d'accessibilité se concentrent sur les domaines dans lesquels les développeurs peuvent faire des choix programmatiques plus accessibles avec les conseils de l'équipe de conception ou d'un spécialiste de l'accessibilité.
Les annotations d'accessibilité peuvent être appliquées à n'importe quelle étape du processus de conception, des maquettes fonctionnelles aux maquettes haute fidélité. Elles peuvent inclure des flux utilisateur, des états conditionnels et des fonctionnalités. Elles utilisent souvent des symboles et des libellés pour simplifier le processus et maintenir la conception comme objectif principal.
Les exemples d'illustrations de conception suivants proviennent de Indeed.com's kit d'annotations d'accessibilité pour Figma.
Selon votre programme de conception, vous devriez avoir le choix entre plusieurs kits de démarrage d'annotations d'accessibilité. Si vous préférez, vous pouvez créer votre propre ensemble. Dans les deux cas, vous devez déterminer quelles informations doivent être communiquées à l'équipe de transfert et quel format est le plus adapté.
Voici quelques domaines à prendre en compte pour les annotations d'accessibilité :
- Couleur : incluez les rapports de contraste de toutes les combinaisons de couleurs de la palette.
- Boutons et liens : identifiez les états par défaut, survolé, actif, sélectionné et désactivé.
- Liens d'accès rapide : mettez en évidence les aspects de conception masqués et visibles, ainsi que leur destination sur la page.
- Images et icônes : ajoutez des recommandations de texte alternatif pour les images et icônes essentielles.
- Audio et vidéo : mettez en évidence les zones et les liens pour les sous-titres, les transcriptions et les descriptions audio.
- Titres : ajoutez des niveaux programmatiques et incluez tout ce qui ressemble à un titre.
- Repères : mettez en évidence les différentes sections de la conception avec HTML ou ARIA.
- Composants interactifs : identifiez les éléments cliquables, les effets de survol et la zone de sélection.
- Clavier : identifiez l'endroit où la sélection doit commencer (arrêt alpha) et l' ordre de tabulation suivant.
- Formulaires : ajoutez des libellés de champ, du texte d'aide, des messages d'erreur et des messages de réussite.
- Noms accessibles : identifiez comment la technologie d'assistance doit reconnaître l' élément.