Universell Utforming

Conception Universelle

Comment la conception inclusive peut-elle offrir plus de clients et une meilleure satisfaction client ?

Cecilie Dahl

Cecilie Dahl
Partner | Senior Rådgiver

cecilie@vidi.no
92878350

Le design inclusif

L’accessibilité, la conception inclusive et la conception universelle sont notre responsabilité

Saviez-vous que la proportion de personnes ayant une bonne vue, une bonne audition et une bonne mobilité, qui savent lire et écrire sans problèmes, qui peuvent effectuer plusieurs tâches efficacement et qui sont fonctionnelles à tout moment est d’environ 50% de la population?

Les autres portent des lunettes ou sont daltoniens, ont les poignets cassés ou des otites, vivent dans des environnements bruyants ou ont une mauvaise connexion Internet, sont en déplacement ou sont occupés, sont dyslexiques ou ont un trouble de déficit de l’attention, etc.

Cela signifie qu’environ la moitié de nos utilisateurs peuvent avoir des difficultés à utiliser nos produits ou à naviguer sur nos sites Web, ou qu’ils sont même totalement incapables d’interagir avec eux. Si nous n’incluons pas cela dans le calcul, nous risquons de rater l’occasion d’augmenter la satisfaction des utilisateurs et d’élargir notre groupe cible. Assez inquiétant?

Et si je vous disais que nous pouvons améliorer les interactions et l’expérience utilisateur globale simplement en mettant en œuvre quelques principes simples dans la phase de conception? Après tout, concevoir en gardant à l’esprit la plupart des défis peut offrir de la valeur à tout le monde, nous appelons cela la conception inclusive ou la conception universelle.

Réfléchir à la façon d'améliorer une situation pour un petit groupe de personnes améliore l'expérience positive pour un éventail beaucoup plus large de personnes.- Mike Miles'sAssociate Director of PHP in Genuine

Qu’est-ce que la conception universelle / la conception inclusive?

La conception universelle et la conception inclusive évaluent un grand nombre de besoins et de capacités des personnes, elles ne visent pas uniquement les personnes handicapées. Elles reconnaissent que nos besoins changent avec le temps et les circonstances, donc cela présuppose des erreurs, des défis et différentes façons d’interagir. Elles visent à résoudre les problèmes avant qu’ils ne surviennent, à améliorer la qualité et à modifier les normes pour une bonne conception de produits.

Le résultat est une interface utilisateur inclusive, empathique, consciente et accessible. Elle peut être utilisée confortablement par différents groupes de personnes présentant des caractéristiques différentes telles que l’âge, le sexe, l’éducation, la situation financière et les capacités, qui vivent ou travaillent dans des environnements différents et ont différents niveaux d’accès à la technologie.

L’accessibilité est le Saint Graal de la conception inclusive, donc dans cet article, nous utiliserons POUR comme référence pour créer des interactions simples, sans effort et rapides entre un utilisateur et une interface.

pour

POUR signifie:

Perceivable (Perceptible): le contenu numérique peut-il être interprété ou traité facilement et de différentes manières?

Operable (Exploitable): le produit numérique peut-il fonctionner et être contrôlé facilement et sans confusion?

Understandable (Compréhensible): un utilisateur peut-il comprendre le fonctionnement de l’interface et les informations présentées?

Robust (Robuste): le produit numérique est-il compatible avec diverses technologies / logiciels et appareils d’assistance?

Chacun de ces différents principes a une cote de réussite de A, AA ou AAA. Une note A est la condition minimale pour avoir un site Web accessible, et AAA est la norme d’or pour l’accessibilité.

Comment les designers peuvent-ils aider?

En tant que Designers, bien sûr, nous ne pouvons pas contrôler tout ce qui précède au même degré. Mais – nous devons reconnaître que bon nombre des problèmes d’accessibilité rencontrés par les gens sont causés par des décisions fondées sur l’ignorance du sujet qui a été prise lors de la phase de conception. Il existe de nombreuses opportunités pour nous, designers, si nous voulons faire la différence. Voici quatre types d’expériences sur lesquelles nous pouvons influencer (améliorer ou aider) simplement en prenant des décisions de conception plus intelligentes.

