Cercles colorés pour signifier le statut - une violation des directives d'accessibilité?
J'examine l'interface utilisateur Web de Google pour gérer les appareils Chrome Chrome.
L'état de chaque appareil est représenté par un cercle coloré (voir les images ci-dessous).
J'aurais pensé que cela violerait les principes d'accessibilité - les utilisateurs souffrant de daltonisme ne seraient pas en mesure de distinguer le "bon" état des états "mauvais" ou "inconnu".
Ou y a-t-il quelque chose de spécial dans ces couleurs que la majorité des personnes daltoniennes peuvent en quelque sorte faire la différence?
Les couleurs réelles utilisées sont simplement les couleurs Web nommées "rouge" et "vert".
La raison pour laquelle je demande, c'est que, dans mon équipe, nous envisageons d'incorporer les mêmes éléments de conception dans notre application Web, et je crains que cela ne soit inutilisable par un pourcentage notable du public.
Comme l'ont dit les autres réponses, les couleurs elles-mêmes peuvent poser problème si les teintes ne se distinguent pas facilement. La solution la plus claire à cela est de combiner les couleurs avec une forme, afin que les personnes en pleine vision puissent toujours numériser rapidement par couleur, mais s'arrêter pour en chercher une seconde montrera également facilement l'idée. Quelque chose comme:
télécharger la source bmml - Wireframes créés avec Balsamiq Mockups
La meilleure solution, je pense, serait des formes géométriques (possibles avec des icônes au milieu). Cercle vert pour le bien, croix rouge pour le mal, triangle gris pour le doute. Je les aurais inclus dans la maquette mais je suis un peu gêné par le logiciel ici!
Deutéranopie , ou daltonisme rouge-vert, est l'une des formes les plus courantes de daltonisme. Il existe de nombreuses autres formes de daltonisme qui affectent également la perception du rouge et du vert.
Sans accès à l'interface Google que vous avez mentionnée, je suppose qu'il n'y a rien de spécial dans ces couleurs qui fournirait une assistance supplémentaire aux utilisateurs daltoniens. Les utilisateurs daltoniens verront très probablement une différenciation de la teinte entre les points, mais la signification véhiculée par les couleurs rouge et verte est très probablement perdue chez ces utilisateurs.
Même si la signification de la couleur est révélée si l'utilisateur survole l'un des points, cette solution n'est pas aussi visible pour tous les utilisateurs que l'utilisation d'une étiquette d'état textuelle du système en plus ou à la place des points.
Directive WCAG 1.4.1 (Niveau A):
1.4.1 Utilisation de la couleur: la couleur n'est pas utilisée comme seul moyen visuel de transmettre des informations, d'indiquer une action, de provoquer une réponse ou de distinguer un élément visuel. (Niveau A)
Il s'agit donc clairement d'une violation des directives d'accessibilité et vous obtiendrez de bons résultats en fournissant un signal visuel supplémentaire qui n'est pas basé sur les couleurs.
Mon iPhone est toujours en mode niveaux de gris et je ne peux jamais dire si le shuffle est activé ou désactivé sur Spotify - il est super ennuyeux et carrément injuste . Ces choses sont importantes pour ceux qui ont une déficience visuelle, aussi peu soient-ils. 9% des hommes souffrent d'une sorte de daltonisme.
En plus de ce que les autres ont dit, voici une solution rapide:
Utilisez une combinaison de bleu et d'orange. Ceux-ci peuvent être discernés par les 3 cas les plus courants.
Il est préférable de n'afficher une icône qu'en cas de problème. Les utilisateurs interpréteront l'absence d'icône d'alerte comme signifiant que l'élément est OK.
Une mer de vert ou des icônes qui signifient "OK" rendra les problèmes plus difficiles à trouver car vous demandez au lecteur de faire la différence entre deux possibilités pour chaque ligne par rapport à l'analyse de l'écran pour une seule icône.
Si l'élément est OK, ne pas avoir d'icône. Signalez uniquement ceux qui ont un problème; cela réduira l'encombrement, facilitera la recherche des problèmes et éliminera la question des icônes ou des couleurs à utiliser - utilisez l'icône que vous utilisez pour une alerte (point d'exclamation dans un triangle, par exemple).