Comment s’assurer qu’un texte a suffisamment de contraste avec son arrière-plan

Benjamin - 21 août 2018

Si vous voulez vous assurer que le contraste entre vos textes et leurs fonds est suffisant pour être parfaitement lisible et répond aux normes d’accessibilité WCGA 2.0 je vous invite à utiliser le site Color Contrast Checker.

L’outil est très simple à utiliser puisqu’il suffit de rentrer le code RGB hexadecimal de la couleur du texte (« Foreground Color ») ainsi que celui de la couleur de fond (« Background color »).

Si vos couleurs ont suffisamment de contraste vous obtiendrez un badge vert (« Pass ») à côté des textes sous le formulaire. Si le contraste est insuffisant vous obtiendrez un badge rouge (« Fail »).

Le but étant de valider au minimum le contraste en AA pour les textes normaux (en dessous de 18px) et les textes larges (au dessus de 18px).

Comme vous l’aurez certainement compris, vous pouvez essayer de changer la couleur du texte ou celle du fond pour obtenir un badge vert AAA ce qui permet de rendre vos écrits encore plus lisibles.

Pour finir, si vous voulez en savoir plus sur la norme WCGA 2.0 je vous invite à lire la documentation en français.