5 Möglichkeiten zur Nutzung der HTML5-Elemente

Die Einbettung von Video- und Audioelementen in Webseiten wurde und wird seit langer Zeit von Adobes proprietärer Flash-Technologie dominiert, die sich unter verschiedenen Einzellösungen der verschiedenen Firmen letztendlich durch die weiter Verbreitung auf der Nutzerseite und der Nutzung auf populären Plattformen wie Youtube durchsetzte. Mittlerweile gibt es einen Arbeitsentwurf von HTML5, der video- und Audiotags zur Einbindung der entsprechenden Inhalte vorsieht und beispielsweise in den aktuellen Versionen von Mozilla Firefox, Google Chrome und Apples Safari bereits implementiert sind.

Möchte man diese Elemente nun benutzen, stößt man unweigerlich auf verschiedene Probleme, die sich nicht so einfach lösen lassen. Zunächst sieht der Entwurf keine Codecs als Standard vor. Die patentgebührfreien Codecs Vorbis und Theora standen zwar zunächst im Entwurf, wurden jedoch auf Betreiben von Nokia wieder gestrichen. Die Folge ist nun, dass jeder Browserhersteller einen anderen Weg gewählt hat, die Tags zu implementieren und dabei verschiedene Codecs verwendet werden. Mozilla hat sich beispielsweise entschlossen, nur die patentgebührenfreien Codecs der ogg-Familie zu unterstützen, Apple unterstützt standardmäßig nur das ohnehin schon durch Quicktime unterstützte h264 und Google hat Lizenzen für die patentierten Codecs gekauft und unterstützt über ffmpeg beides.

Das nächste Problem ist dann natürlich, dass die meisten anderen Browser, wie der Internet Explorer, Opera oder zahlreiche Andere die Tags noch nicht unterstützen und darüber eingebundene Inhalte von Benutzern dieser Browser daher nicht gesehen werden. Ein etwas untergeordnetes Problem ist noch die Tatsache, dass viele aktuelle Webseiten auf XHTML aufbauen und daher bei Verwendung der HTML5-Elemente nicht mehr als valide gewertet werden.

Damit ist auch klar, dass die erste Option, nämlich die video- und audio-Elemente direkt zu verwenden zwar einfach ist und gut funktioniert, aber momentan nur bei Benutzern der aktuellsten Versionen der oben genannten Browser funktionieren und daher nur einen geringen Teil der momentanen Internetnutzer erreichen. Um diese Probleme zu lösen oder zumindest abzumildern, haben sich verschiedene Projekte entwickelt, die ich hier kurz vorstellen möchte.

Das erste in der Reihe ist das von mir auch im Blog verwendete Tool ITheora, dessen Name eine Art Erwiderung auf den der populären Videoplattform Youtube ist. (“You tube – I Theora”) Es handelt sich dabei um ein php-Skript, das auf dem Webserver installiert wird. Es setzt dabei (fast) ausschließlich auf Theora als Videocodec und bindet Videos in diesem Format über das object- oder für den Internet-Explorer auch iframe-Tag ein. Über Javascript wird dann getestet, welchen Browser der Zugreifende benutzt und automatisch eine Abspielvariante ausgewählt. Die Möglichkeiten sind entweder das video-Tag aus HTML5, ein lokal installiertes Plugin (beispielsweise mplayer oder vlc) oder ein Java-Applet. Optional kann das Video auch zusätzlich über den Flashplayer eingebunden werden, sofern alle anderen Möglichkeiten fehlschlagen. Das Skript bietet darüber hinaus noch einige Komfortfunktionen wie die Angabe der Dauer und Auflösung des Videos, die Möglichkeit das Video direkt herunterzuladen oder die Ausgabe eines Codes, um das Video in fremde Webseiten einzubetten. Nach meiner Erfahrung funktioniert diese Variante ziemlich gut, auch wenn das Skript noch ein paar Schwächen in der Programmierung hat.

