Sie haben JavaScript deaktiviert. Vermutlich sind Sie ein Kollege und wollen nur sehen, ob meine Website auch ohne JavaScript funktioniert.
Andernfalls: Bitte aktivieren Sie JavaScript!

webdesign weisshart Startseite

zurück zum Standard-Style

Video-Untertitel automatisch erstellen

Videobeschreibung

Der folgende Imagefilm der Gemeinde Bernau am Chiemsee zeigt für die Region typische Szenen: Alphornbläser – Wanderer – die Kampenwand, Bernaus Hausberg – Klettern auf der Kampenwand – Paragliding – Radwandern, Mountainbiking – Paddeln auf dem See mit einem SUV (stand up paddeling board) – Fischer auf dem See – Sonnenuntergang – eine zünftige Brotzeit – Tanzen in bayrischer Tracht.

© Tourist-Info Bernau am Chiemsee 2022

Die WCAG / BITV fordern für barrierefreie Webseiten:

"Wenn die Tonspur eines aufgezeichneten Videos Informationen enthält, müssen Untertitel als Alternative bereitgestellt werden."

Die technische Umsetzung dieser Forderung ist recht einfach. Einfach das video-Tag um das track-Element erweitern, um die Datei untertitel.vtt einzubinden:

<track src="untertitel.vtt" kind="subtitles" srclang="de" label="Deutsch" default>

Das "default" im track-Element schaltet die Untertitel im Video-Player automatisch ein.

Diese .vtt-Datei kann man natürlich manuell erstellen, wie hier beschrieben.

Aber ein geniales neues (und kostenloses) Tool macht das automatisch, und zwar in hervorragender Qualität: Aiko für Mac, iPhone und iPad

Die Untertitel in obiger Demo sind mit Aiko erstellt.

Creative Commons Lizenzvertrag

Artikeltexte und Code-Snippets: Creative Commons CC BY-SA 4.0
Medien (Bilder, Videos, Audios) sind evtl. urheberrechtlich geschützt.

Kommentare

Über Ihren Kommentar zu diesem Artikel freue ich mich.
Wenn Sie aber Fragen haben, und eine Antwort erwarten, nutzen Sie bitte das Supportforum! Die Nutzung des Forums ist auch ohne Registrierung möglich.

? Anweisungen zur Eingabe von BB Code Wenn Javascript verfügbar ist, können Sie die obigen Schaltflächen zum Einfügen der folgenden Steuercodes verwenden (an der Cursorposition oder um gegebenenfalls markierten Text):

[b]als wichtig <strong>[/b] hervorgehobener Text
[c]Quellcode[/c] oder optisch hervorgehobenes Zitat