Comment puis-je remplacer la prononciation d'un mot d'un lecteur d'écran dans une phrase sans l'interrompre à mi-phrase?

Question

Disons que j'ai la phrase suivante en HTML:

<p>Please enter your licence number</p>

Le mal prononce le mot 'licence' de lecteur d'écran comme "Liss-ens" (orthographe phonétique). Il devrait être prononcé "poux-ens" (orthographe phonétique). Je veux résoudre ce problème en fournissant une orthographe phonétique à l'écran-lecteur, tout en ayant le texte visuellement l'apparence identique.

Je pourrais utiliser <span> s, aria- attributs et style comme suit:

<p>Please enter your <span aria-hidden="true">licence</span><span style="position: absolute; left: -10000em;">license</span> number</p>

Cela fonctionne assez bien, sauf que le lecteur d'écran (je teste avec VoiceOver sur Mac OS) met en pause quand il arrive au premier intervalle, me forçant à appuyer sur [VO] + [Flèche droite] pour passer au mot suivant:

"Veuillez entrer vos poux" ... [VO] + [Flèche droite] ... " -ens "... [VO] + [Flèche droite] ..." numéro "

Je veux que le lecteur d'écran lise la phrase sans interruption.

Est-ce possible? Ou ne devrais-je pas essayer de contrôler cela?

Answer 1

Ne le faites pas.

Vraiment, ne vous inquiétez pas à ce sujet. Je sais que cela semble banal mais c'est un véritable conseil basé sur des années de travail avec des utilisateurs de lecteurs d'écran (et en essayant de faire ce que vous essayez de faire).

La plupart des utilisateurs de lecteurs d'écran connaissent déjà la façon dont les mots sont prononcés par leurs outils, les bizarreries associées aux abréviations, aux dates, aux heures, etc .. En essayant de le surcharger, vous risquez de dérouter vos utilisateurs.

Si vous parlez à un utilisateur de lecteur d'écran, vous trouverez probablement que cela est vrai. Il est si commun une question qu'il est venu encore une fois sur la liste de diffusion WebAIM cette semaine: http://webaim.org/discussion/mail_message?id=34398

note ce commentaire perspicace du fil:

En fait, parfois, si vous écoutez très attentivement un écran Parler à un utilisateur qui lit, vous pouvez comprendre que nous prononcerons des mots de la même manière que nos lecteurs d'écran - et nous n'en sommes même pas conscients.

Certainement ne le font pas essayer de reformater <ruby>. En général, si vous ne comprenez pas un élément, ne l'utilisez pas, et certainement pas comme un hack. Cela peut causer des problèmes pour les personnes qui essaient d'auto-traduire le contenu.

De même, n'utilisez pas de piratage si vous n'êtes pas prêt à test it across all screen reader and platform combinations (y compris plusieurs versions de chaque lecteur d'écran et navigateur). Enfin, rappelez-vous qu'environ 1/3 of screen reader users have vision, donc parfois la prononciation forcée perturbe ce qu'ils voient à l'écran.

Answer 2

Je pense avoir trouvé une solution. Cela semble fonctionner avec VoiceOver sur MacOS. (Ai pas testé avec d'autres lecteurs d'écran tels que JAWS.)

La solution est de reformater l'élément <ruby>, en utilisant le CSS pour remplacer son style:

Please enter your 
<ruby> 
    <rt aria-hidden="true" style="font-size: 1em"><!--Standard-->licence</rt> 
    <rt style="display: inline-block; width: 1px; height: 1px; overflow: hidden"><!--Phonetic-->license</rt> 
</ruby> 
number 

Cette affiche la chaîne correcte et aussi lit avec la prononciation phonétique sans pause.

Mais je suis ouvert à d'autres/meilleures solutions. Ou la critique de la question elle-même. :)