Mit etwas weniger Funktionen geht Mv_embed einen ähnliche Weg wie ITheora. Es handelt sich dabei jedoch um eine reine Javascript-Bibliothek. Die angebotenen Optionen sind dabei in etwa die Selben. Zur Installation muss man nur eine einzige Datei auf dem Webserver ablegen und diese in das HTML-Dokument einbinden. Videos werden dann einfach über das video-Tag eingebunden und vom Skript bei Aufruf der Seite passend umgemodelt. Das Skript ist allerdings nicht auf ein Format fixiert, sondern akzeptiert auch h264- und Flashvideos als Eingabe. Auch wenn es ebenfalls die wichtigsten Komfortfunktionen bietet, bleibt als kleiner Nachteil, dass die Videos unabhängig von der Auflösung immer in der selben Größe wiedergegeben werden, wodurch der Benutzer auch bei höheren Auflösungen auf ein kleines Fenster festgelegt ist. In der Praxis schlug der Versuch, den Javascript-Code auszuführen, leider in manchen Browsern komplett fehlt.

Eine ganz ähnliche Lösung kommt von Google und wirbt damit, zu mehr als 95% der Browser kompatibel zu sein. video4all basiert ebenfalls auf Javascript und benötigt das Video als ogg und mp4, eingebunden mit dem video-Tag. Dieses wird dann ebenfalls mit Browserspezifischen Technologien entsprechend umgeschrieben und das Video per video-Tag je nach Browser als mp4 oder ogg oder per Flashplayer in der h264-Variante eingebunden. Das Google-Tool funktioniert leider nicht in Browsern, die weder die HTML5-Elemente unterstützen noch ein Flashplugin installiert haben. Außerdem fehlen im sämtliche Komfortfunktionen.

Einen ähnlichen Namen aber einen anderen Ansatz verfolgt Video for Everybody!. Es basiert vollständig auf HTML und funktioniert auch ohne Javascript. Es erwartet ebenso eine Version des Videos als mp4 und eine als ogg und bindet diese je nach Browser passend ein. Browsern mit entsprechender Unterstützung wird damit ebenfalls das passende Video mit dem video-Tag serviert, wenn das nicht funktioniert wird Quicktime probiert und anschließend die Einbindung per Flash. Schlägt das alles fehl, kann man immer noch das Video direkt herunterladen.

Grundsätzlich stellt sich also immer die Frage, welche Technologien man einsetzen möchte, um das gewünschte Ziel zu erreichen, wie viele Leute man erreichen möchte und wie viel Aufwand zu betreiben man bereit ist. Will man wirklich alle (oder zumindest so gut wie alle) Benutzer erreichen, muss man jedes Video auf jeden Fall doppelt kodieren und sich eine passende Lösung heraussuchen. Möchte man aus ideologischen oder praktischen Gründen nur eine Variante des Videos kodieren, muss man zwangsläufig damit rechnen, dass ein Teil der Nutzer es nicht sehen kann. Ein Vorteil gegenüber der heute vorherrschenden reinen Flash-Variante ist aber auf jeden Fall, dass man in den meisten Fällen das Video auch direkt herunterladen und außerhalb des Browsers wiedergeben kann. Der Weg zu einer einheitlichen Lösung zur Einbindung von Videos im Browser wird aber auf jeden Fall noch weit, so lange sich die Browserhersteller nicht einmal auf ein Standardformat einigen könne. Die in diesem Artikel vorgestellten Tools stellen jedoch hoffentlich für den einen und anderen eine Alternative dar, um mit den auftretenden Problemen umzugehen.

  • Digg
  • Technorati
  • Wikio
  • del.icio.us
  • Facebook
  • MySpace
  • Twitter
  • Google Bookmarks
  • MisterWong.DE
  • Identi.ca
  • Slashdot
  • Yigg
  • StumbleUpon
  • email
  • RSS
  • PDF

Ähnliche Artikel:

2 Kommentare

  1. jan:

    Zum Problem in Verbindung mit XHTML sollte man vielleicht noch ergänzen, dass es eine XHTML-Version von HTML 5 gibt (ich habe gerade keinen Link, da ich den Kommentar von meinem Handy schreibe und der Akku bald leer ist). Ich setze das so schon auf cms-db.de ohne größere Probleme ein (allerdings nur im Bereich der deutschen Website). Der Doctype ist auch deutlich kürzer, so dass man sich den endlich merken kann. Man muss allerdings beachten, dass es außer & < und > keine benannten Entities gibt.

  2. jan:

    Die Entities wurden wohl automatisch entfernt, aber ich denke, dass klar ist, was gemeint war.

Trackbacks/Pingbacks

Einen Kommentar hinterlassen