Per HTML5-Tag soll es laut W3C-Spezifikation möglich sein, in HTML-Websites multimediale Elemente wie Audio- oder Videodateien einbinden zu können. Bisher war dies nur unter Verwendung externer Browser-Plug-Ins wie Flash, Quicktime oder DivX möglich, die zwar (im Moment) kostenlos sind, jedoch nur von Drittanbietern wie Adobe oder Apple angeboten werden. Damit macht man sich zum Einen abhängig von kommerziell orientierten Unternehmen (Wer weiß, ob Adobe nicht irgendwann Geld für den Flash-Player verlangt?), zum Anderen unterscheidet sich die Art der Einbindung solcher Multimedia-Elemente von Fall zu Fall, was dem Entwickler diese Aufgabe nicht gerade erleichtert. Der HTML5-Standard implementiert die beiden Tags <audio> und <video>, die diese Einschränkungen umgehen sollen. In diesem Artikel soll vornehmlich der video-Tag kurz vorgestellt und deren Anwendung erklärt werden. Ein Beitrag zum audio-Tag folgt.
Video
In Zeiten von Youtube, Vimeo & Co. ist die Einbindung von Videomaterial auf der eigenen Website kein Problem mehr. Video auf Youtube laden, Code kopieren und in die eigene Website integrieren – fertig. Die weite Verbreitung von Adobes Flash Player garantiert (laut Adobe) eine fast 98%ige Abspielbarkeit beim Endnutzer – überprüft kann diese Zahlen niemand. (Die Website WebHits zeigt in seinem Web-Barometer z.B. nur eine Verbreitung von 56,5%… ich denke irgendwo dazwischen könnte die Wahrheit liegen. ) Doch mit genanntem Verfahren kommen einige Unannehmlichkeiten daher. Wer sein Video bei Youtube oder Vimeo hochlädt, gibt seine Nutzungsrechte daran in den meisten Fällen an den Betreiber der Plattform ab. Oft wird Werbung eingeblendet, die sich der Kontrolle des Videokünstlers entzieht. Doch die Einbindung von Videos in die eigene Website ohne Hosting-Plattformen war bisher eher lästig, aufwändig oder kostspielig und wie erwähnt trotzdem Plug-In-behaftet.
Hier greift HTML5 mit seiner simplen Syntax zum Einbinden eines Videos:
<video src="video.mp4" poster="video-cover.jpg" controls="controls"> Hier steht Text oder HTML-Code, der angezeigt wird, wenn dein Browser noch keine Videounterstützung für HTML5 bietet. </video>
Wer schon früher Videos per HTML in eine Website eingebunden hat, der wird merken, dass die ein deutlich vereinfachtes Verfahren dafür ist. Die Attribute sind einfach und quasi selbsterklärend. Interessant ist z.B. die Möglichkeit, per cover-Attribut ein Titelbild für das Video anzugeben, falls das Video nicht automatisch gestartet werden soll. Das Video wird dann in einem Player angezeigt, der von der Umsetzung des Browserherstellers ein wenig unterschiedlich aussehen kann, jedoch bei Einhaltung der Spezifikation immer die selben Funktionen bietet. Es gibt zusätzlich zu den globalen HTML5-Attributen noch andere speziell für Videos. Diese findet ihr bei der w3schools.com beschrieben.
Doch auch hier gibt es noch eine Schattenseite: Da sich die Browserhersteller bisher nicht auf einen einheitlichen Videostandard geeinigt haben, gibt es verschiedene Videoformate und -container, die in verschiedenen Browsern abgespielt werden, in anderen wiederum nicht. So unterstützt Firefox z.B. ab Version 3.5 Theora Video und Vorbis Audio in einem OGG-Container, ab Version 4 kommt noch WebM dazu. Auch Chrome und Opera unterstützen genanntes in den neusten Versionen. Dafür versteht sich Safari besser auf Apples Quicktime-Formate im MP4-Container. Eine kleine Übersicht gibt’s bei diveintohtml5.org.
Einen guten Ansatz und vorläufigen Ausweg bietet das JS-Framwork MediaElement.js welches per Skript ein sogenanntes Fallback implementiert. Je nach Browser wird das Video dann in dem für ihn geeigneten Format und Player abgespielt, vorausgesetzt man hat es vorher in die verschiedenen Formate gebracht und auf den Server geladen. Nur bei älteren Browsern ohne JavaScript und Flash versagt selbst dieses Framework.
Fazit
HTML5 vereinfacht die Einbindung von Video-Elementen stark. Auch sind zusätzlich zum Browser keine weiteren Plug-Ins nötig, sollten die Hersteller den Standard spezifikationsgetreu umsetzen – was zu erwarten ist. Wichtig wäre aber eine Einigung auf ein einheitliches Videoformat, damit alle User in den Genuss von Videos in Webseiten kommen können. Ob dies jedoch geschieht, bleibt abzuwarten. Der Schritt geht in die richtige Richtung.