Typographie accessible et lisibilité

L'accessibilité typographique n'est pas un sujet de niche. En France, environ 12 millions de personnes vivent avec un handicap. 8 % des hommes sont daltoniens. 6 à 8 % de la population est dyslexique. Et tout le monde vieillit — ce qui signifie que la presbytie touche la majorité des lecteurs après 45 ans. Concevoir un texte lisible, c'est concevoir pour le monde réel.

Contraste

WCAG AA : ratio 4.5:1 pour le texte courant, 3:1 pour le texte agrandi (>18pt ou >14pt bold). C'est le minimum légal dans de nombreux contextes et le standard professionnel. WCAG AAA demande 7:1 — ambitieux mais recommandé pour les contenus critiques.

Teste tes combinaisons avec un outil comme WebAIM Contrast Checker ou l'inspecteur d'accessibilité de Figma. Les combinaisons qui passent en AA ne passent pas toujours en contexte réel — un écran en plein soleil ou un vidéoprojecteur dégradent le contraste.

Combinaisons à éviter : texte gris clair sur blanc, texte coloré sur fond coloré (bleu sur vert, rouge sur orange), texte blanc sur jaune ou sur fond photographique non traité.

Taille et lisibilité

16px minimum pour le web. Les WCAG ne fixent pas de taille minimale stricte, mais en dessous de 16px, la lisibilité chute significativement sur mobile. Pour le print, le corps ne devrait pas descendre sous 10pt sauf pour les mentions légales — et même celles-ci méritent d'être lisibles.

Permets toujours le zoom. En web, ne bloque jamais le zoom navigateur (user-scalable=yes dans le viewport meta). En print, n'utilise pas de texte en dessous de 8pt même pour les notes de bas de page.

Choix de police

Toutes les polices ne sont pas égales en lisibilité. Les critères clés pour l'accessibilité sont la hauteur d'x (la hauteur des minuscules par rapport aux majuscules), l'ouverture des formes (les « contre-formes » des lettres comme e, a, c) et la distinction entre caractères similaires.

Test des caractères ambigus : vérifie que ta police distingue clairement Il1 (I majuscule, l minuscule, chiffre 1), 0O (zéro et O majuscule), rn et m. Si ces caractères se confondent, la police pose un problème d'accessibilité.

Polices recommandées pour l'accessibilité : Atkinson Hyperlegible (conçue spécifiquement pour la lisibilité), Inter, Source Sans 3, Noto Sans. Elles ont toutes des formes ouvertes, une bonne hauteur d'x et des caractères bien différenciés.

Dyslexie

La dyslexie affecte la reconnaissance des lettres et des mots. Certains choix typographiques facilitent la lecture pour les personnes dyslexiques — et ils améliorent la lisibilité pour tout le monde.

Interlignage généreux. 1.5 minimum, 1.8 idéal. L'espace entre les lignes réduit le risque de « sauter » une ligne.

Éviter le texte justifié. Les espaces irrégulières entre les mots créent des « rivières » visuelles qui perturbent la lecture. Alignement à gauche systématique.

Paragraphes courts. Des blocs de 3 à 5 lignes sont plus faciles à aborder qu'un pavé de 15 lignes.

Éviter l'italique en bloc. L'italique est plus difficile à lire pour les personnes dyslexiques. Utilise-le pour un mot ou une courte expression, pas pour un paragraphe entier.

Éviter le tout-majuscule en bloc. Les majuscules suppriment les ascendantes et descendantes qui aident à la reconnaissance des mots. Acceptable pour un label court, pas pour une phrase.

Daltonisme

Ne transmets jamais une information uniquement par la couleur. Si un lien est en bleu, souligne-le aussi. Si un message d'erreur est en rouge, ajoute une icône ou un texte. Un graphiste daltonien (ou un lecteur daltonien) doit pouvoir comprendre ta mise en page sans distinguer les couleurs.

Teste ton design en niveaux de gris — si la hiérarchie et les informations restent lisibles, ton design est robuste.