Expérience visuelle: cela inclut les formes, les couleurs, les contrastes, les styles de texte – tous les éléments graphiques de l’interface du produit.

Expérience auditive: il s’agit des sons produits lorsqu’ils interagissent avec le produit, leur volume et leur clarté.

Expérience cognitive: elle décrit le temps qu’un utilisateur passe à interpréter l’interface et combien d’attention et de force mentale sont nécessaires pour l’utiliser.

Expérience motrice: Cela comprend toutes les actions et tous les mouvements nécessaires pour effectuer une tâche ou interagir avec le produit.

Passons en revue chacune de ces expériences et voyons quelles petites décisions de conception ont un grand impact.

Améliorez l’expérience visuelle

Icônes pour malvoyants

Couleur et Contraste

Le contraste est la différence de luminosité ou de couleur qui permet à un objet de se démarquer de l’environnement et peut avoir un effet dramatique sur la lisibilité. Le contraste élevé permet aux éléments visuels de se démarquer de l’arrière-plan et de devenir plus visibles et lisibles.

Action

Utilisez un contraste élevé pour améliorer la clarté visuelle et la lisibilité afin que les utilisateurs puissent faire défiler en douceur. Pour la copie, un rapport de contraste d’au moins 4: 5: 1 est nécessaire pour obtenir une note AA acceptable et un rapport de contraste de 7: 1 pour obtenir une note AAA dorée. L’outil  Webaim nous aide à tester des systèmes de couleurs entiers pour la disponibilité du contraste.

Conseil: Un pur # 000000 noir sur blanc peut créer un contraste sévère pour les yeux et même affecter les personnes dyslexiques. C’est pourquoi nous avons tendance à l’éviter et à opter pour un gris foncé à la place.

Luminosité

La luminosité décrit le niveau de lumière provenant d’une source ou la quantité de lumière réfléchie par une surface. Les couleurs vives reflètent plus de lumière et peuvent interférer avec notre capacité à lire et à traiter les informations.

Action

Évitez d’utiliser des couleurs vives sur les arrière-plans ou les grandes surfaces. N’utilisez pas de couleurs vives sur le texte ou à proximité car cela distrait.

Si le client / la marque demande une couleur de luminosité spécifique, essayez de suggérer une alternative saturée ou plus foncée.

Si vous devez absolument utiliser une couleur claire, minimisez son utilisation pour mettre en évidence les actions et associez-la à des teintes plus foncées pour un équilibre et un contraste élevé.

Conseil: toute couleur contenant plus de 50% de jaune réfléchit naturellement plus de lumière. Cela signifie que les teintes jaune, orange, verte et froide sont des couleurs à haut risque et doivent être utilisées avec prudence.

Daltonisme

Le daltonisme est l’incapacité de distinguer des couleurs spécifiques – généralement le rouge et le vert, parfois la lumière bleue – et il est plus courant que vous ne le pensez. Il affecte environ 1 homme sur 12 (8%) et 1 femme sur 200 (0,5%), selon Colourblindawareness.org. Cela signifie qu’environ 8 personnes sur 100 voient nos créations différemment des attentes.

Visions des couleurs

Action

Test de sensibilisation et de couleur. Espérons qu’il existe des outils en ligne qui peuvent nous aider à choisir des combinaisons de couleurs et à les comparer à différentes conditions de daltonisme. Un de mes favoris personnels est coolors.co. (Cliquez sur l’icône en forme d’œil en haut à droite pour voir une palette de couleurs à travers l’objectif dans différentes conditions). Un autre moyen de vérifier le daltonisme est un outil appelé Color Oracle. Color Oracle utilise un filtre de couleur plein écran avec la possibilité de choisir entre différentes conditions allant de la deutéranopie, qui est la condition de daltonisme la plus courante, à l’achromatopsie qui est très rare.

