Regardez la dernière promo que vous avez mise sur votre page d'accueil. Le « SOLDE D'ÉTÉ - 40 % DE RABAIS » étalé dans l'en-tête. La liste de prix qu'un graphiste vous a renvoyée en beau visuel. Les heures d'ouverture posées dans un joli rectangle aux couleurs de la marque. Pour vous, ça se lit comme du texte, parce que vos yeux retransforment les pixels en mots sans effort. Pour un lecteur d'écran, et pour une cliente qui zoome la page à 300 %, une bonne partie de ce « texte » n'en est pas du tout - c'est une image de texte, et cette différence est exactement le genre de chose sur quoi une entreprise ontarienne trébuche sans jamais le remarquer. Les WCAG ont un nom pour ça et, contrairement à certaines règles plus récentes, celle-ci est déjà à l'intérieur de la norme qu'exige la province.
Faits saillants
- 1.4.5 Texte sous forme d'image est un critère de succès de niveau AA dans les WCAG (Règles pour l'accessibilité des contenus Web) 2.0, publiées par le W3C en 2008. Il dit : lorsque la technologie peut produire le même résultat visuel, utilisez du vrai texte plutôt qu'une image de texte pour présenter de l'information (W3C).
- Il y a deux exceptions étroites : un logotype (du texte qui fait partie d'un logo ou d'un nom de marque), et le texte que l'utilisateur peut entièrement personnaliser, ou dont une présentation précise est essentielle au sens (W3C).
- Le RNAI de l'Ontario (Règlement sur les normes d'accessibilité intégrées, Règl. de l'Ont. 191/11, art. 14) exige les WCAG 2.0 niveau AA - qui incluent le 1.4.5 - pour les organisations de 50 employés ou plus (ontario.ca).
- Le prochain RCA (rapport de conformité en matière d'accessibilité) est dû le 31 décembre 2026 pour les organisations de 20 employés ou plus (ontario.ca).
- La LAPHO (Loi sur l'accessibilité pour les personnes handicapées de l'Ontario) ne prévoit pas de droit d'action privé; la voie individuelle est une plainte au TDPO (Tribunal des droits de la personne de l'Ontario) en vertu du Code des droits de la personne de l'Ontario (ontario.ca).
Qu'est-ce qui compte comme « texte sous forme d'image », et pourquoi ça échoue?
Le vrai texte, ce sont les caractères que votre navigateur dessine à partir du HTML et met en forme avec du CSS. Vous pouvez les sélectionner avec le curseur, un lecteur d'écran peut les lire, un outil de traduction peut les traduire, et ils restent nets à n'importe quel zoom. Une image de texte est une image - un JPG, un PNG ou un visuel aplati - avec les lettres peintes dans les pixels. Ça a l'air identique à l'écran et ça se comporte en rien comme du texte en dessous.
Les coupables habituels dans un site de petite entreprise sont prévisibles :
- Une bannière d'en-tête avec le titre et l'offre incrustés dans l'image.
- Une liste de prix, un menu ou un tableau d'heures exporté en un seul visuel parce que « c'était plus propre ».
- Une infographie ou une tuile promo avec des paragraphes de texte à l'intérieur, souvent le même visuel publié sur les réseaux.
- Un témoignage ou une citation enregistré en capture d'écran.
Voici pourquoi ça brise pour de vraies personnes. Un lecteur d'écran lit du texte, pas des pixels; sans aide, le message est tout simplement muet. Une personne malvoyante qui agrandit la page garde le vrai texte net, mais une image de texte devient floue - le problème même derrière le redimensionnement du texte et le redistribution. Une personne qui a besoin d'une police précise, d'un espacement plus large ou d'un thème à fort contraste peut restyler le vrai texte et ne peut pas restyler votre JPG. Et la traduction du navigateur, qui sert discrètement bien des clients ontariens, fonctionne sur le texte et saute les mots pris au piège dans une image. Une photo de votre vitrine, c'est correct - la règle vise le texte présenté comme une image, pas le fait d'avoir des images.
L'Ontario l'exige-t-il vraiment?
C'est ici que j'ajoute d'habitude une nuance, parce que plusieurs critères qui valent la peine d'être traités sont des ajouts des WCAG 2.2 que l'Ontario n'exige pas encore. Pas celui-ci. Le 1.4.5 est de niveau AA dans les WCAG 2.0, soit la version exacte que le RNAI vise. Pour une organisation assujettie, présenter de l'information comme une image de texte alors que du vrai texte ferait l'affaire est à l'intérieur de la norme que la province exige déjà, pas d'un futur seuil de meilleure pratique.
Le revers honnête, c'est que la règle est plus étroite qu'elle en a l'air, alors ne surcorrigez pas dans la panique. Votre logo est correct; un logotype est explicitement exempté. Le texte réellement personnalisable, ou dont la présentation visuelle précise est essentielle au sens, est exempté lui aussi. Ce qui reste, c'est l'ordinaire - votre offre, vos prix, vos heures, votre texte courant - qui devrait être du vrai texte. Et l'intérêt de bien faire les choses, ce n'est pas le numéro du critère. Personne ne dépose une plainte au TDPO en citant « 1.4.5 »; une vraie cliente au lecteur d'écran arrive sur votre bannière « SOLDE » ou sur vos heures et n'en lit pas un mot, et c'est cette personne que vise le processus de plainte.
Comment le trouver et le corriger?
Le trouver est gratuit et prend une minute. Essayez de sélectionner les mots avec le curseur. Si vous pouvez surligner les lettres une à une, c'est du vrai texte; si le bloc entier se sélectionne comme une seule image, le texte est incrusté. Zoomez ensuite la page à 200-400 % et regardez ce qui devient flou, puis passez un lecteur d'écran sur la section pour entendre ce qui est réellement annoncé. Un scanneur en attrapera une partie, mais le jugement « est-ce une image de texte ou un visuel légitime » est l'une des raisons pour lesquelles un vrai audit vaut mieux qu'un simple scan.
Le corriger est une décision de construction, pas un widget. Reconstruisez la bannière en vrai texte HTML posé sur une image de fond ou un dégradé CSS, pour que le titre soit un véritable titre mis en forme en CSS - les polices web vous donnent n'importe quel caractère sans aplatir les lettres en pixels. Là où un visuel réellement graphique est incontournable, donnez-lui un texte de remplacement juste et assurez-vous que le contraste tient la route - mais traitez le texte de remplacement comme un plancher, pas la solution. Il permet à un lecteur d'écran d'annoncer le message, mais ça ne zoomera toujours pas proprement, ne se restylera pas pour la personne et ne se traduira pas. Une surcouche d'accessibilité ne peut pas non plus retransformer les pixels d'un JPG en texte; ça vit dans votre balisage et votre feuille de style, et c'est pourquoi le travail au niveau du code source est ce qui tient.
Quand vous faites le changement, gardez une note datée de ce que vous avez fait passer d'image à texte. Ce registre, versé dans un rapport de conformité en matière d'accessibilité, vaut bien plus qu'un badge si une plainte finit par arriver.
Vous voulez savoir sur quelles bannières un lecteur d'écran devient muet avant qu'une cliente le découvre? Rapport Vayle gratuit, environ 30 secondes : vayle.art. Il détecte les surcouches, révèle les vrais manquements aux WCAG et vous dit exactement ce qui s'applique légalement à votre organisation en Ontario. Sans obligation.
Vayle est un studio d'ingénierie de l'accessibilité à distance qui dessert l'Ontario. Information générale, pas un avis juridique.