Sprach-Widget-Code für Barrierefreiheit: eine Audio-Option für alle Besucher
Manche Besucher hören lieber zu, als zu lesen. Ein Sprach-Widget bietet ihnen mit einer Zeile Code eine Audio-Option. So richten Sie es durchdacht ein.
Veröffentlicht:
Nicht jeder Besucher liest eine Seite auf dieselbe Weise. Menschen mit eingeschränktem Sehvermögen, Leseschwierigkeiten oder müden Augen, und auch Menschen, die einfach nebenbei etwas anderes tun, hören oft lieber zu. Ein Text-to-Speech-Widget bietet ihnen diese Option auf Abruf, neben Ihren bestehenden Inhalten.
Ein Sprach-Widget ist eine zusätzliche Option, kein Ersatz für barrierefreies HTML. Saubere Überschriften, Alternativtexte, Kontrast und Tastaturnavigation bleiben wichtig, und Nutzer von Screenreadern sind darauf angewiesen. Das Widget ergänzt sie um einen bequemen Weg zum Zuhören.
Das Widget hinzufügen
Erstellen Sie ein Widget vom Typ Sprache unter Widgets und kopieren Sie den Code:
<script src="https://api14.com/widget.js" data-widget="YOUR_WIDGET_ID" async></script>
Ein guter Platz ist am Anfang langer Artikel oder Hilfeseiten, mit einer kurzen Beschriftung wie „Diesen Text anhören“. Besucher fügen eine Passage ein oder tippen sie, hören sie vorgelesen und können das Audio bei Bedarf über einen Download-Link behalten.
Hilfreiche Einstellungen
- Klare Beschriftungen: Schreiben Sie Titel und Beschriftung der Schaltfläche so, dass sie genau sagen, was passiert, zum Beispiel „Vorlesen“.
- Ein hilfreicher Platzhalter: Sagen Sie Besuchern, was sie einfügen können, etwa „Fügen Sie einen Absatz ein, um ihn zu hören“.
- Eine freundliche Fehlermeldung: Geht etwas schief, sehen Besucher Ihre Nachricht statt eines technischen Fehlers.
- Design: Das Design Wie beim Besucher folgt der hellen oder dunklen Einstellung des Besuchers, die viele Menschen aus Komfortgründen wählen.
- Eine ruhige Stimme: Wählen Sie eine klare Stimme mit gemäßigtem Tempo und testen Sie sie mit Ihrem eigenen Text.
Zuverlässig halten
Eine Barrierefreiheitsfunktion, die nicht mehr funktioniert, ist schlechter als gar keine. Setzen Sie daher Schutzmaßnahmen:
- API-Schlüssel: Jedes Widget läuft unter einem Ihrer API-Schlüssel. Nutzen Sie einen eigenen (die letzte Option in der Schlüsselliste des Editors ist Neuen API-Schlüssel erstellen) und geben Sie ihm ein tägliches Ausgabenlimit, mit dem Sie gut leben können.
- Benachrichtigungen: Aktivieren Sie E-Mail an mich, wenn ein Widget ausfällt unter Einstellungen, Widget-Steuerung. Sie erhalten höchstens eine E-Mail pro Widget und Tag, wenn etwas schiefgeht, das Sie beheben können, etwa ein leeres Guthaben.
- Zustand auf einen Blick: Die Widget-Liste zeigt, wann jedes Widget zuletzt genutzt wurde und welcher Fehler zuletzt auftrat.
Ihre Websites zulassen
Tragen Sie die Domains, auf denen das Widget laufen darf, unter Einstellungen, Widget-Websites ein. Für lokale Tests fügen Sie localhost:3000 oder den von Ihnen genutzten Port hinzu.
Mehr über Sprachmodelle erfahren Sie in der Sprach-Dokumentation, Ihr Widget richten Sie auf der Widgets-Seite ein.