Comment vérifier l'accessibilité d’un nuancier ?
J'accompagne de plus en plus de structures en quête d'une communication plus claire et plus accessible. Cependant, cette ambition est souvent stoppée par le manque de temps.
C'est logique : que vous soyez à la tête d'une entreprise ou (pré)occupée par des missions aussi nombreuses qu’urgentes, votre rôle est avant tout de faire tourner la boutique, de passer d’un projet à un autre tout en jonglant avec votre santé mentale. Comment trouver le temps de s'occuper de l'accessibilité de sa communication visuelle ? Et puis, comment faire ? Et voilà que, malgré des valeurs qui vous tiennent à cœur, toute action en faveur d’une société inclusive se retrouve sans cesse repoussée…
Bonne nouvelle : il est possible de faire vos premiers pas vers cette ambition grâce à une pratique abordable et pratique : l’accessibilité de votre palette de couleurs.
Des chiffres et des lettres
Pourquoi donc se prendre le chou à vérifier les contrastes des couleurs qui se trouvent sur votre charte graphique (ou sur l’un de vos supports de communication) ? D'abord, parce que je doute que grand monde arrive à lire un texte écrit en jaune poussin sur un fond blanc 🐣 Et surtout, parce qu'un bon contraste coloré assure la lisibilité de votre contenu, notamment auprès d'une audience avec un handicap visuel.
Entrons dans le vif du sujet : que vous travailliez sur un logiciel de bureautique (comme Powerpoint) ou de création graphique (comme Canva), vous noterez que chaque couleur a une valeur codée se présentant sous la forme d'un dièse, suivi d'un ensemble de chiffres et de lettres.
Cette valeur dite "hexadécimale" est le langage informatique des couleurs pour nos machines. En gros, c'est une sorte de Google Translate Français > Ordinateur. Prenons un exemple : si vous ajoutez la valeur #FFFFFF à votre palette Canva, votre ordi va capter que vous voulez afficher du blanc. Si vous lui balancez un #DD5836, il va voir rouge.
Tester des combinaisons de couleurs
Je vous barbe avec cette histoire de code binaire parce qu'on va s'en servir pour vérifier le contraste d’une palette de couleurs. Pour se faire, il est possible de s'appuyer sur des outils en ligne spécialement conçus pour ça. Personnellement, j’utilise soit Tanaguru Contrast Finder (un outil très complet, en français), soit Accessible Color Palette (pour créer des nuanciers, en anglais).
Ces (nombreux) outils fonctionnent plus ou moins de la même manière : ils comparent la couleur d’un texte à sa couleur du fond. Il vous suffit d'entrer les valeurs hexadécimales de deux de vos couleurs sur l'un de ces outils pour vérifier si le contraste de cette combinaison colorée est valide — et donc que votre contenu sera lisible par une large audience. Si ce n'est pas le cas, certains de ces outils peuvent vous aider à trouver des couleurs approchantes. Elle est pas belle, la vie ?
Des chiffres et des lettres (bis)
Quand vous utilisez des outils de vérification des contrastes, de nombreux éléments bizarres vont apparaître sous vos yeux : tout plein de chiffres, des lettres majuscules (surtout des A) et une sombre histoire de ratios. Qu’est-ce que ça veut dire ?
Qui dit accessibilité numérique dit RGAA ou WCAG, aka THE référentiels pour produire du contenu numérique accessible aux personnes en situation de handicap. Les outils de vérification des contrastes sont reliés aux règles édictées par ces guides, et font leurs petits calculs en conséquence. C’est pour ça qu’en utilisant ces outils, on se retrouve devant les données suivantes :
- Des ratios de contraste. Ce sont des chiffres qui racontent le degré de lisibilité d’un texte sur son arrière-plan au regard d’un corps typographique (de sa taille quoi). Il existe trois ratios de contrastes :
- 3:1 (pour les textes de grande taille nécessitant une lisibilité minimale) ;
- 4.5:1 (pour la plupart des textes) ;
- 7:1 (pour les textes de petite taille, ou nécessitant une lisibilité accrue).
- La lettre A. Elle indique qu’un texte a un contraste suffisant avec son arrière-plan pour être facilement lu ou vu par la plupart des utilisateurices. Le RGAA classe le contraste des couleurs en trois niveaux : A, AA et AAA. En gros, plus vous avez de A, plus vous êtes bon-ne élève 🤓
Comment faire si mon nuancier n’est pas valide ?
Damned ! Vos combinaisons de couleurs ne sont pas suffisamment contrastées… Pas de panique : voici plusieurs solutions, à adapter en fonction de vos possibilités :
- Si vous (ou votre structure) êtes en train de créer ou de réviser une identité visuelle, vous avez la possibilité de construire une palette de couleurs nativement accessible. Et ça, c’est le top : vous allez gagner un temps fou puisque vous n’aurez plus à gérer de changements sur le long terme ; sans compter que vos lecteurices daltoniens et malvoyantes vous en seront reconnaissantes.
- Si vous êtes chef-fe d’entreprise, assumez le changement de couleurs de l’identité visuelle de votre structure et profitez-en pour communiquer sur votre démarche. Sauf menaces légales, vous n’êtes pas obligé-e de bouleverser votre palette ou de modifier tous vos supports d’un coup : l’important est de s’engager dans la démarche, au regard de vos possibilités.
- Si vous n’avez pas la main pour modifier un nuancier existant, créez une pAAAlette de couleurs proche de la charte utilisée. Présentez-la comme une alternative à disposition pour concevoir des contenus plus adaptés. Et continuez de saouler d’en parler à vos collègues, à votre équipe, à votre boss, à votre clientèle… Au monde entier, tant qu’on y est !
L'astuce qui fait plaisir : une fois les contrastes de votre palette validés et votre nuancier tout beau tout propre, pensez à enregistrer cette nouvelle palette de couleurs — les valeurs hexadécimales — dans votre logiciel de création graphique préféré. Efficacité garantie : plus besoin de copier-coller des #FFFFFF et des #RJD8HD à tout bout de champ…
