Video

Video
Uwe Hebbelmann
Web Publishing WS 2007/2008
Inhalt






Was ist Video?
Übertragungsverfahren
Wie binde ich das Video ein?
Vorstellung verschiedener Formate
YouTube
Literatur
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Was ist Video?


Bewegte Bilder / Videodaten
Optional:





Audiodaten
Metadaten
Index- und Skriptbefehle
Menüstrukturen
...
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Videoformate






bezeichnet Aufzeichnungsverfahren für Videos
in der Regel analoges Videosignal als Basis
dieses wird von analog nach digital umgewandelt
und meist komprimiert gespeichert
hierzu werden unterschiedliche Dateiformate
verwendet
Verfahren für die digitale Kodierung von bewegten
Bildern und/oder Tönen werden Codecs genannt
diese liefern rohe Nutzdaten, die in
unterschiedlichen Containerformaten gespeichert
werden können
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Containerformate



Dateiformat, das verschiedene Datenformate
enthalten kann
typischerweise definiert ein Containerformat
nur die Art und Struktur, wie der Inhalt
aufzubewahren ist
Audio-/Video-Containerformate können
zumindest einen Audio- und Videostream
enthalten. Darüber hinaus optional
Metadaten, Index- und Skriptbefehle,
Menüstrukturen und andere Inhalte
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Beispiele
z.B. AVI-Datei
z.B. Datei mit Matroska-Container
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Übertragungsverfahren
Möglichkeiten:
 Dateidownload:
Video wird erst komplett geladen und kann
dann abgespielt werden
 Progressiver Download:
Video wird bereits gestartet, wenn die Datei
teilweise heruntergeladen wurde bzw. wird
 Streaming:
Video wird direkt beim Download abgespielt
(Einsatz von Buffering)
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Vor- und Nachteile

Dateidownload
Vorteil:
Nachteil:

■ einfach einzusetzen (keine Serversoftware nötig)
■ Wartezeit
■ kann vom User gespeichert werden
Progressiver Download
Vorteil:
Nachteil:
■
■
■
■
keine spezielle Serversoftware nötig (läuft über http)
keine Navigation im noch nicht geladenen Clipbereich möglich
„Ruckler“ beim Abspielen wenn Übertragung sich verzögert
kann vom User gespeichert werden
 nur für kurze Clips geeignet

Streaming
Vorteile:
Nachteile:
■ Navigation innerhalb des Clips möglich
■ kein Speichern des Users auf Festplatte (sichert nur im RAM)
■ benötigt Streaming Server Applikation mit eigenem Protokoll
 geeignet für lange Clips, z.B. Livebroadcasting
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Wie binde ich das Video ein?
Verwendung





eines Links
der <embed> Tag Syntax
der <object> Tag Syntax mit MIME-Type
der <object> Tag Syntax mit ActiveX
einer Kombination aus <embed> Tag und
<object> Tag Syntax
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Verwendungs eines Links
Syntax:
<a href="URL">LINK</a>
Beispiel einer WMV Datei:
<a href="http://www.bsp.de/beispiel.wmv">WMV Video</a>



einfachste Methode, dafür aber nicht sehr elegant
Video-Datei kann gespeichert werden oder
über einen externen Player in einem eigenen Fenster
geöffnet werden
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
<embed> Tag Syntax
Syntax:
<embed src="URL" width="BREITE" height="HÖHE">
Beispiel einer WMV Datei:
<embed src="http://www.bsp.de/beispiel.wmv"
width= "300" height= "300">


gehört nicht zum HTML Standart, wurde von
Netscape eingeführt
daher wird es nicht automatisch von allen
Browsern unterstützt
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
<embed> Tag Syntax
Zusätzliche Optionen:

