Conseil: ne vous fiez pas uniquement aux couleurs; La couleur ne doit pas être le seul moyen de communiquer des messages importants. Voici ce que vous pouvez faire:

  • Utilisez le soulignement pour les liens et l’italique ou le gras pour mettre en évidence le texte
  • Utilisez des icônes avec du texte pour communiquer le succès ou l’échec
  • Appliquer une texture ou des motifs aux graphiques
  • Utilisez un style visuel clair pour les boutons ou les alertes importantes avec un style de police différent pour la mise au point ou les états actifs

Typographie

Sélection de police

La communication est l’objectif le plus important de chaque produit numérique et peut être atteinte grâce à la typographie et à une application appropriée. Le contenu doit être à la fois lisible et lisible, ce qui signifie être facilement reconnu et interprété, scanné et traité sans aucun problème.

Action

La simplicité et la clarté sont essentielles pour une numérisation et une interprétation rapides, évitant les polices détaillées ou complexes car elles ne fournissent que du bruit visuel. Choisissez la bonne famille de polices avec des formes clairement définies et de forme unique afin que les personnes ayant une vision limitée ou une dyslexie puissent la lire. Ce groupe d’utilisateurs peut être dérouté par certains caractères ou leurs combinaisons. Une police avec une grande hauteur x améliorera la lisibilité en créant plus d’espace pour les petits caractères. Enfin, les polices trop étroites ou condensées avec un crénage dense doivent être évitées, car leurs caractères peuvent sembler confus et plus difficiles à distinguer.

Conseil: choisissez la bonne police en vérifiant les caractères et combinaisons de caractères les plus problématiques. Assurez-vous que des lettres similaires comme «a» «e» et «c», «b» et «d», «i» et «l» ou «y» «g» et «q» sont très différentes et que Les combinaisons «rn», «oj» et «ln» sont clairement séparées.

Taille de police

Saviez-vous que la plupart des gens portent des lunettes ou des lentilles de contact? C’est en fait plus de 6 sur 10!

Environ 62% des personnes ont accès à Internet depuis leur téléphone mobile. Qu’est-ce qui pourrait mal tourner lorsque des personnes ayant une vision limitée utilisent la technologie sur un petit écran lors de leurs déplacements …?

Action

Utilisez des tailles de police plus grandes. En règle générale, 16px plus est considéré comme le plus inclusif, mais sachez que les polices peuvent être à différentes échelles et que leurs tailles peuvent varier énormément. Ne descendez jamais en dessous de 14 pixels. En fait, la plupart des sites Web modernes utilisent des polices 18px pour le corps et 14px ou 16px uniquement pour les légendes ou les info-bulles.

Conseil: évitez d’utiliser des polices fines et claires, car elles peuvent être difficiles à lire pour des polices plus petites ou sous une lumière vive.

Format de section

Aider les gens à scanner facilement le contenu devrait être notre objectif principal, puisque seulement 20% des gens lisent le contenu et 55% d’entre eux le parcourent rapidement. Notre travail consiste à soutenir les gens autant que possible en utilisant des formats de paragraphe confortables.

Actions

Les recherches indiquent que la longueur de ligne moyenne pour prendre en charge la lisibilité est d’environ 70 caractères, espaces compris. Les titres, sous-titres et puces aideront à numériser et à aligner le paragraphe de gauche rendra le texte plus facile à lire (pour le monde occidental). Les longs murs avec du texte ont beaucoup moins de chances de garder les gens engagés. Les paragraphes réussis ne comptent pas plus de cinq ou six phrases sans exciter 200 caractères.

Les espaces blancs aideront les personnes atteintes de troubles cognitifs et d’attention à rester concentrées sur la lecture. En passant, cela rend la lecture plus confortable et fluide. Selon WCAG, la meilleure pratique consiste à définir la hauteur de ligne (espaces entre les lignes) à 1,5 par rapport à la taille du type. La distance entre les paragraphes doit également être au moins 1,5 fois supérieure à l’interligne, afin qu’ils soient clairement définis.

Conseil: l’espacement des lignes ne doit pas dépasser 2,0, car il peut avoir l’effet inverse et distraire les lecteurs.

