Das Einbinden von FLV-Videos

 
  FLV – Videos benötigen das Flash-BrowserPlugin, das auf fast allen Systemen (auch Mac und Linux) zur Verfügung steht. Die Verbreitung liegt also bei nahezu 100%.
Noch besser ist: FLV-Videos haben die beste Videoqualität im Verhältnis zur Dateigröße.

Die Einbindung in eine Webseite läuft etwas anders als bei Windows Media.
Benötigt wird ein eigener FLV-Player, der zusammen mit einer *.swf-Datei (das ShockwaveFlash-Element, welches Flash aufrufen kann und den FLV-Player startet) und einer Skriptdatei und einem Vorschaubild auf den Webserver geladen wird – am besten wieder auf dieselbe Verzeichnisebene wie die Videodatei und die HTML-Seite.
Die Dateien: ._flvplayer.swf, flvplayer.swf, swfobject.js

Der Code schaut erstmal kompliziert aus:

<html>
<head>


<script type="text/javascript" src="swfobject.js"></script>


</head>
<body>


<h3 align="center"><font face="Times New Roman, Times, serif">Titel der Seite</font></h3>
<h3 align="center"><font face="Times New Roman, Times, serif">Titel des Videos</font></h3>
<p align="center"><font face="Times New Roman, Times, serif">blabla</font></p>
<p align="center" id="player1"><a href="http://www.macromedia.com/go/getflashplayer"><font face="Times New Roman, Times, serif">Get
the Flash Player</font></a><font face="Times New Roman, Times, serif"> to see
this player.</font></p>
<div align="center">
<p>
<script type="text/javascript">
var s1 = new SWFObject("flvplayer.swf","single","480","380","7");
s1.addParam("allowfullscreen","true");
s1.addVariable("file","chicagoweb.flv");
s1.addVariable("image","rmk.jpg");
s1.addVariable("width","480");
s1.addVariable("height","380");
s1.write("player1");
</script>
</p>
<p align="center"><font face="Times New Roman, Times, serif">
<map name="Map">
<area shape="rect" coords="4,5,29,26" href="objekte9mieslinger.html">
</map>
</font></p>

Statt chicagoweb.flv der Name der entsprechenden eigenen Videodatei.
Achtung: Die Zeile im Head mit dem Script nicht vergessen!

Vorschaubild ist hier rmk.jpeg und natürlich zu ändern.
Dieses Video wurde mit 480 x 360 Pixeln encodiert, die Größenangaben stimmen hier also immerhin für die Breite.....

 
 

So schaut das also aus, und funktioniert wirklich sehr gut (die Videodatei hat über 30 MB!) - Video anschaun

Anmerkung: Es gibt verschiedene Player zum Einbinden. Dies hier ist der jw_flv_player (mit Vollbildmodus!).
Die 3 Dateien haben zusammen ca. 50 KB und werden mit dem Video vom Webserver heruntergeladen – der Surfer braucht keinen Player (aber Flash). Es gibt natürlich verschiedene Player, die auch teilweise verschiedene Aussehen haben, d. h. Es müssen zusätzlich Skindateien heruntergeladen werden. Irgendwie unterscheidet sich auch der Code für die Einbindung und trägt nicht grade zur Klarheit bei. Hier gilt: funktioniert die Sache mal, kann man ruhig dabeibleiben.....
Wer eine aktuelle Dreamweaverversion hat, lächelt milde, denn da geht das Ganze richtig schön einfach ...
Dann sind auch Playlisten einfach zu erstellen.

Wie erstelle ich ein FLV-Video?
Immer mehr Videoschnittprogramme stellen eine Entsprechende Exportfunktion zur Verfügung :
Premiere Pro natürlich – dort können sehr schön die Qualitätsstufen eingestellt werden und v. a. enthält Premiere den aktuellen und exzellenten ON2VP6-Codec. Kostenlose Encoder wie z. B. der Riva Encoder enthalten nur den veralteten Sorenson Codec. Optimal und teuer ist dafür Flash Pro.

Screenshot vom Riva Encoder:

 
 


Für Youtube-Nutzer wird zukünftig alles online ablaufen. Ein Online-Videoschnitttool von Adobe auf Flashbasis ist in der Betapase und steht angemeldeten Usern zur Verfügung:


Schwerer wird es allerdings dem Downloader gemacht. Das funktioniert über das Kopieren der URL der Videodatei (oder so ähnlich). Diese Zeile hat Youtube nun entfernt.
Es war schon vorher ein „HaseundIgel“-Rennen: neue Downloader haben die Beschränkungen der Programmierer umgangen – ein nerviges Spiel. Im folgenden Browser-Screenshot sind z. B. 3 Videodownloader zu erkennen:

Momentan favorisiere ich den Orbit Downloader. Aber auch der nervt (versagt). Neue Downloader ausprobieren? - ja, immer wieder neue & das nervt.
Nicht unbedingt besser ist das Web 2.0:

www.videohamster.com holte mal ohne Herumzicken online die Videodatei und wandelte diese in das gewünschte Format um. Diese Datei kann dann heruntergeladen werden und z. B. auch auf dem iPod oder Handy gespeichert werden (ganz toll ist dann die Ton- & Bildqualität.....). Mittlerweile: Schrott.

Tip: Hat jemand keine Lust auf diesen ganzen Scheiss? - einen Screenrecorder benutzen, welcher alle möglichen & unmöglchen Browserprobleme vermeidet. Wie leicht zu erahnen, gilt das nicht für jeden Screenrecorder.
Ich nutze FRAPS; das optimale Tool für Speeddemos und Machinima bietet exzellente Bildqualität und ist natürlich nicht ganz umsonst (die alte Version 1.8 ist noch Freeware, völlig ausreichnd & über Google leicht zu finden).

Das wars fürs erste zu FLV-Video. Es ist klar, dass mich primär die Gestaltung/ grafische Einbindung von FLV interessiert - wobei FLV nicht das Gleiche wie Flash ist! Wie heisst es so schön: Interaktives Video mit Flash.
Fortsetzung folgt.......


 
 

<< Multimonitor <<              << Tutorialstart <<