TYPE:
ALIGN:
NAME:
PLUGINSPAGE:
PLUGINURL:
HIDDEN:
HREF:
TARGET:
AUTOSTART:
LOOP:
PLAYCOUNT:
VOLUME:
CONTROLS:
CONTROLLER:
MASTERSOUND:
STARTTIME:
ENDTIME:
Angabe eines MIME Types
wie Text angeordnet werden soll
Name des embed-Objektes
URL eines möglichen PlugIns
URL eines JAR Archives für automatische Installation
Objekt sichtbar true/false
macht embed-Objekt auch zum Link
Ziel des Links
Startet automatisch true/false
Wiedergabeschleife
Anzahl der Abspielungen
Lautstärke
Angabe von Steuerelementen
Anzeige der Steuerelemente true/false
gibt an welcher Gruppe das Video angehört
Startzeit
Stoppzeit
(Es werden nicht alle Funktionen von allen Playern unterstüzt!)
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
<object> Tag Syntax mit MIME-Type
MIME-Type: teilt dem Browser mit welcher Datentyp vorliegt
Syntax:
<object type="MIME-Type"
data="URL"
width="BREITE" heigth="HÖHE">
Alternativer Inhalt
</object>
Beispiel einer Quicktime Datei:
<object type="video/quicktime"
data="http://www.bsp.de/beispiel.mov"
height="300" width="300">
Quicktime Video kann nicht angezeigt werden!
</object>
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
<object> Tag Syntax mit MIME-Type




gehört zum HTML-4-Standard
einheitliche, browserübergreifende Schreibweise
aber: benutzt zwar validen Code und folgt dem HTML-4-Standard, funktioniert
allerdings erst in neueren Browsern
gravierender Nachteil bei z.B. Flash Videos:
Internet Explorer startet das Video erst, wenn es komplett vom Server
übertragen wurde. Bei der Einbindung mithilfe der ActiveX Angabe oder
<embed> Tag wird das Video bereits gestartet, wenn die Datei teilweise
heruntergeladen wurde
Liste der wichtigsten MIME-Types:

Windows Media Video video/x-ms-wmv oder application/x-mplayer2

Quicktime
video/quicktime

Real Media
audio/x-pn-realaudio-plugin

MPEG Video
video/mpeg

DivX
video/divx

Flash Video
application/x-shockwave-flash
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
<object> Tag Syntax
Parameter können wie beim <embed> Tag innerhalb des <object> Tag
angegeben werden.
Zusätzlich geben <param> Tags Möglichkeiten zur Parameterübergabe:
Syntax:
<param name="Parameter Name" value="Parameter Inhalt">
Beispiel:
<param name="src" value="http://www.bsp.de/bsp.wmv">
Die Anzahl und Art der möglichen Parameter richtet sich nach dem
verwendetem Player
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
<object> Tag Syntax
Zusätzliche Optionen u.a. :













DATA:
ARCHIVE:
NAME:
USEMAP:
TYPE:
CODETYPE:
STANDBY:
TABINDEX:
ALIGN:
BORDER:
HSPACE:
VSPACE:
...
URI (object data)
CDATA (archive files)
CDATA (name for form submission)
URI (client-side image map)
ContentType (content-type of object)
ContentType (content-type of code)
Text (message to show while loading)
Number (position in tabbing order)
[ top | middle | bottom | left | right ]
(object alignment)
Pixels (link border width)
Pixels (horizontal gutter)
Pixels (vertical gutter)
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
<object> Tag Syntax mit ActiveX
Syntax:
<object classid="CLSID:XXXXXX-XXXX-XXXXXX"
codebase="URL"
width="BREITE" heigth="HÖHE">
<param name="src" value="URL">
Alternativer Inhalt
</object>
Beispiel einer DivX Datei:
<object classid="CLSID:67DABFBF-D0AB-41fa-9C46-CC0F21721616"
codebase="http://go.divx.com/plugin/DivXBrowserPlugin.cab"
width="300" height="300">
<param name="src" value="http://www.bsp.de/beispiel.divx">
DivX Video kann nicht angezeigt werden!
</object>
ClassID: referenziert die Implementierung des gewünschten ActiveX-Controls
CodeBase: gibt Adresse an, von der das ActiveX-Control geladen werden kann
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
<object> Tag Syntax mit ActiveX


