# Un émoji décoratif dans un titre, épelé lettre par lettre par un lecteur d’écran > « Étoile étoile étoile », annonce le lecteur d'écran au début d'un titre d'article. L'origine du bug ne se trouve pas où on l'imagine en premier lieu. - Auteur : WordPress Développement - Publié le : 2025-03-18 - Mis à jour le : 2025-03-18 - Catégorie : Accessibilité - URL : https://wpmoderne.dev.wordpress-developpement.fr/accessibilite/emoji-decoratif-titre-epelle-lecteur-ecran/ ## L’essentiel - Un emoji Unicode dispose souvent d'un nom prononcé par défaut - aria-hidden retire l'emoji décoratif de l'arbre d'accessibilité - Vérifier le rendu vocal réel, pas seulement la présence d'un attribut « Étoile scintillante, étoile scintillante, étoile scintillante, Cinq astuces pour accélérer votre thème WordPress » : c'est ce qu'annonce VoiceOver au survol du titre d'un article de blog qui affichait pourtant, visuellement, « ✨✨✨ Cinq astuces pour accélérer votre thème WordPress ». Le rédacteur avait ajouté ces trois émojis en début de titre pour attirer l'œil dans un fil de publications, une pratique éditoriale courante, sans se douter qu'ils seraient intégralement épelés par le lecteur d'écran. ## Diagnostic : le nom Unicode d'un emoji n'est pas silencieux par défaut Un caractère emoji reste, du point de vue du DOM, un caractère textuel comme un autre. Contrairement à une image insérée via ``, qui peut recevoir un attribut `alt` vide pour signaler son caractère purement décoratif, un caractère Unicode inséré directement dans le texte d'un titre est traité par les technologies d'assistance comme n'importe quel autre mot : elles annoncent son nom Unicode officiel, tel que défini par le Consortium Unicode et interprété par le moteur de synthèse vocale du système d'exploitation. ```

✨✨✨ Cinq astuces pour accélérer votre thème WordPress

``` Ce marquage, syntaxiquement irréprochable, ne contient aucune erreur de balisage : le problème vient entièrement du choix éditorial d'insérer un caractère décoratif directement dans le flux de texte principal, sans aucun moyen pour une technologie d'assistance de le distinguer d'un contenu porteur de sens. ## Ce que révèle un test avec plusieurs lecteurs d'écran > L'essentiel à retenir : Un emoji Unicode dispose souvent d'un nom prononcé par défaut ; aria-hidden retire l'emoji décoratif de l'arbre d'accessibilité ; Vérifier le rendu vocal réel, pas seulement la présence d'un attribut Le comportement exact varie selon le lecteur d'écran et le moteur de synthèse vocale utilisé, ce qui complique encore le diagnostic pour une équipe qui ne teste qu'avec un seul outil. VoiceOver sur macOS annonçait le nom complet « étoile scintillante » pour chaque occurrence du caractère, répété trois fois. NVDA, avec le moteur de synthèse par défaut, prononçait une description plus courte mais tout aussi redondante. Dans les deux cas, l'utilisateur devait écouter une séquence de mots sans rapport avec le contenu de l'article avant d'atteindre le titre réel, ce qui allonge inutilement chaque annonce de titre dans une liste d'articles, en particulier lors d'une navigation rapide par élément de titre (touche H dans la plupart des lecteurs d'écran). ## Pourquoi ce n'est pas seulement un problème d'esthétique vocale Le critère WCAG 1.1.1 « Contenu non textuel » impose qu'un contenu non textuel purement décoratif soit ignoré par les technologies d'assistance, exactement comme le critère RGAA 1.3, qui vérifie que chaque image de décoration est correctement ignorée. Un emoji répété en préfixe de titre, sans intention informative, relève de la même logique : il ne porte aucune information supplémentaire par rapport au texte du titre, et sa présence sonore répétée constitue une gêne réelle, pas seulement un désagrément esthétique, pour quelqu'un qui parcourt une liste de dizaines d'articles au clavier. ## Les corrections possibles, de la plus simple à la plus radicale - Retirer l'emoji du titre lui-même et le déplacer dans un élément visuel séparé, marqué `aria-hidden="true"`, placé avant le texte du titre - Envelopper l'emoji dans un `