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

<!-- this page is valid HTML 5 -->

Firefox 3.5 (und andere Browser) und das video Tag

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

• Hier eine ausführliche Anleitung zur Verwendung des video und audio Tags von Mozilla.
• 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 die erste Option "Tuff - the Magics" 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
• Kommentare zu diesem Thema gerne in meinem Blog

Tweet

Nachtrag - neue Entwicklungen

13.01.2010: Bruce Lawson von Dev.Opera zeigt, wie man mit ein wenig Javascript HTML 5 Videos untertiteln kann. Und hier die Demo zum Artikel.

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.