Des couleurs accessibles (2)
Nous avons constaté dans le précédent article qu’il était nécessaire de bien choisir les couleurs d’un site pour que son contenu soit lisible par un daltonien. Dans ce second article, nous nous intéresserons aux recommandations WCAG (Web Content Accessibility Guidelines) concernant le choix des couleurs.
Quelles sont les recommandations ?
Tout d’abord, il faut éviter de recourir uniquement à la couleur pour fournir une information. Par exemple, ne pas se contenter de mettre en évidence les liens hypertextes par la couleur seule, mais ajouter d’autres indices (soulignement par exemple).
On doit également s’assurer que le contraste entre le premier plan (le texte par exemple) et le fond soit suffisant. Le contraste se mesure selon deux critères : différence de tonalité et différence de luminosité. Le W3C propose des formules de calcul qui permettent de déterminer ces valeurs.
Différences de luminosité et de tonalité
La luminosité d’une couleur est déterminée par la formule :
((rouge × 299) + (vert × 587) + (bleu × 114)) / 1000. La différence de luminosité entre le fond et le premier plan doit être supérieure à 125.
La différence de tonalité entre deux couleurs est calculée de la manière suivante :
(max (rouge1, rouge2) – min (rouge1, rouge2)) + (max(vert1, vert2) – min(vert1, vert2)) + (max(bleu1, bleu2) – min(bleu1, bleu2)). La différence de tonalité entre les deux couleurs doit être supérieure à 500.
Quelques outils
Il serait fastidieux d’effectuer les calculs de contraste pour chaque couleur présente sur un site. Il existe heureusement de outils qui facilitent ce travail :
- le site Web Accessibility Tools Consortium propose en téléchargement le Colour Contrast Analyser, un outil très pratique pour vérifier les contrastes de couleurs lorsque l’on conçoit un site ;
- Juicy Studio propose une extension pour Firefox qui, d’un simple clic, analyse une page web et fournit un rapport complet sur l’accessibilité de toutes les couleurs trouvées.
En pratique
Les critères d’accessibilité des couleurs que l’on trouve dans les WCAG sont très stricts et limitent grandement la créativité. Hewlett Packard, qui fournit un outil de vérification en ligne, n’exige qu’une différence de tonalité de 400, ce qui offre déjà plus de liberté.