Texte alternatif d'un QR code : web, e-mail, PDF et imprimé

Une newsletter part vers 12 000 abonnés avec un grand code au centre et, pour texte alternatif, « QR code ». Une abonnée qui utilise un lecteur d'écran entend « image, QR code », et rien d'autre : ni la destination, ni l'intérêt, ni le lien. Elle supprime le message, comme tous ceux dont la messagerie bloque les images et qui voient ces deux mêmes mots à la place.

Le texte alternatif d'une image QR échoue d'une manière précise et réparable. Le sujet plus large est traité dans notre article sur rendre les codes utilisables par tous. Voici la version étroite : ce qu'il faut écrire dans l'attribut, et ce qu'il faut placer à côté de l'image, parce que l'attribut seul ne suffit jamais.

Décrire la destination, pas le graphique

« QR code » décrit l'image. Personne n'a besoin qu'on lui décrive l'image. Une personne qui écoute a besoin de savoir où cela mène et pourquoi elle y irait.

Faible : QR code. Faible aussi : scannez-moi. Un peu mieux et toujours inutile : QR code vers notre site.

Utile : « Carte du soir du Bar Vega. » Ou « S'inscrire à la formation sécurité d'octobre. » Ou « Suivre l'avancement de votre réparation. » Le schéma est destination plus objet, dans les mots les plus simples possibles, assez court pour être saisi à la première écoute.

Supprimez le mot « image » et supprimez le mot « code ». Les lecteurs d'écran annoncent déjà que l'élément est une image, donc « image d'un QR code pour... » fait subir à l'auditeur des mots redondants avant d'arriver à quoi que ce soit d'exploitable.

L'image n'est pas l'essentiel, le lien l'est

Voici la partie que le balisage seul ne peut pas résoudre. Même un texte alternatif parfait ne donne à un utilisateur de lecteur d'écran aucun accès à la destination, car un QR code est un format optique. Le lire suppose de pointer une caméra dessus. Quiconque entend parler du code sur le téléphone même qui devrait pointer ne peut pas scanner son propre écran, voyant ou non.

D'où la règle pour tout code affiché à l'écran : mettez le vrai lien à côté, en texte. Pas une image décorative d'URL. Un véritable élément de lien, avec un intitulé significatif qu'un lecteur peut activer.

Une fois ce lien en place, l'image devient décorative pour les personnes qui peuvent s'en servir. Donnez-lui un attribut alt vide (alt="") et laissez le lien texte porter le sens. Un lecteur d'écran annonce alors une chose au lieu de deux presque identiques. Si aucun lien texte adjacent n'existe pour une raison quelconque, l'image a besoin d'un texte alternatif descriptif et doit elle-même être enveloppée dans un lien vers la même destination.

Web, e-mail et PDF se comportent différemment

Web. Les règles habituelles de l'attribut alt s'appliquent. Décidez d'abord si l'image est informative ou décorative, puis écrivez la phrase destination-plus-objet ou utilisez un alt vide. Ne supprimez jamais l'attribut entièrement ; un attribut manquant fait retomber certains lecteurs d'écran sur le nom de fichier, et c'est ainsi que des auditeurs finissent par entendre « q r tiret bas final tiret bas v 4 point p n g ».

E-mail. Le texte alternatif fait ici double emploi, car beaucoup de clients bloquent les images distantes jusqu'à autorisation. Ce texte est ce que tout le monde voit au premier rendu, pas seulement les personnes utilisant une technologie d'assistance. Gardez-le court, assurez-vous qu'il est lisible sur le fond, et ajoutez toujours une ligne d'URL en clair. Exporter le code en PNG rend le rendu prévisible, car les clients de messagerie traitent les formats vectoriels de façon au mieux inégale.

PDF. Le texte de remplacement existe bel et bien en PDF, défini sur une figure balisée, et la plupart des exports ne le définissent jamais. En pratique : activez le balisage dans les réglages d'export de votre logiciel de mise en page, ajoutez un texte de remplacement à l'image du code, puis vérifiez avec le contrôleur d'accessibilité intégré à un lecteur PDF. Un export non balisé remet au lecteur d'écran une page de formes sans étiquette.

L'imprimé n'a pas d'attribut alt, donc l'URL est le texte alternatif

Sur une affiche, un chevalet de table, une étiquette d'expédition ou une signalétique murale, il n'y a aucune couche de balisage. L'aménagement équivalent, c'est une URL courte et lisible par un humain, imprimée à côté du code, à une taille qui permet de la lire et de la taper.

Tapable est le mot clé : pas de longues chaînes de paramètres, pas d'identifiant d'allure aléatoire, idéalement un chemin qu'une personne peut recopier depuis l'autre bout de la pièce. Un lien court bien fait remplit exactement ce rôle. La même ligne sauve quiconque a un téléphone ancien, une batterie à plat, un objectif rayé, ou aucun réseau dans ce couloir de sous-sol.

Tant que le fichier est ouvert, vérifiez aussi le contraste. Les personnes malvoyantes et les capteurs bon marché échouent sur les mêmes designs, et nos règles de contraste indiquent où se situent les seuils. Tailles, marges et réglages de sortie pour les supports physiques sont dans le guide d'impression.

Et en France ?

Pour les services publics, l'accessibilité ne s'arrête pas aux pages web : le RGAA couvre aussi les documents bureautiques mis en ligne, en particulier les PDF. Un formulaire, un règlement ou une brochure en PDF qui contient un QR code doit donc proposer une alternative textuelle à cette image, et, idéalement, le lien cliquable juste à côté.

C'est une bonne pratique pour tout le monde : dans un PDF lu à l'écran, un code ne sert presque à rien, puisque le lecteur est déjà sur l'appareil qui devrait le scanner. Un lien cliquable avec un texte explicite (« Prendre rendez-vous en ligne ») rend le même service, pour tous les lecteurs.

Tout le monde ne peut pas tenir une caméra bien stable

Viser une petite cible avec un téléphone et le tenir immobile demande de la précision. Une personne qui tremble, qui a peu de force dans la main, qui se déplace en fauteuil face à un code placé à hauteur d'yeux debout, ou qui porte un enfant de l'autre bras : toutes arrivent devant votre code avec un appareil qui aura du mal à faire la mise au point.

Ce qui aide :

• Un code plus grand. Des modules plus larges tolèrent flou, angle et tremblement bien mieux que des petits. La taille est l'amélioration d'accessibilité la moins chère disponible sur tout code physique.
• Une charge utile plus courte. Moins de caractères encodés signifie un numéro de version plus bas et des modules physiquement plus grands à dimensions égales.
• L'URL en clair, encore. C'est le recours pour tous les modes d'échec à la fois.
• Un second canal. Une cible NFC à toucher, un numéro de téléphone, ou une personne à l'accueil capable d'aider.
• Des applications de scan dédiées. Certaines tolèrent mieux le mouvement que l'appareil photo par défaut et lisent le résultat à voix haute ; nos notes sur les outils de scan détaillent les différences.

La hauteur de pose compte autant que tout cela. Un code placé à hauteur d'yeux d'un adulte debout se trouve hors de portée confortable pour une personne assise, et un code à hauteur de genou est mauvais pour tout le monde. Quelque part entre une poignée de porte et un interrupteur convient à plus de corps que l'un ou l'autre extrême.

Ouvrez les trois derniers e-mails envoyés par votre équipe et regardez l'attribut alt de chaque image. Réécrivez tout ce qui dit « QR code » en une phrase nommant la destination, puis vérifiez qu'un vrai lien texte figure à côté de l'image. Cette passe prend une dizaine de minutes et corrige la version la plus courante de ce problème.