Bonus: il existe un outil qui vaut la peine d’être vérifié, appelé Golden Ratio Typography (GRT), qui utilise le nombre d’or pour déterminer des proportions typographiques précises telles que les tailles de police, les hauteurs de ligne et les distances associées pour des résultats plus équilibrés visuellement.

Copie de la mise en page

En tant que Designers, nous tombons souvent dans le piège de la conception de nos mises en page pour les rendre convaincantes ou uniques, et mettons la facilité d’utilisation de côté. C’est pourquoi nous voyons des tendances telles que des parties du texte chevauchant une image ou un texte sur un arrière-plan multicolore ou structuré. Nous pouvons encore profiter de certaines de ces tendances tant que nous savons comment et quand les utiliser.

DesignUU

Action

Lorsque vous utilisez du texte sur un arrière-plan coloré ou texturé, nous devons nous assurer que le contraste de couleur entre eux est suffisamment élevé tout en étant cohérent sur la zone de chevauchement – ce qui signifie qu’il n’est pas plus clair avec des zones plus sombres sous la copie ou que trop de détails dérange . Des tailles de police plus grandes et des poids de police plus lourds augmenteront également le contraste.

Conseil: comme toujours, «connaissez votre utilisateur». La mise en page géniale n’est pas pour tout le monde.

Amélirorez l’expérience auditive

Expérience auditive

Vous vous demandez peut-être comment la conception visuelle peut-elle affecter l’expérience auditive? Imaginez avoir une conversation avec un ami dans un club. Je parie que vous pouvez entendre la moitié de ce qu’elle dit, mais vous pouvez poursuivre la conversation simplement en regardant ses lèvres en mouvement, son langage corporel et ses expressions faciales. Les visuels soutiennent et / ou amplifient les sons ambigus pour que vous en trouviez le sens.

Dans une interface utilisateur, les sons peuvent signifier un certain nombre de choses pour différentes personnes. Ils peuvent également être facilement perdus dans un arrière-plan bruyant, il est donc bon de les soutenir avec des repères visuels.

Actions

Notre objectif devrait être de fournir des commentaires avec des signaux sonores et visuels, des messages d’erreur de soutien, des alertes et des interactions significatives avec des éléments graphiques pertinents et proches tels que des info-bulles et des messages. Nous devons également nous assurer que les signaux visuels restent actifs assez longtemps pour que les gens puissent les voir et les lire, sans cacher de contenu significatif.

Une bonne pratique – qui ne se limite pas à la prise en charge des technologies d’amélioration audio – consiste à ajouter des étiquettes descriptives aux éléments de l’interface utilisateur et des légendes aux images pour faciliter la navigation via les lecteurs d’écran. L’utilisation de sous-titres pour les vidéos est un autre moyen d’améliorer l’expérience d’écoute, également utile pour les locuteurs non natifs.

Enfin, il ne faut pas oublier les cas où le son est le problème, c’est pourquoi nous avons besoin d’une alternative visuelle. Certaines personnes peuvent être sensibles à des sons spécifiques ou se trouver dans une situation où les sons peuvent provoquer une perturbation. Ensuite, il est recommandé de donner aux gens la possibilité de couper les sons sans avoir à augmenter le volume de leurs haut-parleurs, ce qui rend cette fonction visible et sans effort.

Conseil: évitez d’utiliser des sons et de la musique en lecture automatique inutiles, car ils peuvent déranger ou même effrayer les gens.

Améliorez l’expérience cognitive

Expérience Cognitive

Perception

Clarté visuelle

La clarté est le premier et le plus important attribut d’une interface utilisateur. Une interface utilisateur réussie permet aux utilisateurs de reconnaître et d’interpréter ce qu’ils voient, de comprendre la valeur du produit et les actions disponibles, de prédire ce qui se passera lorsqu’ils l’utiliseront et d’interagir avec succès. Il n’y a pas de place pour le contenu ambigu, le mystère et la gratification différée. Notre objectif est d’inspirer la confiance et de permettre l’interaction.

Actions

La forme suit la fonction est un principe qui stipule qu’un objet doit refléter sa fonction ou son objectif. Pour y parvenir dans une interface utilisateur, nous utilisons des conseils, des signaux visuels / propriétés liés à l’interface utilisateur qui montrent les façons possibles d’interagir avec elle.