Microsoft-Methode
wird daher nicht von allen Browsern unterstützt
Die ClassID/CodeBase der wichtigsten Player:
Windows Media
Quicktime
ClassID CLSID:22D6f312-B0F6-11D0-94AB-0080C74C7E95
CodeBase http://activex.microsoft.com/activex/controls/mplayer/
en/nsmp2inf.cab#Version=6,4,7,1112
ClassID CLSID:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B
CodeBase http://www.apple.com/qtactivex/qtplugin.cab
Real Media
ClassID
CLSID:CFCDAA03-8BE4-11cf-B84B-0020AFBBCCFA
DivX
ClassID CLSID:67DABFBF-D0AB-41fa-9C46-CC0F21721616
CodeBase http://go.divx.com/plugin/DivXBrowserPlugin.cab
Flash Video
ClassID CLSID:d27cdb6e-ae6d-11cf-96b8-444553540000
CodeBase http://fpdownload.macromedia.com/pub/shockwave/
cabs/flash/swflash.cab#version=8,0,0,0
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Kombination aus <embed> Tag und <object> Tag Syntax
Syntax:
<object type="MIME-Type"
data="URL"
width="BREITE" heigth="HÖHE">
<embed type="MIME-Type" src="URL"
width="BREITE" height="HÖHE">
Alternativer Inhalt
</object>
Beispiel einer Quicktime Datei:
<object type="video/quicktime"
data="http://www.bsp.de/bsp.mov"
width="300" heigth="300">
<embed type="video/quicktime" src="http://www.bsp.de/bsp.mov"
width="300" height="300">
Quicktime Video kann nicht angezeigt werden!
</object>
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Kombination aus <embed> Tag und <object> Tag Syntax



hat sich als sehr „robust“ erwiesen
wird u.a. offiziell vom Flash-Hersteller
Macromedia empfohlen
Nachteil: Verwendung eines HTML-Elements, das
nicht zum Standart gehört
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Containerformate

Windows Media Video (WMV)

Quicktime (MOV)

FlashVideo (FLV)

DivX Media Format (DivX)

RealVideo (RM)

MPEG4 (mp4)
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Windows Media Video (WMV)






proprietärer Video-Codec von Microsoft
der Codec dient zur Komprimierung von Videos und zur
Umwandlung von Diashows in Videosequenzen
unterstützt die Einbindung von Digital Rights Management
(DRM)
besteht aus Windows Media Audio- und Video-Codecs, einem
DRM-System und einem Dateicontainer
dieser speichert folgende Elemente in einer Datei:
Audio, Video, Metadaten sowie Index- und Skriptbefehle
es existieren drei Versionen von WMV, die allesamt vom
Aufbau her ähnlich zu MPEG4 sind
("von Microsoft entwickelte proprietäre Variante von MPEG4")
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Windows Media Video (WMV)
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Windows Media Video (WMV)
* Beispielseite *
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Quicktime (MOV)







Containerformat der gleichnamigen Abspielsoftware von Apple
Speicherung erfolgt in sowohl sequenziell als auch hierarchisch
organisierten Dateneinheiten
es kann daher neben chronologischen Informationen und
Spurdaten, auch strukturelle und hierarchische Informationen
und Zusammenhänge speichern
durch einen speziellen Synchronisations-Layer eignet es sich
zudem für das Streaming
kennzeichnende Eigenschaften des Formates sind Flexibilität,
Robustheit und Erweiterbarkeit
desweiteren gute Qualität bei wenig Platzbedarf, allerdings
höherer Anforderungen an die Leistung des Rechners
dient als Basis für das ISO-standardisierte MPEG4-Dateiformat
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Quicktime (MOV)
* Beispielseite *
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
FlashVideo (FLV)




Containerformat von Adobe
für Webstreaming optimiertes Format
sehr gute Qualität bei geringem Dateivolumen
unterstützt folgende Codecs:


Video:
 Sorenson-H.263
 On2 VP6
 MPEG-4 AVC
