Seit der Version 9.3 unterstützt der Adobe Flash Player das Abspielen von H.264 Videos. H.264 ist ideal, um Videos in höchster Qualität bei geringer Bitrate ins Netz zu stellen. Wir wollen mit diesem kleinen Workshop zeigen, wie man mit kostenloser Open Source Software Videos nach H.264 umwandelt und zum Progressive Download
vom eigenen Webserver vorbereitet. Progressive Download hat den Vorteil mit jedem Webserver zu funktionieren (im Gegensatz zu Streaming Videos, die einen eigenen Server voraussetzen) und bedeutet, das das Video schon abspielt, nachdem ein erster Teil der Daten übertragen ist und nicht wartet bis das ganze Video runtergeladen ist - das mach besonders Sinn bei grossen Videos.
Die Programme die wir dazu einsetzen werden sind der Open Source Videoeditor/Umwandler 
Avidemux und ein kleines Tool namens QTIndexSwapper - und als in die Webseite eingebetteten Flash-Videoplayer den (für nicht-kommerzielle Zwecke) kostenlosen JW FLV Media Payer.
Adobe Flash bietet sich als Abspielformat/player an, weil es von allen Playern (wie Microsoft Windows Media, QuickTime, RealVideo) die größte Verbreitung hat - beinahe jeder Computer der sich im Netz bewegt, hat Flash installiert und kann (wenn er auf die neueste Version upgedatet ist) somit H.264 Videos abspielen. H.264 komprimiert sogar so effektiv dass auch Videos in HD-Qualität netztauglich gemacht werden können - das Abspielen setzt jedoch eine gewisse Prozessorleistung voraus. Ein schönes Beispiel dafür liefert Adobes Flash HD Gallery.
Um sein video im Netz zu präsentieren, kann man sein Video natürlich auch bei einem Online-Videodienst wie YouTube oder Vimeo einstellen - doch auf der eigenen Seite/auf dem eigenen server hat man die beste Kontrolle über das Video: kann es zum Beispiel nur einem ausgewählten Kreis von Besuchern zugänglich machen, kann die Videoqualität optimieren oder kann es Besuchern auch zum Download in höchster Qualität anbieten. Das Video ist allerdings mit der hier verwendeten Methode in keiner Weise gegen den Download geschützt.
Umwandeln mit Avidemux
Avidemux verarbeitet eine Vielzahl von Inputformaten und wandelt diese nach H.264 um. Die Encodingeinstellungen lautet wie folgt:
Video: MPEG-4 (x264)
Audio: AAC
Format: MP4
Bitrate
Per "Configure" kommt man in das Menü wo die Audio bzw Videobitrate festgelegt wird. Allgemin gilt: Je höher die Bitrate, desto größer das resultierende Video (und es benötigt mehr mehr Speicherplatz und Bandbreite), desto besser aber auch die Bildqualität. Je größer das Ursprungsvideo ist und je mehr Bewegungen, Schnitte und Details im Video zu sehen sind, desto größer sollte die Bitrate für das komprimierte Video sein. Sie sollte also abhängig vom Quellmaterial ausgewählt werden, will man ganz optimal arbeiten und die Bitrate möglichst niedrig halten, kann man in mehreren Encoding-Läufen einfach austesten, wo der ideale Kompromiss liegt, damit die Bitrate minimal ist, die Bildqualität aber noch möglichst nahe am Original.
Unter "Configure/Bitrate" lässt sich die Bitrate und der Encoding-Modus einstellen:
Bitrate / Encoding Mode: Two-Pass
Average Bitrate:
Richtwerte der Average Bitrate für sehr gute Bildqualität bei (aber immer stark vom Material abhängig) - ohne Audio:
Auflösung: 480x360 Pixels: 400kbps - entspricht 3MB/Minute
Auflösung: 720x576 Pixels: 700kbps - entspricht 5,2MB/Minute
Hier ein tolles Beispiel für ein sehr gut aussehendes 720p (1280x720x25fps) Video bei nur 500 Kbit/s: 720p Demo.
Das ist möglich, weil das Video wenige Bewegungen besitzt (die vorkommenden Schwenks komprimieren sich gut) und der Autor die einzelnen Einstellungsmöglichkeiten der H.264 Kompression sehr auf das Material optimiert hat.
Video/Filter
Per "Filter" können noch Filter zugeschaltet werden, die wichtige Operationen vor dem Komprimieren erledigen.
Deinterlace
Ist das Ausgangsvideomaterial interlaced, also mit Halbbildern aufgenommen, empfiehlt es sich per Deinterlace-Filter (z.B. den yadif-Deinterlace Filter, zu finden unterdem Reiter "Interlacing" ) in Vollbilder umzuwandeln - sonst kommt es zu hässlichen Kamm-Effekten bei Bewegungen im resultierenden Clip, der ja immer im Vollbildmodus auf einem PC Monitor abgespielt wird. Der Interlace Filter sollte der erste Filter sein, der angewendet wird, falls mehrere aktiviert werden.
Die Videogröße – Resize
Als nächstes wird eventuell, je nach Größe des Ausgangsmaterials und der gewünschten Größe des Webvideos, ein Resize-Filter benötigt, der das Video auf die gewünschte Größe skaliert. Soll das Video fürs Netz kleiner kleiner skaliert werden, sind ganzzahlige Brüche/Verhältnisse, wie 1/2x die Größe des Orginalvideos oder zB 2/3x meist besser zu skalieren als schiefe. So kann ein HDV Video mit 1440x1080 gut halbiert werden auf 720x520 Pixel.
Als Seitenverhältnis sollte das des Orginalvideos eingetragen werden, bei neueren HD-Videos meist 16:9 - das dann ebenso für Source (Quelle) wie Destination (Ziel) gilt. Die beste Methode ist "Bikubic".
Der Flashplayer unterstützt allerdings auch HD in den Formaten 480p, 720p und 1080p - damit das Abspielen verzögerungsfreie und gutaussehend erfolgt, setzt es allerdings eine hohe Bitrate und damit schnelle Internetverbindung des User voraus - und man sollte vorher checken, welche Transferlimits der eigene Webserver besitzt - wenn das Video ein großer Erfolg (und wenn das Video lang bzw HD ist) wird, kann die Transferleistung leicht sehr groß werden - dann muss man evtl für den entstehenden Datenverkehr ab einem bestimmten Limit zahlen, je nach Vertrag mit dem Anbieter des Servers/Webspaces.
Zu beachten für die Wahl der Größe des Zielvideos sind auch folgende System-Voraussetzungen die Adobe für das Abspielen von HD Flash Videos unter Windows nennt: Bei 480p wird mindestens ein Pentium 4 (2,33GHz) benötigt, für 720p ein Pentium 4 (3Ghz) und für 1080p mindestens ein Core Duo (1,8 GHz).
Allerdings: ein gut kodiertes Video in SD Normalauflösung (720x576) schaut auch im Vollbildmodus noch ganz gut aus.
Farbkorrektur und weitere Filter
Hat man noch keine Farbkorrektur im Schnittporgramm gemacht, kann man das hier mit dem entsprechenden Filter unter "Colors" nachholen: Hier gibt es verschiedene Tools zur Farbkorrektur, die meist auch einen Vorschaumodus besitzen, anhand dessen das Endergebnis geprüft werden kann.
Bei Bedarf können auch noch weitere praktische Filter wie zB ein De-Noiser zur Verminderung von Bildrauschen eingesetzt werden oder Audio-Gain Filter - das Video kann auch per "Crop" beschnitten werden.
Und fertig
Mit Save File wird das Video umgewandelt. Wichtig - der neue Name muss mit der passenden Endung eingegeben werden - sie wird nicht automatisch von Avidemux angefügt - in unserem Fall also "Video.mp4"
Der Flashplayer spielt erkennt H.264-Videos am Dateiinhalt und spielt sie dann ab - die Dateiendung ist hierfür unwichtig - die Datei kann also genauso gut mit FLV oder einer der korrekten offiziellen Codes wie F4V, MP4, M4A, MOV, MP4V, 3GP oder 3G2 enden.
Schnitt
Avidemux untrstützt auch den einfachen Schnitt des Videos: hierfür wird per A/B ein Anfangs und Endpunkt gesetzt und der gewünschte Inhalt so markiert und kodiert.
Das Video für den Progressive Download vorbereiten
Jetzt benötigen wird das Tool QTIndexSwapper - das wiederum setzt als Laufzeitumgebung Adobes AIR voraus : Download. QTIndexSwapper führt eine kleine, aber fürs Progressive Download entscheidende Operation aus: es setzt den normalerweise am Ende des H.264-Videos liegenden Video-Index an den Anfang und ermöglicht so, das das Video schon während des Downloads abgespielt werden kann.
Hier einfach das entsprechende File auswählen – es wird dann umgewandelt und mit dem Zusatz „_qtp“ versehen neu abgespeichert. Der Übersicht halber kann das alte File gelöscht werden und das „_qtp“ wird in dessen Namen umbenannt
Das Flash Video in die Webseite einbetten
Zum JW FLV Media Payer gibt es auch viele alternative Player wie zB den FLV Flash Fullscreen Video Player. Ein Flash Videoplayer ist quasi das in Flash programmierte Interface, das eine Playeroberfläche mit Abspielknöpfen zur Verfügung stellt.
Um das resultierende Video jetzt auf der eigenen Webseite anzuschauen, muss der Flash Video Player auf die Website hochgeladen werden - er bietet dann die Player-Kontrollen sowie weitere Funktionen wie Vollbildmodus oder Autostart - ähnlich dem YouTube-Player. Für nicht-kommerzielle Nutzung ist der JWF Player kostenlos.
Mit einem Code-Schnipsel wie folgendem wird der Player mitsamt dem Video in eine Webseite eingebunden - der Einfachheit halber liegen alle Dateien bei uns in einem Verzeichnis:
<p id=´fvideo´ class="media">Clip </p>
<script type=´text/javascript´ src=´swfobject.js´></script>
<script type=´text/javascript´>
var s1 = new SWFObject(´player.swf´,´ply´,´720´,´576´,´9´,´#ffffff´);
s1.addParam(´allowfullscreen´,´true´);
s1.addParam(´autostart´,´true´);
s1.addParam(´flashvars´,´file=Video.mp4´);
s1.write(´fvideo´);
</script>
Video.mp4 ist der Name des jeweiligen Clips (evtl. ergänzt um eine Pfadangabe wenn er in einem anderen Verzeichnis, zB einem eigenen Clip-Verzeichnis liegen sollte)
swfobject.js und player.swf sind die Komponenten des JW FLV Players - hier ebenso den Pfad anpassen wenn die beiden Files der Ordnung halber in einem eigenen Verzeichnis liegen sollen.
´720´ und ´576´ bezeichnen die Größe des Videos - hier sollte die oben (skalierte ) Größe des encodeten MP4-Files eingetragen werden
´9´ definiert die Version des Flashplayers die zum Abspielen benötigt wird - in unserem Fall muss es die Version 9 sein, denn nur sie untersützt das Abspielen von H.264-Videos
´#ffffff´ definiert die Hintergrundfarbe als Hexwert (bekannt aus HTML) des Players, in diesm Fall weiß
allowfullscreen´,´true´ – mit diesem Parameter bestimmen Sie, ob der User die Möglichkeit haben soll per Klick auf das Vollbildsymbol das Video bildschirmfüllend abzuspielen.
´autostart´ ´true´ bedeuet, dass das Video sofort mit dem Laden der Seite abgespielt wird - ´false´ bedeutet immer jeweils das die Option ausgeschaltet ist.
Eine ausführliche Liste der Parameter des JW FLV Players (die meist auch in anderen Playern gelten, da sie einfach nur Funktionen von Flash ansprechen) findet sich hier - es können zB noch die Farben des Players bestimmt werden oder ob das Video geloopt werden soll.
Der Text zwischen den <p> Tags wird durch das Video ersetzt und nur angezeigt, wenn es nicht lädt. Der Wert von id - in diesem Fall fvideo muss einmalig sein und darf auf der Seite kein zweites Mal vorkommen.
Will man das Video (oder eine noch größere Version davon) auch zum Download anbieten, geht das einfach per
<a href="Video.mp4">Download</a>
und der Anweisung an den User per rechter Maustaste das Video "Ziel speichern unter" auf dem eigenen Computer abzuspeichern
Zeit für den Test: die HTML-Seite mit eingebettetem Code, Video und (wenn nicht schon gemacht) den Player hochladen und dann per Browser ansteuern - das Video sollte dann (eine DSL Verbindung vorausgesetzt) nach kurzem Vorladen abspielen und währenddessen weiter laden (zu sehen am dunkleren Balken in der Abspielleiste der sich kontinuierlich aufs rechte Ende zubewegt). Wer will, kann sich mit dem JW FLV Player auch eine Abspielliste anlegen aus der der Nutzer dann das gewünschte Video auswählen und abspielen kann.
Und so sieht der eingebettete Player mitsamt Video aus – hier hier mit einem X-Men II Trailer (mit freundlicher Genehmigung der 20th Century Fox ) mit rund 700 Kbit/s (600 Kbit/s Video / 80 Kbit/s Audio) encodiert:
Test: Panasonic