L’utilisation d’un objet dépend des capacités physiques des utilisateurs, de leurs objectifs, de leurs expériences antérieures et bien sûr de ce qu’ils considèrent comme possible. Un bouton doit ressembler et fonctionner comme un bouton, pareil pour un lien, un code de menu, un formulaire, etc.

En utilisant des caractères clairs / abandons, les utilisateurs aideront à reconnaître ou interpréter les interfaces et interagir avec elles sans aucun problème. L’utilisation de solutions de conception connues et établies dans une interface utilisateur aidera les utilisateurs à prévoir les résultats et à agir en toute confiance. Par conséquent, il est recommandé d’utiliser des modèles de conception, qui sont des solutions testées, optimisées et réutilisables à des problèmes courants. Les composants tels que les boutons, les menus accordéon, les formulaires, les carrousels, etc. sont conçus pour résoudre des défis uniques, et ils sont reconnaissables partout.

Les modèles de conception sont construits autour d’expériences et d’opportunités précédentes et sont liés à des objectifs spécifiques. Choisir le bon modèle de conception pour le problème en question devrait être notre priorité absolue pour éviter les interactions confuses ou stressantes. L’établissement d’un langage visuel cohérent est la clé d’une interface plus complète. Les composants d’interface utilisateur interactifs répétitifs avec la même fonctionnalité et / ou importance doivent toujours avoir la même apparence et agir de la même manière. Ensuite, les éléments tels que la navigation, les boutons, les liens, les étiquettes, les erreurs, etc. doivent avoir un style, des couleurs et des animations cohérents tout au long du parcours de l’utilisateur.

Il convient de noter qu’un langage visuel cohérent facilite non seulement l’interaction en reliant le sens et en réduisant le bruit visuel, mais il améliore également la personnalité du produit, augmente la reconnaissance de la marque, la connexion émotionnelle et la confiance.

Conseil: Tester l’efficacité de nos décisions de conception avec de vrais utilisateurs est crucial car les perceptions des gens peuvent varier en fonction de l’âge, de l’accès à la technologie, des modèles mentaux, de la culture, etc.

Hiérarchie

La hiérarchie visuelle fait référence au poids visuel des éléments graphiques et à leur disposition d’une manière qui permet aux utilisateurs d’explorer et de découvrir le contenu sans aucun problème. En attribuant un poids visuel différent aux éléments de la page, nous pouvons regrouper le contenu et influencer l’ordre dans lequel les gens perçoivent les informations et naviguent dans le produit.

Hiérarchie

Actions

La couleur est le plus gros attrape. Les éléments colorés se démarqueront et se trouveront ainsi plus haut dans la hiérarchie. Les couleurs plus claires ressortiront davantage, donc dans cet esprit, nous devons soigneusement organiser et distribuer nos couleurs pour guider l’œil vers les bons endroits.

La taille des éléments visuels tels que le style, les boutons, les icônes et les images est presque aussi puissante que la couleur lorsqu’il s’agit de déterminer leur importance. Les graphismes plus grands captent l’attention des utilisateurs, ce qui semble significatif. Pour la typographie, une mise à l’échelle de la taille clairement prononcée peut aider à établir la hiérarchie du contenu et rendre la numérisation du contenu fluide et sans effort.

Une autre façon d’aider la hiérarchie visuelle consiste à utiliser la cohérence de la conception et les exceptions. Des éléments constamment ajustés, d’apparence similaire et répétitifs ou adjacents donneront l’impression qu’ils sont liés et tout aussi importants, tandis que des éléments divergents ainsi que des formes inhabituelles et des textures ou styles intéressants apparaîtront comme plus significatifs. Trop d’exceptions de conception entreront en compétition pour attirer l’attention et ajouteront de la complexité, c’est donc une bonne pratique de les utiliser avec parcimonie.

Conseil: L’étude des principes de Gestalt et de leur application dans la conception de l’interface utilisateur nous aidera à comprendre la perception visuelle et le regroupement pour améliorer la hiérarchie visuelle