Audio:
 MP3
 Nellymoser Asao Codec
 High Efficieny AAC (HE-AAC)
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
FlashVideo (FLV)
* Beispielseite *
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
DivX Media Format (DivX)




MPEG4-kompatibler Video-Codec von DivX Inc.
bekannt dafür große Videodateien bei guter Qualität
vergleichsweise stark komprimieren zu können
deshalb u.a. sehr beliebt für Filmdownload
Erweiterung des AVI Formats, unterstüzt:






interaktive Menüs
ein oder mehrere Untertitel
ein oder mehrere Audiostreams
ein oder mehrere Videostreams
Kapitel stezen
Metadaten
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
DivX Media Format (DivX)
* Beispielseite *
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
RealVideo (RM)






proprietäres Containerformat von RealMedia mit eigenem Kompressions-Codec
wird vor allem in Streaming-Anwendungen benutzt
es existieren vier untereinander nicht kompatible Versionen:
 RV10: RealVideo 5, die erste Version von RealVideo, das Format ist
identisch mit H.263
 RV20: RealVideo G2; RealVideo G2+SVT
 RV30: RealVideo 8
 RV40: RealVideo 9; RealVideo 9 EHQ; RealVideo 10
Sure Stream:
 Verfahren prüft Datenübertragungsgeschwindigkeit und reduziert die
Datenmenge entsprechend
 mehrer Übertragungsqualitäten können in einer Videodatei abgelegt werden
in den 1990ern wichtigstes Audio-/Videoformat im Netz
seit 2002 sind Teile des Quellcodes freigegeben, seitdem existiert das Open
Source Projekt helixcommunity.org
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
RealVideo (RM)
* Beispielseite *
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
MPEG4 (MP4)




ISO-standardisiertes Containerformat für MPEG4 Inhalte
(basiert auf Quicktime)
organisiert die Mediendaten ebenso wie dieses, in hierarchischen
und sequenziellen Dateneinheiten
diese können eine Vielzahl unterschiedlicher Medientypen
aufnehmen und mit Strukturinformationen und deren
Abhängigkeiten speichern
es nicht üblich, alle verfügbaren Formate in MPEG4 einzubinden; der
Container ist auf folgende Formate beschränkt:




Video: MPEG-4 (Part 2, Part 10 (AVC/H.264)), MPEG-2 und
MPEG-1
Audio: AAC, MP3, MP2, MP1, CELP (für Sprache), TwinVQ,
SAOL (MIDI)
Bilder: JPEG, PNG
Grafik und Text: BIFS
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
MPEG4 (MP4)
* Beispielseite *
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
YouTube
Allgemeines:





am 15. Februar 2005 gegründetes Videoportal, auf dem Benutzer kostenlos Video-Clips
ansehen und hochladen können.
wurde am 9. Oktober 2006 von Google für umgerechnet 1,31 Milliarden Euro gekauft.
45 Prozent Marktanteil im Bereich Videoportal
verantwortlich für 10 Prozent des gesamten Internet-Datenverkehrs und 20 Prozent des
HTTP-Aufkommens. (Nach Berechnungen des US-Unternehmens Ellacoya Networks)
Alexa Ranking 3 (hinter yahoo.com und google.com)
Technik:





verwendet das Flash-Video-Format
nutzt Streaming-Technik
Videos können in verschiedenen Formaten (u.a. AVI, MPEG, WMV oder Quicktime)
hochgeladen werden
werden vor der Weiterverbreitung von YouTube in das Flash-Video-Format konvertiert
Clips dürfen im Regelfall eine Größe von 100 MB oder 10 Minuten nicht überschreiten
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
YouTube
* http://www.youtube.com *
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Literatur





http://de.selfhtml.org/html/multimedia/objekte.
htm
http://www.microsoft.com/windows/windows
media/de/format/default.aspx
http://developer.apple.com
http://de.wikipedia.org
http://www.youtube.com
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008
Ende
Vielen Dank für Ihre Aufmerksamkeit!
Video • Uwe Hebbelmann • Web Publishing WS 2007/2008