web-dev-qa-db-fra.com

Comment déterminer les palettes de couleurs visibles pour les daltoniens?

Comment puis-je créer une palette de couleurs qui peut toujours être visible par ceux qui sont daltoniens? Existe-t-il une ressource qui peut aider à déterminer si les palettes de couleurs sont conformes aux normes WCAG?

Sinon, quelqu'un pourrait-il expliquer son processus pour garantir une accessibilité maximale lors du choix des palettes de couleurs?

accessibilitycolorcolor-blindness
6
JDH

Smashing Magazine a fait un énorme article en octobre 2014 sur les meilleures pratiques en matière d'accessibilité des couleurs . Il couvre les formes de daltonisme et un certain nombre d'outils pour valider vos conceptions. Voici une copie des meilleures pratiques décrites ici:

Testez le rapport de contraste de couleur et documentez les styles et les codes de couleur utilisés pour tous les éléments de conception. Créez une spécification de conception visuelle qui comprend les éléments suivants:

  • typographie pour tous les éléments textuels, y compris les titres, les liens de texte, le corps du texte et le texte formaté;
  • icônes et glyphes et équivalents textuels;
  • éléments de formulaire, boutons, validation et messagerie d'erreur système;
  • couleur d'arrière-plan et styles de conteneur (en veillant à ce que le texte sur ces arrière-plans passe tous);
  • les traitements visuels pour les liens désactivés, les éléments de formulaire et les boutons (qui n'ont pas besoin de passer un rapport de contraste de couleur minimum).

Et voici quelques outils pour tester le contraste que j'ai trouvés qui ne sont pas mentionnés dans l'article:

6
dnbrv

J'ai trouvé qu'il est assez difficile de trouver des exemples concrets ou des procédures.

Les produits Adobe comme Illustrator ont des simulateurs très utiles (ouvrez une nouvelle fenêtre et choisissez Affichage> Configuration de la vérification> Cécité des couleurs ...) qui peuvent instantanément vous montrer un rendu côte à côte en direct lorsque vous ajustez vos couleurs. Et il existe également des outils autonomes gratuits, comme l'analyseur de contraste de couleur.

J'ai publié un exemple sur graphicdesign.stackexchange

1
Jon Coombs