Couleur

Choisissez une couleur selon la fonction qu’elle doit remplir. La décoration, l’état d’interface, la distinction de catégories et l’encodage quantitatif n’ont pas les mêmes exigences.

Types de palettes

Palette	Utilisez-la pour	Vérifiez
séquentielle	des valeurs progressant du faible vers le fort	la luminosité doit évoluer clairement dans une seule direction
divergente	des valeurs s’éloignant d’un point médian significatif	les deux côtés doivent être distinguables et le point médian doit rester visuellement discret
qualitative	des catégories sans ordre numérique	les catégories adjacentes doivent rester distinctes à la taille prévue

N’encodez pas le sens par la couleur seule. Accompagnez les couleurs d’état de texte, d’icônes, de styles de lignes, de formes ou d’étiquettes directes. Un graphique qui devient ambigu en niveaux de gris ou sous des déficiences courantes de la vision des couleurs a besoin d’un autre repère.

Contraste et contexte

Le texte et les contrôles essentiels ont besoin d’un contraste suffisant avec leur arrière-plan. Vérifiez les états normal, survol, focus et désactivé, ainsi que les thèmes clair et sombre, plutôt que de tester un nuancier isolé. Les grands éléments d’un graphique peuvent tolérer des relations qui seraient illisibles pour du petit texte.

Pour la visualisation de données, évitez de traiter le rouge et le vert comme une paire opposée universellement lisible. Une palette divergente bleu–orange est souvent plus facile à distinguer, mais elle doit tout de même être testée ; aucune paire de teintes ne remplace le contraste et l’étiquetage redondant.

Une démarche pratique

1. Décidez si les données sont séquentielles, divergentes ou catégorielles.
2. Partez d’une palette conçue pour ce rôle plutôt que d’assembler des couleurs sans rapport.
3. Testez le rendu à sa taille réelle dans des contextes clairs et sombres.
4. Simulez les déficiences courantes de la vision des couleurs et examinez une vue en niveaux de gris.
5. Vérifiez le contraste du texte et des contrôles selon les critères WCAG applicables.
6. Demandez-vous si la même information reste compréhensible sans couleur.

Outils utiles

• ColorBrewer propose des palettes séquentielles, divergentes et qualitatives testées pour les cartes et graphiques.
• WebAIM Contrast Checker vérifie le contraste premier plan/arrière-plan.
• Les outils d’accessibilité des couleurs d’Adobe Color permettent d’examiner le contraste et les relations sûres pour les personnes daltoniennes.
• Les outils de développement des navigateurs peuvent émuler les déficiences visuelles et tester la page réelle plutôt qu’une palette isolée.

Une palette réussit lorsque les lecteurs peuvent retrouver rapidement la structure visée, et non lorsque chaque couleur est frappante prise isolément.

Mes lectures · Les notes ouvertes sont mémorisées dans ce navigateur.