Sie sind hier: Startseite · Artikel · Demo <video> Tag

Firefox 3.5 (und andere Browser) und das video Tag

Dieser Artikel ist überholt, und durch diesen Artikel ersetzt.

Ein Versuch mit dem <video> Tag von HTML 5. Der Firefox 3.5 spielt damit Videos im open video format (Ogg Theora) ohne Flash oder ein anderes Plugin ab. Ein interessanter Ansatz.

Barrierefreiheit

Mozilla scheint auch hinsichtlich Barrierefreiheit auf einem guten Weg zu sein.
Das Video kann mit der Tastatur gestartet und gestoppt werden. Mit Tab den Fokus auf das Video legen (erkennbar an der Helligkeitsänderung des Rahmens), und dann mit der Leertaste starten und stoppen. Mit den Pfeiltasten rechts und links kann vor- und zurückgespult werden.

Oder:
Das Kontextmenü (rechte Maustaste oder Umschalt + F10): Abspielen/Anhalten und Ton aus/an

Oder:
Mit ein wenig Javascript lassen sich die Buttons zur Steuerung erstellen. Die Bedienung mit der Tastatur (und mit Screen Readern) ist damit abgehakt - immer vorausgesetzt, der Firefox 3.5 ist installiert :-)

Bemerkungen

• Was noch fehlt: Einbindung von Untertiteln mittels externem (xml)File und Audiodescription. Aber beides ist leider im HTML 5 Entwurf nicht vorgesehen.
• Der Google Chrome Browser in der Version 3 (derzeit Beta) untestützt das video Tag. Kleinere Bugs sind in einer Beta nicht verwunderlich.
• Der Safari Browser Version 4 / Win macht Probleme besonderer Art. Safari erwartet das Video im mpeg4 Format. Man kann dies ohne weiteres berücksichtigen, indem man einfach ein weiteres source File in den video Tag einbaut. Aber das bedingt natürlich doppelte Datenhaltung. Hier in der Demo hab' ich das nur für 2 Videos umgesetzt. Ausserdem scheint der Safari das Video nicht zu streamen, sondern er wartet, bis der Film komplett geladen ist. Das ist natürlich vollkommen unakzeptabel.
• Testseite für das audio Tag

Nachtrag - neue Entwicklungen

13.01.2010: Bruce Lawson von Dev.Opera zeigt, wie man mit ein wenig Javascript HTML 5 Videos untertiteln kann.

02.03.2010: Jetzt hat auch Opera nachgezogen. In der aktuellen Version 10.50 werden natives <video> und <audio> unterstützt. Damit bleibt dem Internet Explorer (auch in der neuesten Version 8) die zweifelhafte Ehre, dies als einziger Browser nicht zu beherrschen.

04.03.2010: Und noch ein guter Artikel mit vielen Details.

18.11.2011: Klar, auch das iPhone kann HTML5 Videos. Dazu muss das Video ins richtige Format .m4v konvertiert werden, und diese Version alternativ angeboten werden. Der Browser sucht sich das passende Format. m4v versteht übrigens auch der Safari auf dem Mac, so dass die .mp4 Version entfallen kann.
Wieder habe ich das nur für die erste Option "Tuff - the Magics" umgesetzt.

Und noch ein Nachtrag: Der Safari-Browser setzt anscheinend eine Installation von Quicktime voraus, um HTML5 Videos zu spielen. Auf dem Mac oder iPhone dürfte diese Voraussetzung immer erfüllt sein. Nicht jedoch unter Windows. Falls also mal jemand im Safari/Win das Video nicht zu Laufen bringt: Nachschauen, ob Quicktime installiert ist.