Online Album Videos auf der Webseite streamen lassen.

vlerfurt schrieb am 02.07.2013 um 11:37 Uhr

Hey, ich würde gerne meine Album Videos auf meiner Webseite mit diesem html5 Player laufen lassen 

 

<script type="text/javascript">
    document.write("\x3cvideo src=\"index_htm_files/Shingeki no Kyojin 01.mp4\" controls width=\"100%\" height=\"100%\"/>"
    );
    </script>

 

Muss ich dazu nur ein paar Zeilen Code einfügen?  Kann das einer schnell machen wenn das nicht zuviel Arbeit ist? 

 

Die Videos müssen aber umbedingt in HTML5 gestreamt werden, ein flas player kommt für mich nict in frage :(

 

Ich bedanke mich jetzt schonmal :D

Kommentare

BeRo schrieb am 03.07.2013 um 11:43 Uhr

[...] Muss ich dazu nur ein paar Zeilen Code einfügen? [...]

Ja, das auch...

[...] Kann das einer schnell machen [...]

Ganz so schnell wird dass nicht gehen, weil doch einige Vorbereitungen nötig sind.
Eventuell musst Du auf dem Webspace noch eine .htaccess Datei ablegen, damit die Videotypen richtig erkannt und ausgeliefert werden.
Es kann auch nötig sein im Header Deiner Sites den Doctype anzupassen...

[...] Die Videos müssen aber umbedingt in HTML5 gestreamt werden [...]

Diese Definition der Anforderung ist nicht ganz klar. Genauer müsste das IMHO heißen: "Die Videos müssen von HTML5 fähigen Browsern wiedergegeben werden können."

HTML5 ist zwar deutlich auf dem Vormarsch, derzeit kommen aber längst nicht alle Browser damit klar. Ältere Browser sind per se schon mal von den Segnungen ausgeschlossen. Das heißt, dass Du Dein Video ganz gezielt allen Benutzern älterer Browser vorenthalten willst?!

Wie weiter oben schon angedeutet: Das Problem ist vielschichtig und nicht mit ein paar Codezeilen erledigt.

Stand heute sind folgende Browser in der Lage, Videos via HTML5 darzustellen:

Wie in dem o. a. Screenshot zu sehen (Quelle), werden unterschiedliche Dateiformate benötigt. Um also möglichst vielen Besuchern Deiner Website die Chance zu geben, das präsentierte Video zu sehen, musst Du:

  1. Das Video in mindestens drei verschiedenen Dateiformaten verfügbar machen. Wenn Flash Fallback dazukommt, brauchst Du noch ein 4. Format, z. B. "M4V"
    Das berücksichtigt auch die weitere Entwicklung einzelner Browser.



     
  2. einen "intelligenten" Player benutzen, der die Plattform erkennen kann, die der aktuelle Besucher Deiner Site benutzt. Abhänig davon muss das passende Video angeboten werden und ggf. ein Flash Fallback eingeleitet werden, wenn der benutzte Browser kein HTML5 beherrscht.
    Der FlowPlayer ist z. B. ein Exemplar dieser Gattung.
  3. die Anleitung des Players genau studieren, den Du Dir aussuchst, damit Du die Voraussetzungen für den fehlerfreien Betrieb schaffen kannst (.htacces Datei? und/oder Doctype Anpassung, usw.)

Wenn Du die in Punkt 1 erwähnten Dateiformate selbst erzeugen willst, kannst Du z. B. das kostenfreie Tool "Super" benutzen, das Du hier herunterladen kannst. Oder Du benutzt das ebenfalls kostenfreie "Freemake", das die drei benötigten Formate automatisch aus einer Quelldatei erstellt. Nach der Konvertierung wird der Scriptcode angezeigt, der direkt für die Einbindung verwendet werden kiann.

Alternativ kannst Du auch einen HTML5 Player/Konverter benutzen, der Dir diese Arbeit abnimmt. Hier kannst Du z. B. den kostenfreien "Easy HTML5 Player Konverter" herunterladen, der in der free Version allerdings den Anbieter Namen als Wasserzeichen einblendet. Die Sprache des Players kann auf "deutsch" umgestellt werden.
Wie Du damit Deine eigene Video Datei einbinden kannst, das wird hier gezeigt.

Noch mehr Infos findest Du auf dieser Site. Da haben sich Philip Bräunlich und Gerrit van Aaken eine Menge Arbeit gemacht und alle Infos zu 25 verschiedenen HTML5 Playern zusammengestellt, die Dir helfen können, den "richtigen" Player zu finden.

Jetzt musst Du "nur ein paar Zeilen Code einfügen" und schon geht's los...

Viel Erfolg

 

Zuletzt geändert von BeRo am 03.07.2013, 15:07, insgesamt 4-mal geändert.

Auf den Tag genau gehen heute, am 14.08.2021, 10 Jahre online Support für die Community zu Ende.
Ich freue mich auf eine neue, berufliche Herausforderung, die sich gerade ergeben hat. Leider bleibt dann keine Zeit mehr für die Community übrig, aber Ihr seid bei den aktiven Mitgliedern in besten Händen.
Sicher schaue ich auch ab und zu nochmal rein... 🤓

zeon schrieb am 05.07.2013 um 10:05 Uhr

Hallo vlerfurt,

erstmal muss ich im groben BeRo zustimmen. Wenn man die Seite professionell betreiben will und wirklich alle Fälle abdecken möchte, dann kommt man an seiner vorgehensweise nicht vorbei.

Reicht es einem jedoch, dass alle aktuellen Browser (IE9+, FF und Chrome) sowie auf Mobil-Geräten abgespielt werden kann, dann reicht es wenn du deine "paar Zeilen Code einfügst". Inzwischen können alle diese Browser H.264/MPEG-4 abspielen. Für alle anderen Browser benötigt man also entweder eine Flash-Alternative oder man zeigt Ihnen einfach an, dass dieses Video mit dem aktuellen Browser nicht abgespielt werden kann.
 

Und jetzt noch ein kleiner Insider-Tipp:

In deinem Code-Schnipsel wirst du ja irgendwo die Adresse/URL zu deinem Video angeben müssen. Dieses Video müsste für HTML5 mindestens im MPEG4-Format sein (wie ja BeRo bereits geschrieben hat). Das Online-Album speichert diese Videos auch in dem Format. Und mit dem Update anfang nächster Woche kann man diese URL, die du brauchst, dann auch ganz einfach exportieren. Du klickst dann - sofern im Online Medien Manager aktiviert - auf der Seite des Videos oben auf Aktionen - Video auf Website einbetten - unter Format wählst du dann Direkt Link. Dieser Link führt direkt zu dem Video und muss nur noch in deinem Code eingefügt werden.

Achtung: Es ist möglich, dass es nicht überall läuft. Die aktuellen großen Browser und die gängisten Geräte sollten aber damit klarkommen. Wenn dir das reicht ist ok, sonst müsstest du den Weg von BeRo gehen.

Viele Grüße,
zeon