Combien de fois avons-nous visité un site web sur lequel nous ne pouvions rien lire, ou utilisé une application avec une combinaison de couleurs horrible ? D'un point de vue de l'accessibilité, choisir une palette ou un rapport de contraste incorrect peut ruiner toute visibilité, mais le portail OddContrast nous aide à trouver les bonnes valeurs, basées sur la version 2 du standard WCAG.
Si l'on se fie à la définition du standard WCAG dans sa version 2 (également connu sous le nom de Règles pour l'accessibilité des contenus Web), le « contraste » est une mesure de la différence de « luminosité perçue » entre deux couleurs, exprimée sous forme de ratio. Par exemple, un texte rouge (#ff0000) sur fond blanc (#ffffff) a un rapport de 4:1. Si l'on change le texte en bleu (#0000ff), le rapport passe à 8,59:1, et il se lit mieux. Enfin, le standard texte noir sur fond blanc a un rapport de 21:1. Le plus intéressant ? Le rapport reste intact si l'on inverse les couleurs.
Pourquoi est-ce important ? Parce que souvent, on applique des combinaisons de couleurs avec un très mauvais rapport, et le texte devient illisible. En tant que personne ayant déjà été obligée d'agrandir la taille des polices sur son ordinateur, je comprends plus que jamais l'importance d'un bon contraste. Et cette idée nous mène à OddContrast, un portail spécialement conçu pour calculer les rapports de contraste sur des sites, services et/ou applications d'accessibilité.
Optimisez le contraste de vos projets avec OddContrast
Il n'y a pas grand-chose à faire sur le site pour en tirer le meilleur parti : on choisit un format qui représente les couleurs (huit disponibles, dont HEX et sRGB), et on ajuste les curseurs pour la couleur principale et la couleur d'arrière-plan jusqu'à obtenir une mention « validé » dans les cas qui nous intéressent. OddContrast définit les rapports normaux à 4.5:1 pour le texte standard et 3:1 pour le grand texte, tandis qu'un contraste optimisé parle de 7:1 et 4.5:1 respectivement. Par ailleurs, le grand texte est supérieur ou égal à 24px avec un poids normal, et supérieur ou égal à 19px en gras.
Pour terminer, OddContrast ne prétend pas être le détenteur absolu de la vérité. En fait, nous n'avons même pas besoin d'un bon rapport dans tous les cas, mais la différence entre une mauvaise combinaison de couleurs et une bonne est notable. Faites le test !
Site officiel : Cliquez ici
