Quels outils pour tester les contrastes de couleurs ?

Le choix des couleurs et de leurs contrastes est un élément essentiel à prendre en compte dans ta communication et ta charte graphique. Les contrastes des couleurs ne sont pas qu’esthétiques et visuels mais répondent aussi à des questions pratiques et d’accessibilité. Je t’en dis un peu plus sur le sujet et je te partage plusieurs outils pour tester les contrastes de tes palettes de couleurs !

Contrastes de couleurs et accessibilité

Au-delà des couleurs elles-mêmes, de ce qu’elles t’inspirent et de tes goûts, tu dois penser aux contrastes dans ta palette. Ceux-ci doivent être suffisants pour être perçus par tous. Malheureusement, tous les utilisateurs ne distinguent pas les couleurs de la même façon comme les daltoniens ou les malvoyants par exemple. Tu ne dois pas les oublier ! Et puis, il se peut également que l’environnement ou une situation particulière dégradent la perception des couleurs et limitent les contrastes entre ces dernières. Pour ces raisons, tu dois penser accessibilité en respectant quelques critères de contrastes entre tes couleurs.

Les critères d'accessibilité des couleurs

Tu peux retrouver ces critères dans les directives d’accessibilité du contenu web WCAG (Web Content Accessibility Guideline) ou dans le RGAA en Français (référentiel général d’amélioration de l’accessibilité).

2 critères essentiels sont à retenir :

  • N’utilise pas la couleur comme seul moyen visuel de véhiculer une information
  • Veille à ce que le rapport de contraste entre le premier plan et le fond soit suffisant
Il existe deux niveaux d’accessibilité
  • Niveau AA = contraste minimum
  • Niveau AAA = contraste amélioré

Selon ces critères et le niveau d’accessibilité souhaité, tu devras respecter certaines combinaisons de couleurs pour rendre tes informations lisible selon la taille de tes polices, leur mise en forme (gras) mais aussi tes visuels, tes fonds… 

Des outils pour tester les contrastes de couleurs

Tanaguru Contrast Finder

Tanaguru Contrast Finder te permet de tester des contrastes et te propose des alternatives. Tu peux également choisir une suggestion de palettes aux couleurs valides en fonction d’une composante (couleur de texte ou de fond).

Color Contrast Checker de Polypane

Avec Color Contrast Checker de Polyplane, tu peux choisir entre les niveaux AA ou AAA. Si le contraste n’est pas suffisant, l’outil te suggère d’autres couleurs proches.

Contrast Ratio

Contrast Ratio est un outil en ligne qui vérifie la ratio de contraste entre un couleur de texte et un arrière plan. L’avantage, c’est que tu peux visualiser parfaitement le rendu des couleurs en arrière plan.

Contrast Checker

Avec Contrast Checker vous pouvez tester, comme pour les autres outils, vos combinaisons de couleurs. Vous pouvez le faire depuis une image et même effectuer des tests de daltonisme.

Laisser un commentaire

A découvrir également