Vorheriger Artikel Nächster Artikel

Webentwicklung: HTML5-Videoplayer mit Flash-Fallback

HTML5-Videoplayer sind gerade nicht nur groß in Mode, sondern auch eine sehr sinnvolle Sache, da sie mittels ohne weitere funktionieren. Leider hat jeder Browser seine eigene Vorstellung bzgl. einer geeigneten Kodierung der Videos und der Art und Weise wie ein Player zu funktionieren hat.

Webentwicklung: HTML5-Videoplayer mit Flash-Fallback

Für alle diese Player gilt übrigens, dass nicht der Fallback für ein Flash-Movie ist, sondern dass der Fallback für HTML5 ist! Welche der Libraries die beste, performanteste oder einfachste ist, ist derzeit nur schlecht zu durchschauen. Alle bieten auf unterschiedliche Weise eine ähnliche Leistung, lediglich ein Unterschied im User Interface ist auszumachen.

Insofern bleibt derzeit nur die Möglichkeit sich für einen Player zu entscheiden, der die gerade favorisierte Javascript-Library unterstützt (jQuery, Mootools, usw.). Bei allen Libraries gilt aber, dass man diese mit allen verfügbaren Browsern einem strikten Test unterziehen sollte!

Moovie

Der Programmierer von Moovie ist kein stolzer Besitzer einer Rechtschreibschwäche, sondern der Name ist eine Anlehnung an die Mootools, auf denen das Paket basiert. Nach Bekunden des Moovie-Entwicklers hat die Library derzeit noch Probleme in Google Chrome, erscheint aber ansonsten durchaus ausgereift.

SublimeVideo

SublimeVideo ist einer der bekannteren Player seiner Gattung und funktioniert in Chrome, dafür hakt es an manchen Stellen noch im Firefox. Nach eigenem Bekunden sind die Programmierer zur Zeit dabei dieses Problem zu lösen. Im Gegensatz zu anderen Playern basiert SublimeVideo nicht auf einer Javascript Library und kommt mit nativen Javascript aus.

FlareVideo

FlareVideo kommt mit eigenen Themes daher und basiert auf jQuery. Nicht so schön ist allerdings die Verwendung des Sliders aus der jQuery UI, was zu einer zusätzlichen Download-Last auf Seiten des Benutzers führt. Alles in allem allerdings ein guter Player der sicher alle Browser unterstützt.

Open Standard Media

Der Open Standard Media (OSM) Player ist ebenfalls in jQuery geschrieben und bietet neben einer Integration von YouTube und Vimeo auch einige Social Features wie zum Beispiel das direkte Bewerten von Videos, Playlists und Bookmarks. Interessant ist auch die Möglichkeit, dass sich mehrere Player auf der gleichen Seite untereinander verständigen können. Es wäre so zum Beispiel möglich, dass nach dem Anhören eines Podcasts der Player automatisch die nächste Folge startet.

YUI HTML5 Player

Natürlich gibt es auch einen Player für das YUI - den YUI HTML5 Player, der im März 2010 aus dem Entwicklungs-Wettbewerb zur YUI 3 hervorgegangen ist. Neben einer vollen Integration in das YUI bietet der Player zum Beispiel auch die Möglichkeit, den Fullscreen-Modus von Webkit zu unterstützen.

html5media

Der html5media Player hat sich ebenfalls einen Platz in dieser Liste verdient, da er mit nur einer einzigen Javascript-Datei auskommt, die nur 13kb groß ist - weitere Javascript Libraries finden keine Verwendung. Was den Player ebenfalls sympathisch macht ist die Tatsache, das kein eigener Flash-Fallback verwendet wird, sondern der Flowplayer.

Die Liste ließe sich wahrscheinlich beliebig fortsetzen und man darf gespannt sein, welcher der unzähligen Player sich letztendlich durchsetzen wird. Zur Not kann man sich der Einfachheit halber auch direkt einen eigenen programmieren. Zumindest um die Hintergründe das HTML5-Tags <video> zu verstehen, sollte man dies zumindest einmal gemacht haben - spätestens dann weiß man auch, wieso man mit nur einem Video-Format bzw. Audio-Format nicht auskommt.

Weiterführende Links zu aktuellen HTML5- und Flash-News:

Hänge dich jetzt an unsere Facebook-Seite und sichere dir deinen #Wissensvorsprung!

t3n gefällt mir!
Vorheriger Artikel Zurück zur Startseite Nächster Artikel
2 Antworten
  1. von R2M am 10.08.2010 (12:04 Uhr)

    Coole Sammlung von Videoplayern! Ein weiterer interessanter, Javascript-Bibliothek unabhängiger, 100% CSS-basierter HTML5 Video Player mit Unterstützung für Tastatur-Interaktion und Untertitel-Support findet sich unter http://dev.mennerich.name/showroom/html5_video/

    Antworten Teilen
  2. von Hobomat am 20.04.2011 (15:19 Uhr)

    Eigentlich super und die richtige Richtung, aber schon beim (echten) Streaming mit HTML5 wirds extrem schwierig.

    Antworten Teilen
Deine Meinung

Bitte melde dich an!

Du musst angemeldet sein, um einen Kommentar schreiben zu können.

Jetzt anmelden

Mehr zum Thema Browser
Flash-Player-Alternative: Project Shumway von Mozilla macht verhasstes Adobe-Plugin überflüssig
Flash-Player-Alternative: Project Shumway von Mozilla macht verhasstes Adobe-Plugin überflüssig

Mozilla entwickelt mit dem „Project Shumway“ seit 2012 eine Flash-Player-Alternative, die Web-Inhalte auch ohne Flash-Plug-in korrekt darstellt. » weiterlesen

Mobile SEO: Die 5 häufigsten Fehlerquellen
Mobile SEO: Die 5 häufigsten Fehlerquellen

Der Suchanteil über Mobilgeräte steigt. Neue Herausforderungen warten auf Marketer, erst recht nach dem jüngsten Google-Update. Worauf sie jetzt achten müssen, klärt dieser Artikel von Eva Wagner. » weiterlesen

Design2Code: 16 Tools und Services für Designer ohne Code-Kenntnisse
Design2Code: 16 Tools und Services für Designer ohne Code-Kenntnisse

Das Design ist fertig, jetzt fehlt nur noch der Code? Kein Problem. Design2Code heißt das Zauberwort für Tools, Services und Plugins, die aus Layouts fertige Projekte machen. » weiterlesen

Alle Hefte Jetzt abonnieren – für nur 35 €

Kennst Du schon unser t3n Magazin?

t3n-Newsletter t3n-Newsletter
Top-Themen der Woche für Web-Pioniere
Jetzt kostenlos
anmelden
Diesen Hinweis verbergen