Nicht zuletzt für Mobile kann es interessant sein, eine Art Story mit der Website zu erzählen. Denn unterwegs ist es oft einfacher, sich etwas vorlesen zu lassen, als auf dem MiniScreen zu lesen.
articulate.js verwendet die Sprachsynthese-Schnittstelle der „Web Speech API“. Unterstützt werden auch die neuesten Versionen von Edge, Safari, Chrome, Opera, Firefox, iOS Safari und Chrome für Android. Das sehr schlanke articulate.js Plugin (ca. 6K) ermöglicht es die leistungsstarken Selektor-Optionen von jQuery zu nutzen, um festzulegen welche Teile der Web-Seite auch „ausgesprochen“ werden können/sollen.
Je nachdem, wie die Web-Seite organisiert ist, kann eine einzelne Codezeile den Browser anweisen, den gesamten Inhalt eines Artikels oder Blog-Posts zu sprechen:
$('h1,h2,p').articulate('speak')
Intern klont articulate.js den Satz von DOM Elementen und alle ihre kaskadierenden Subelemente und Textnodes. Es analysiert dann diesen Klone, um entsprechend den Anweisungen zu entscheiden, was gesprochen und was ignoriert werden soll.
articulate.js:
- Links (Buttons), die dem Benutzer erlauben, anzuhalten, fortzusetzen und die Sprachausgabe zu beenden.
- Ändern der Rate und der Tonhöhe der Sprechstimme.
- Basierend auf HTML-Tags: Was wird gesprochen, was ignoriert.
- Regeln: Etwa alle Vorkommnisse von „d.h.“ sollen als „das heißt“ gesprochen werden.
- Wiederkehrende Textblöcke, die immer ignoriert werden sollen: Ein Satz „klicken Sie hier für weitere Informationen“ muss nicht gesprochen werden.
- Mit speziell gestalteten Kommentar-Tags Texte hinterlegen, die nur gesprochen werden sollen, also nicht auf dem Bildschirm sichtbar sein sollen.