Seit seiner Einführung im Jahr 2006 hat sich das HTML5-Format im Internet einen Namen gemacht und ist anstelle von Adobe Flash Player zum Standard-Videoformat geworden (was ist beendet).
Wenn heutzutage zahlreiche Programme Ihre Videos einfach einbetten können, bietet die manuelle Codierung in HTML5 endlose Anpassungs- und Hostingmöglichkeiten auf Ihrer Website.
Auf diese Weise können Sie insbesondere die Barrierefreiheitseinstellungen Ihres Videos an Ihre Bedürfnisse anpassen, indem Sie die gewünschten Untertitel hinzufügen.
So kodieren Sie Untertitel auf HTML5 korrekt.
Zunächst eine kleine Erinnerung an die Grundregeln für die Implementierung eines Videos in HTML5.
Der Code basiert auf dem Hinzufügen eines <video>Tags in Ihrem HTML. Das Kontrollen Tag stellt sicher, dass Ihr Videoplayer Wiedergabeoptionen anzeigt, wenn Sie ihn aktivieren. Sie können die Auflösung des Videos auch mit einstellen Weite und Höhe. Um auf dein Video zu verweisen, musst du das Quell-Tag hinzufügen src, spezifizieren Sie das Format Ihres Videos mit Art.
In der Regel wird das MP4-Format von allen Browsern unterstützt. Sie können jedoch ein OGG-Format hinzufügen, um sicherzustellen, dass Ihr Video für alle lesbar ist.
Was den Rest angeht, die id Das Tag identifiziert Ihr Video und das Hinzufügen eines Textes innerhalb des Video-Tags stellt sicher, dass der Benutzer vor einem Darstellungsfehler gewarnt wird.
So könnte eine Implementierung Ihres Videos aussehen:
Nun, wie zeigen Sie Untertitel in Ihrem Video an? Das einzige Untertitelformat, das von HTML5 unterstützt wird, ist VTT. Deshalb müssen Sie es entweder aus dem Transkript erstellen oder einen automatischen Untertitelgenerator verwenden.
Im ersten Fall ist hier das Format, auf das Sie sich verlassen können:
Im zweiten Fall können Sie verwenden unser VTT-Dateigenerator. Mit Sprache-zu-Text-Technologien können Sie Untertitel viel schneller erstellen. Sie können Ihr Projekt auch weitergeben zu unseren Untertitel-Experten wenn Sie ein größeres Volumen haben.
So können Sie schnell loslegen:
Lade dein Video hoch auf der Schnittstelle. Wählen Sie die Originalsprache und die, die Sie erhalten möchten.
Wenn der Transkriptionsvorgang abgeschlossen ist, können Sie auf den Untertiteleditor zugreifen und das Ergebnis optimieren.
Wenn Ihre Arbeit beendet ist, können Sie die Untertiteldatei exportieren, indem Sie auf „Exportieren“ klicken und die VTT-Datei herunterladen.
Danach müssen Sie, um den Untertitel im HTML5-Code zu implementieren, ein <track>Tag wie folgt hinzufügen:
Das Beschriftung Tag gibt den Titel Ihres Untertitels an, nett identifiziert, ob es sich um subtile oder Bildunterschriften handelt, srclang definiert die Sprache und src die Lokalisierung Ihrer Datei.
Sie können diesen Code dann wie folgt hinzufügen:
Das Video wird dann automatisch angezeigt. Beachten Sie auch, dass Sie so viele Sprachen hinzufügen können, wie Sie möchten, indem Sie ein Tag hinzufügen.
Manual HTML5 ist interessant, weil es viele Möglichkeiten bietet, das Erscheinungsbild Ihrer Untertitel anzupassen.
Um ihren Stil festzulegen, füge ein <style>CSS-Tag hinzu und füge dann #grow_audience:: cue {} hinzu,
In cue {} finden Sie hier alle Tags, die Sie verwenden können:
So sieht es aus:
Damit erhalten Sie die Untertitel, die perfekt zu Ihren Bedürfnissen passen. Wir hoffen, wir haben Ihnen bei den Feinheiten des HTML5-Codes weitergeholfen.
