Der HTML5 Video Tag macht es deutlich einfacher, Videos ins Netz zu stellen. Er spielt eine ganze Menge verschiedener Formate ohne Plugins ab und ist sehr gut über JavaScript zu steuern.
Vor dem Einsatz des HTML5 Video Tags fragt sich jeder verantwortungsbewußte Entwickler aber, wie es mit der Browserkompatibilität aussieht und auch das Thema mobile will behandelt werden: welche Einschränkungen gibt es für das Video Tag auf iOS und Android?
Nachfolgend klären wir anhand Statistik und Auswertungen, dass die Zeit für HTML5 Video gekommen ist:
Browserkompatibilität des HTML5 Video Tag
Die älteren Versionen des Internet Explorers bis einschließlich Version 8 ignorieren das HTML5 Tag. Das war bisher ein ziemliches knockout Kriterium für den alleinigen Einsatz. Mittlerweile hat jedoch iOS und Andorid einen höheren Marktanteil als der veraltete IE und Flash als die bisher einfachste Möglichkeit, Videos Browserübergreifend einzubinden läuft dafür auf diesen Endgeräten nicht. Entscheidet man sich also für das HTML5 Tag hat man damit schon jetzt eine größere potentielle Nutzerschicht, als beim Einsatz von Flash.
Browser/Device | Marktanteil | HTML5 Video | Flash Video |
---|---|---|---|
Chrome | 32% | + | + |
Firefox | 18% | + | + |
Internet Explorer 9/10 | 16% | + | + |
Internet Explorer 6/7/8 | 10% | – | + |
Safari | 4% | + | + |
Opera | 1% | + | + |
iOS | 7% | + | – |
Android | 5% | + | – |
Welche HTML5 Video-Attribute funktionieren wo?
Mit den Attributen Preload, Autoplay und Controls lässt sich das HTML5 Video Tag ausstatten und damit schon direkt im Tag an den Einsatzzweck weitgehend anpassen. Alle Browser unterstützen diese Attribute; iOS und Android ignorieren hingegen Preload und Autoplay:
Browser/Device | Poster | Preload | Autoplay | Controls |
---|---|---|---|---|
Chrome | + | + | + | + |
Firefox | + | + | + | + |
Internet Explorer | + | – | + | + |
Safari | + | + | + | + |
iOS | + | N/A | N/A | + |
Android | + | N/A | N/A | – |
Opera | + | + | + | + |
JavaScript API des Video Tags
Neben den Attributen lässt sich die Steuerung von Videos in HTML5 auch über JavaScript ermöglichen. Das funtioniert browserübergreifend reibungslos – etwas komplizierter ist es auch hier in den Browsern der mobilen Betriebssysteme iOS und Android:
Browser/Device | Loading | Buffering | Playback | Seeking | Volume |
---|---|---|---|---|---|
Chrome | + | + | + | + | + |
Firefox | + | + | + | + | + |
Internet Explorer | + | + | + | + | + |
Safari | + | + | + | + | + |
iOS | + | + | – | + | N/A |
Android | – | – | – | – | N/A |
Opera | + | + | + | + | + |
Quelle: longtailvideo/html5
Eine Antwort auf HTML5 Video und die Browserkompatibilität inkl. iOS und Android