Video einbinden, aber wie? (update)

Kaum je war die Verwirrung größer, wenn es um die Frage geht, wie man denn nun im Jahre des Herrn 2009 ein Video auf einer Website einbindet!

Vor fast genau einem Jahr habe ich die Heilige-Gral-Lösung besprochen, die folgende Vor- und Nachteile besitzt:

+ Nur ein Dateiformat (H.264)
+ Schlanker Embed-Code dank JavaScript
+ Hoher Kompatibilitätsgrad durch Flash-Player
– Flash-Plugin notwendig, das nicht auf allen Geräten verfügbar ist
– JavaScipt vermeintlich nötig, um Flash korrekt einzubinden
– H.264-Codec führt ab 2011 zu Lizenzproblemen auf kommerziellen Websites

Die Praxis zeigt, dass man im Grunde JavaScript doch nicht benötigt, um Flash einzubinden. SWFObject ist zwar ein feiner Ansatz, aber bietet eigentlich nur zwei Vorteile:

  • Der Code wird übersichtlicher
  • Man kann auf das hässliche Embed-Element für IE verzichten, was den Code valide und trotzdem kompatibel macht.

Soweit, so gut. Nun gibt es einen neuen Workaround, der ebenfalls hochkompatibel sein soll und dabei stark auf die eingebauten Fallback-Möglichkeiten der jeweiligen HTML-Elemente setzt: Video for everybody. (Bitte jetzt kurz angucken, falls noch nicht bekannt.) Die Vor- und Nachteile:

+ Aktuelle HTML5-Technologie
+ Kein JavaScript und kein Flash nötig
+ Hochkompatibel, auch mit iPhone (obwohl leider buggy derzeit)
+ Potenziell hohe Performance
– Sehr unübersichtlicher Embed-Code
– Flash weiterhin notwendig für volle Kompatibilität
Zwei Dateiformate nötig, um die HTML5-Vorteile zu nutzen (OGG Theora für Firefox, H.264 für Safari)

Gerade eben habe ich eine dritte, recht charmante Möglichkeit gefunden, die ich in leicht abgewandelter Form gerne ebenfalls besprechen möchte:

<video width="480" height="320" controls="controls">
<source src="path/videofile.mp4" type="video/mp4" />
<source src="path/videofile.ogg" type="video/ogg" />
</video>
<!--[if IE]>
<p><a href="path/videofile.mp4">Video ansehen</a><br />
Für direktes Abspielen des Videos benötigen Sie Safari 4 oder Firefox 3.5.</p>
<![endif]-->

Nichts ist perfekt, aber das hier gefällt mir irgendwie:

+ Kurzer Embed-Code
+ Kompatibel mit modernen und coolen Browsern
+ kein JavaScript und kein Flash notwendig
+ (Abhängig von der Browser-Implementation, aber:) Performance
– IE-Nutzer sehen nur den Link, obwohl der IE via Flash das MP4 auch abspielen könnte
– Immer noch zwei Dateiformate nötig

Bleibt die Frage, ob wir die nächsten Monate oder Jahre wirklich alle Videos wieder in zwei Formaten ausspielen wollen, wo wir doch gerade gedacht haben, dass sich H.264 gegen das leidige FLV durchgesetzt hat. Kaum hat man dank Flash den heiligen Gral in der Hand, schon will man wieder auf Flash verzichten und voll auf das <video>-Element setzen. Uns geht der Diskussionsstoff nicht aus, denke ich :-)

Letztlich bleibt zu hoffen, dass sich ein Videoformat durchsetzt, welches dann von jedermann auch benutzt werden kann. Ian Hickson von der HTML5-Arbeitsgruppe beschreibt das schon ganz richtig; Es gibt zwei vorstellbare Szenarien:

  1. OGG Theora wird qualitativ noch besser, es wird sichergestellt, dass keine versteckten Patente im Code stecken (da ist noch ein gewisses Risiko), und es wird Hardware-Beschleuniger-Chips geben.
  2. H.264 klärt die Situation mit den Lizenzkosten, so dass es sich für Firefox und Opera lohnt, den Codec zu unterstützen. Auch kleinere Firmen, die ein paar Videos ins Netz stellen, sollten nicht zu Lizenzzahlungen gezwungen sein. Dies müsste klar kommuniziert werden.

Mein persönlicher Wunsch wäre ja, dass H.264 technisch so bleibt wie bisher, aber komplett frei nutzbar gemacht wird. Kann sich da nicht Bill Gates mal engagieren? Im Zuge von Kultur-Mäzentum könnte er doch mit ein paar Milliarden den Codec komplett freikaufen und für alle verfügbar machen. Nur so’n Vorschlag!

update 4.2.2010: H.264 bleibt bis Ende 2016 lizenzkostenfrei für Gratis-Videos im Internet