Résumé de section

  • Il existe de nombreux outils conçus pour vous aider à corriger les problèmes de contraste. Certains sont plutôt destinés à des personnes expertes, comme l'extension de navigateur WCAG Color contrast checker (disponible sur Chrome et Firefox). Le but ici est plutôt de vous donner quelques liens qui vous seront utiles en tant que formateur.

    5 minutes de lecture

    • Pour vérifier le ratio de contraste

      WebAIM Contrast Checker
      Pour une analyse complète

      C'est un outil de référence pour les professionnels de l'accessibilité qui donne des informations détaillées sur la conformité WCAG.

      Le site (en anglais) propose d'entrer le code hexadécimal des couleurs à vérifier, ou d'en prélever une, puis donne les résultats du ratio au niveau de la taille des textes et même des composants d'interface et éléments graphiques !

      Il propose aussi d'autres ressources très utiles, comme cette page complète et très pédagogique sur la notion de contraste et accessibilité.

      Aller sur WebAIM Contrast Checker
    • Tanaguru Contrast Finder
      Pour une utilisation complète en français

      Un outil français et open source qui vous permet d'entrer le code RVB ou hexadécimal, de choisir le ratio minimum que vous visez et d'obtenir des couleurs valides proches de vos couleurs initiales.

      Aller sur Tanaguru Contrast Finder
    • Coolors Contrast Checker
      Pour une vérification rapide

      Cet outil (en anglais) contient bien moins d'explications mais a l'avantage de suggérer une couleur de remplacement se rapprochant au plus près de la teinte problématique.

      Comme WebAIM Contrast Checker, vous pouvez entrer les codes hexadécimaux pour obtenir les résultats du ratio, mais seulement au niveau de la taille des textes.

      Aller sur Coolors Contrast Checker

    • Pour prélever la couleur (outil pipette)

      ColorZilla
      Pour prélever des couleurs sur le web

      C'est une extension de navigateur disponible sur Chrome et Firefox qui permet de prélever le code couleur de n'importe quel élément sur le web. Les couleurs prélevées sont conservées dans l'historique, et d'autres fonctionnalités peuvent s'avérer aussi intéressantes.

      À noter que sur Firefox, le zoom permettant de bien voir le pixel de couleur à prélever ne semble pas disponible. Heureusement, une fonctionnalité intégrée au navigateur existe (voir ci-après).

      Aller sur ColorZilla
    • Mozilla pipette à couleurs
      Pour prélever des couleurs sur Fierfox

      Le problème de Colorzilla sur Firefox est que le zoom du pointeur peut ne pas fonctionner, ce qui rend la sélection du pixel difficile. La fonctionnalité intégrée au navigateur Firefox n'a pas ce problème. Il suffit de cliquer sur le pixel choisi pour copier le code dans le presse-papier.

      La pipette se trouve dans la section "Outils du navigateur / Outils supplémentaires" du menu de la barre d’outils Firefox.

      Aller sur Mozilla pipette à couleurs
    • PowerPoint
      Pour prélever des couleurs hors ligne

      PowerPoint, qui compte parmi les outils les plus utilisés en formation, permet aussi de prélever des couleurs avec une pipette. Ce qui se révèle pratique si vous utilisez une image trouvée hors ligne et que vous souhaitez vérifier les contrastes avec les codes couleurs exacts.

      À noter que les récentes version proposent des fonctions d'accessibilité, notamment la possibilité de filtrer votre palette avec les couleurs ayant des contrastes élevés seulement, mais aussi l'option "Inspecter sans couleur" pour vérifier le rendu en nuances de gris.

      En savoir plus sur la pipette PowerPoint