Eigentlich bin ich ja begeistert von den neuen HTML5 Tags, die es erlauben Video und Audio Dateien ohne Flash oder ähnliches Plugins in der Webseite einzubinden. Diese konnte ich letzten schon einmal auf der Seite der Piratenpartei Sachsen-Anhalt ausprobieren.

So sieht zum Beispiel der Audio-Code aus:

  
  
  

<iframe title="YouTube video player" class="youtube-player" type="text/html" width="500" height="405" src="http://www.youtube.com/embed/YdRUHJfBiz0" frameborder="0" allowfullscreen></iframe>

Der Parameter “controls” gibt an, dass der Player Bedienschalter haben soll. Weitere mögliche Optionen sind “autoplay”, “loop” und “preload”. Die “source” Tags zeigen auf die Audio Files. Mehrere von diesen sind auch notwendig, da jeder Browser seine eigenen Vorstellungen von den zu unterstützenden Codecs hat. Wenn man die Codecs OGG Vorbis und MP3 benutzt, sollte das normalerweise reichen. Wie man bei diesem Beispiel hier sieht, habe ich noch ein Youtube Video eingebettet - falls ein Browser keiner dieser Codecs mag bzw. noch nicht den HTML5 Audio Tag versteht, wird auf den Flash Player zurückgegriffen. Man kann natürlich auch einfach einen Text oder Download Link anzeigen lassen.

Bei dem Video-Tag sieht es ähnlich aus:

 <iframe title="YouTube video player" class="youtube-player" type="text/html" width="500" height="311" src="http://www.youtube.com/embed/SeVhqNEPt1U" frameborder="0" allowfullscreen></iframe> 

Hier habe ich dem Video eine Anzeigegröße (“width” und “height”), ein Vorschaubild (“poster”) und wieder die Bedienelemente (“controls”) vorgeschrieben. Noch weitere Optionen sind möglich. Dann werden wieder per “source” die Dateien angegeben. Hier ist es fast noch schlimmer als beim Audio Tag. Ich würde hier empfehlen die Codes WebM, OGG Theora und H264 zu nutzen. Wahrscheinlich wird sich WebM durchsetzen - bisher kann dies aber erst Chrome und die Firefox 4 Beta. Ebenfalls habe ich hier wieder ein Youtube Video als Fallback drin.

Das ganze sieht schon ganz nett aus. Wie ich gesehen hatte, kann man mit CSS und Java Script die Player anpassen. Probiert habe ich es aber noch nicht. Als Beispiel kann man hier Youtube nennen. Deren HTML5 Player wurden angepasst (sofern man die HTML5 Beta aktiviert hat).

Nun möchte ich aber auch mal zu den Problemen kommen.

Ein Problem hatte ich ja schon angesprochen: Man muss derzeit mehrere Dateien in verschiedenen Codecs anbieten, wenn man alle möglichen Browser bedienen möchte. Das nächste große Problem sehe ich derzeit bei Chrome. Dieser lädt die Dateien immer vor, auch wenn man dies nicht in den Optionen aktiviert hatte. Dies kann man auch nicht ausstellen. Wenn man nur ein Video bzw. nur eine Audio Datei auf einer Seite hat, stört das ja nicht so. Aber wenn man wie bei dem Beispiel auf der Seite der Piratenpartei Sachsen-Anhalt gleich mehrere solche Dateien einbinden, stört das schon. Zum einen hat der Webseiten Betreiber mehr Traffic (nicht jeder guckt/hört sich alles an) - zum anderen wird die Leitung des Besuchers unnötig belastet.

Und wenn man schon dabei ist, mehrere Dateien einzubinden, ist das ein lästiges rumgehüpfe im Firefox (weiß nicht wie es bei den anderen ist) - zumindest, wenn man Audio Tags benutzt. Erst lädt der Browser anscheinend Informationen zu den Dateien und dann lässt er den Player wieder verkleinern. Das ist schon bisschen nervig.

Dann kommt noch hinzu, dass diese Tags keine Playlists unterstützen. Dies lässt sich nur per Java Script machen, was ich aber nicht so schön finde. Mehrere Leute (vor allem Piraten) benutzen die Firefox Erweiterung “NoScript” oder manche haben erst gar kein Java Script an.

Aus diesen Gründen habe ich bei dem Wahlportal der Piratenpartei Sachsen-Anhalt (noch nicht offiziell gestartet) nun doch wieder auf einen Flash Player zurückgegriffen. Hoffe mal, dass sich das bald bessert.