Application couleur

La couleur ne doit pas être le seul moyen de transmettre un message ou d’ajouter du sens, mais elle est toujours utile et assez influente, elle ne doit donc pas être traitée comme un élément décoratif. La couleur a du sens, et même s’il n’y a pas de règles définies, trop de couleurs peut entraîner de la fatigue et une utilisation non régulière des couleurs peut prêter à confusion.

Actions

Évitez d’utiliser trop de couleurs. Trois couleurs suffisent généralement pour décrire tous les éléments visuels importants d’une page. La Règle 60–30–10 peut nous aider à créer l’harmonie parfaite. Où 60% des éléments colorés sont constitués de la couleur primaire qui crée un thème de produit unifié, avec une couleur secondaire de 30% qui rehausse le sens et / ou crée un effet accrocheur et une couleur d’accentuation de 10% pour compléter et aider les couleurs primaires et secondaires.

Toute couleur supplémentaire peut être utilisée pour apporter une nouvelle signification ou un nouveau message significatif à la page, nous devons donc laisser de la place pour ajouter plus de couleurs sans avoir à introduire l’arc-en-ciel.

De plus, nous devons nous assurer que nous utilisons la bonne teinte pour le message. L’esthétique mise à part, les couleurs créent des émotions et des connexions inconscientes. La signification d’une nuance particulière peut varier en fonction de la culture et de l’environnement dans lesquels nous nous trouvons, et les couleurs ont souvent des significations claires qui leur sont associées – dans le monde occidental, une erreur est rouge, le succès est vert, l’information est bleue, etc.

Conseil: Il est possible d’attribuer nos propres significations aux couleurs tant qu’elles ne chevauchent pas les normes établies, et nous les maintenons cohérentes tout au long de notre produit.

Iconography

La sémiotique est l’étude des symboles / icônes et de leur signification. Il se concentre sur la manière dont ces significations sont formées et interprétées par les gens, en fonction du contexte dans lequel ils les voient. Dans une interface utilisateur, les icônes font partie du langage visuel utilisé pour représenter des fonctions, des fonctionnalités ou du contenu. La sémiotique nous aide à concevoir une iconographie immédiatement reconnue et comprise.

Icônes

Actions

Au fil des ans, nous avons développé des icônes dont la signification est acceptée et comprise par la plupart des gens. Il existe également des icônes spécifiques à la plate-forme auxquelles les utilisateurs sont habitués et qui peuvent être facilement interprétées. C’est une bonne pratique de s’en tenir à ces solutions établies, dans la mesure du possible, pour une expérience familière et fluide.

Bien sûr, il existe des cas où nous devons concevoir des icônes personnalisées et spécifiques au produit pour des fonctionnalités uniques. Ces icônes doivent être aussi simples et minimales que possible pour assurer la clarté. Ils doivent également avoir un style visuel cohérent pour communiquer leur fonction ou se démarquer des autres éléments non fonctionnels.

Enfin, nous ne devons pas nous fier uniquement aux métaphores visuelles pour transmettre un sens, car certaines associations peuvent ne pas être aussi claires. Si une icône a besoin d’une légende pour décrire la signification, elle peut ne pas convenir. Lorsque vous n’êtes pas sûr, il peut être utile de tester avec de vrais utilisateurs.

Conseil: les icônes ne sont pas seulement ouvertes à l’interprétation, mais elles peuvent aussi avoir plusieurs significations. Pour cette raison, il est recommandé d’utiliser des balises avec une iconographie fonctionnelle.

Mémoire

De nombreuses expériences psychologiques ont montré que la capacité de traitement des individus en bonne santé est assez limitée. La plupart d’entre nous peuvent avoir une moyenne de 7 éléments – plus ou moins 2, selon l’individu, dans notre mémoire à court terme. Nos cerveaux ne sont pas optimisés pour la pensée abstraite et la mémorisation des données requises par les produits numériques, une bonne conception peut donc faire la différence

Actions

