The Good Manager  >  Modules d'apprentissage

100 points à savoir sur…
Accessibilité numérique

100
points à savoir sur…
Retour au sommaire du module

Notion 91

Outils d'évaluation des choix de couleurs et des contrastes

Compétences ciblées

Comprendre l'utilisation d'outils automatisés pour évaluer l'utilisation des couleurs dans votre contenu web.

L'importance des tests automatisés pour choisir les bonnes couleurs

Les couleurs sont un élément essentiel de la création d'une meilleure expérience visuelle pour les utilisateurs. Les combinaisons de couleurs inaccessibles peuvent poser des problèmes aux utilisateurs souffrant de troubles de l'apprentissage, de troubles visuels et même de troubles de la situation. Les utilisateurs concernés peuvent être les suivants

  • travaillant dans des circonstances de faible luminosité d'écran,
  • daltoniens (environ 5 % des utilisateurs du web aujourd'hui),
  • dyslexiques, car ils ont du mal à traiter le contenu si les couleurs sont à la fois trop similaires ou trop contrastées (comme le blanc sur le noir),
  • et bien d'autres encore.

Les différents profils de ces utilisateurs ne doivent pas vous décourager. Votre meilleure chance est de suivre les critères de réussite des WCAG. Ils stipulent que le texte standard doit respecter un rapport de contraste minimum d'au moins 4,5:1, et le texte plus grand (18 points ou plus) d'au moins 3:1.

Liens externes pour tester l'accessibilité des couleurs que vous avez choisies

Il existe plusieurs outils qui peuvent tester automatiquement ces exigences pour des combinaisons de couleurs suffisantes. Ces outils sont soit téléchargeables, soit disponibles pour une utilisation en ligne.

Ils vous permettent de déterminer :

  • quelles combinaisons de couleurs peuvent assurer une meilleure lisibilité du texte
  • le rapport de contraste de deux couleurs
  • comment les combinaisons de couleurs apparaissent aux utilisateurs daltoniens

Nombre d'entre eux proposent également des suggestions pour des choix de couleurs plus adaptés. Ils utilisent tous comme référence les critères de réussite des WCAG pour les couleurs.

Simulateurs de cécité aux couleurs.

Regardez comment l'outil Visolve affiche la différence entre une image originale (à gauche) et la façon dont elle apparaît à un utilisateur daltonien (à droite) :

All media on this site are described by the text nearby

Vérificateurs de contraste des couleurs (pour le texte et les boutons d'interface utilisateur)

L'image ci-dessous montre comment l'outil Color Contrast Accessibility Validator évalue une page :

All media on this site are described by the text nearby

Description
Capture d'écran de l'outil Color Contrast Accessibility Validator indiquant que la page évaluée a un bon contraste de couleur.

Suggestions de combinaisons de couleurs

Voici un exemple de la manière dont l'outil Contrast Finder propose des suggestions de combinaisons de couleurs conformes aux WCAG :

All media on this site are described by the text nearby

Description de l'image
Capture d'écran de l'outil Contrast Finder proposant des suggestions de combinaisons de couleurs conformes aux WCAG.