La réduction du nombre d’options et d’informations disponibles sur le site, ainsi que l’utilisation de titres clairs, de fil d’Ariane et d’options « retour » pour accéder au contenu antérieur, aideront les utilisateurs à se souvenir ou à se rappeler où ils se trouvent, ce qu’ils doivent faire ou ce qui leur est demandé.

Conseil: Il est possible d’augmenter notre mémoire à court terme et la capacité de notre processeur avec un processus appelé « chunking ». C’est là que nous regroupons visuellement les éléments pour former des choses plus grandes et plus faciles à retenir.

La prise de décision

Nous devrions maintenant savoir que nous, les humains, sommes assez mauvais pour prendre des décisions. C’est parce que nous voulons avoir un contrôle total tout en essayant d’être rationnel, d’interpréter et de comparer toutes les différentes options. C’est en fait une loi à ce sujet, ça s’appelle la loi Hick. Il décrit le temps qu’il faut à une personne pour prendre une décision à la suite de toutes les options possibles disponibles: augmenter le nombre augmentera le temps de décision.

Action

C’est évident, Keep It Simple, ou « K.I.S.S. » est un principe de conception qui stipule que la plupart des systèmes fonctionnent mieux s’ils restent simples plutôt que compliqués. Comme mentionné ci-dessus, notre capacité de traitement est limitée à une moyenne de 7 éléments à la fois, et avoir trop d’options avec une hiérarchie également perçue peut conduire à la paralysie de l’analyse.

Minimiser les options présentées à la fois et réduire le nombre de distractions sur la page, tout en maintenant un ordre hiérarchique clairement défini avec seulement quelques actions clés qui se démarquent, aidera à prendre des décisions.

Espace / espace blanc

L’espace blanc fait référence à l’espace vide entre et autour des éléments de conception et aide les utilisateurs à définir clairement et à interagir avec l’interface utilisateur. L’espace blanc n’est pas nécessairement blanc, il peut s’agir de n’importe quelle couleur, texture, motif ou même papier peint.

Action

Équilibrer la proximité et les espaces est la clé. Assurez-vous qu’il y a suffisamment d’espace entre les éléments interactifs pour minimiser les erreurs dues aux clics manqués. Comme mentionné ci-dessus, les dimensions interactives doivent être suffisamment grandes (au moins 42×42 px) et la distance entre elles doit généralement être d’au moins 8 px.

Bonus: améliorer les performances

Nous avons jusqu’à présent déclaré que la conception inclusive consiste à permettre au plus grand nombre possible de personnes d’accéder à Internet et d’atteindre leurs objectifs ou de résoudre leurs problèmes malgré leur situation. Nous avons peut-être la chance d’avoir accès à des équipements avancés ou à Internet ultra-rapide, mais nous pouvons ressentir les défis lorsque notre réseau n’est pas aussi bon. Pour la plupart des gens, les vieux appareils et Internet moche sont la norme, il est donc très bon de concevoir pour les meilleures performances possibles.

L'Internet ne consiste pas à savoir qui a le site Web ou le produit le plus joli, mais l'avenir est celui qui fonctionne le mieux, qui est le plus accessible et qui peut être utilisé par toutes sortes de personnes.– Chris Heilmann

Bonus: Apprenez à être empathique

Suivre les meilleures pratiques ci-dessus dans tout produit numérique est un bon début pour des normes d’accessibilité élevées. Mais il y a toujours place à l’amélioration et une meilleure connaissance de nos utilisateurs peut révéler de nouvelles façons d’élever les normes d’accessibilité. Il est donc nécessaire d’investir du temps et de l’argent pour en apprendre davantage sur nos différents types d’utilisateurs, car ils peuvent nous en apprendre beaucoup sur ce qui rend une expérience inclusive.

Apprendre à connaître nos utilisateurs nous aidera à pratiquer l’empathie. « Empathize » n’est pas la première phase du « Design Thinking » par hasard. Au stade de l’empathie, notre objectif est d’acquérir une compréhension approfondie des personnes pour lesquelles nous concevons et de leur perspective unique, afin que nous soyons en mesure de nous identifier et de les représenter lors de la prise de décisions de conception.

Empathie