38
Video Uwe Hebbelmann Web Publishing WS 2007/2008

Video Uwe Hebbelmann Web Publishing WS 2007/2008

Embed Size (px)

Citation preview

Page 1: Video Uwe Hebbelmann Web Publishing WS 2007/2008

VideoUwe HebbelmannWeb Publishing WS 2007/2008

Page 2: 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

Page 3: 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

Page 4: 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

Page 5: 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

Page 6: Video Uwe Hebbelmann Web Publishing WS 2007/2008

Beispiele

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008

z.B. AVI-Datei z.B. Datei mit Matroska-Container

Page 7: Video Uwe Hebbelmann Web Publishing WS 2007/2008

ÜbertragungsverfahrenMö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

Page 8: Video Uwe Hebbelmann Web Publishing WS 2007/2008

Vor- und Nachteile Dateidownload

Vorteil: ■ einfach einzusetzen (keine Serversoftware nötig)Nachteil: ■ Wartezeit

■ kann vom User gespeichert werden

Progressiver DownloadVorteil: ■ keine spezielle Serversoftware nötig (läuft über http)Nachteil: ■ 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

StreamingVorteile: ■ Navigation innerhalb des Clips möglich

■ kein Speichern des Users auf Festplatte (sichert nur im RAM)

Nachteile: ■ benötigt Streaming Server Applikation mit eigenem Protokoll

geeignet für lange Clips, z.B. Livebroadcasting

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008

Page 9: 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

Page 10: Video Uwe Hebbelmann Web Publishing WS 2007/2008

Verwendungs eines Links

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

Syntax:

<a href="URL">LINK</a>

Beispiel einer WMV Datei:

<a href="http://www.bsp.de/beispiel.wmv">WMV Video</a>

Page 11: Video Uwe Hebbelmann Web Publishing WS 2007/2008

<embed> Tag Syntax

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

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">

Page 12: Video Uwe Hebbelmann Web Publishing WS 2007/2008

<embed> Tag SyntaxZusätzliche Optionen:

TYPE: Angabe eines MIME Types ALIGN: wie Text angeordnet werden soll NAME: Name des embed-Objektes PLUGINSPAGE: URL eines möglichen PlugIns PLUGINURL: URL eines JAR Archives für automatische Installation HIDDEN: Objekt sichtbar true/false HREF: macht embed-Objekt auch zum Link TARGET: Ziel des Links AUTOSTART: Startet automatisch true/false LOOP: Wiedergabeschleife PLAYCOUNT: Anzahl der Abspielungen VOLUME: Lautstärke CONTROLS: Angabe von Steuerelementen CONTROLLER: Anzeige der Steuerelemente true/false MASTERSOUND: gibt an welcher Gruppe das Video angehört STARTTIME: Startzeit ENDTIME: Stoppzeit

(Es werden nicht alle Funktionen von allen Playern unterstüzt!)

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008

Page 13: Video Uwe Hebbelmann Web Publishing WS 2007/2008

<object> Tag Syntax mit MIME-Type

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008

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>

MIME-Type: teilt dem Browser mit welcher Datentyp vorliegt

Page 14: 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

Page 15: Video Uwe Hebbelmann Web Publishing WS 2007/2008

<object> Tag Syntax

Syntax:

<param name="Parameter Name" value="Parameter Inhalt">

Parameter können wie beim <embed> Tag innerhalb des <object> Tag angegeben werden.Zusätzlich geben <param> Tags Möglichkeiten zur Parameterübergabe:

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

Page 16: Video Uwe Hebbelmann Web Publishing WS 2007/2008

<object> Tag SyntaxZusätzliche Optionen u.a. :

DATA: URI (object data) ARCHIVE: CDATA (archive files) NAME: CDATA (name for form submission) USEMAP: URI (client-side image map) TYPE: ContentType (content-type of object) CODETYPE: ContentType (content-type of code) STANDBY: Text (message to show while loading) TABINDEX: Number (position in tabbing order) ALIGN: [ top | middle | bottom | left | right ]

(object alignment) BORDER: Pixels (link border width) HSPACE: Pixels (horizontal gutter) VSPACE: Pixels (vertical gutter) ...

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008

Page 17: Video Uwe Hebbelmann Web Publishing WS 2007/2008

<object> Tag Syntax mit ActiveX

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008

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

Page 18: Video Uwe Hebbelmann Web Publishing WS 2007/2008

<object> Tag Syntax mit ActiveX

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008

Die ClassID/CodeBase der wichtigsten Player:

Windows Media ClassID CLSID:22D6f312-B0F6-11D0-94AB-0080C74C7E95CodeBase http://activex.microsoft.com/activex/

controls/mplayer/en/nsmp2inf.cab#Version=6,4,7,1112

Quicktime 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-CC0F21721616CodeBase http://go.divx.com/plugin/

DivXBrowserPlugin.cab

Flash Video ClassID CLSID:d27cdb6e-ae6d-11cf-96b8-444553540000CodeBase http://fpdownload.macromedia.com/pub/

shockwave/cabs/flash/swflash.cab#version=8,0,0,0

Microsoft-Methode wird daher nicht von allen Browsern unterstützt

Page 19: Video Uwe Hebbelmann Web Publishing WS 2007/2008

Kombination aus <embed> Tag und <object> Tag Syntax

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008

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>

Page 20: 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

Page 21: 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

Page 22: 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

Page 23: Video Uwe Hebbelmann Web Publishing WS 2007/2008

Windows Media Video (WMV)

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008

Page 24: Video Uwe Hebbelmann Web Publishing WS 2007/2008

Windows Media Video (WMV)

* Beispielseite *

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008

Page 25: 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

Page 26: Video Uwe Hebbelmann Web Publishing WS 2007/2008

Quicktime (MOV)

* Beispielseite *

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008

Page 27: 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

Page 28: Video Uwe Hebbelmann Web Publishing WS 2007/2008

FlashVideo (FLV)

* Beispielseite *

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008

Page 29: 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

Page 30: Video Uwe Hebbelmann Web Publishing WS 2007/2008

DivX Media Format (DivX)

* Beispielseite *

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008

Page 31: 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

Page 32: Video Uwe Hebbelmann Web Publishing WS 2007/2008

RealVideo (RM)

* Beispielseite *

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008

Page 33: 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

Page 34: Video Uwe Hebbelmann Web Publishing WS 2007/2008

MPEG4 (MP4)

* Beispielseite *

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008

Page 35: Video Uwe Hebbelmann Web Publishing WS 2007/2008

YouTubeAllgemeines:

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

Page 36: Video Uwe Hebbelmann Web Publishing WS 2007/2008

YouTube

* http://www.youtube.com *

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008

Page 37: Video Uwe Hebbelmann Web Publishing WS 2007/2008

Literatur

http://de.selfhtml.org/html/multimedia/objekte.htm

http://www.microsoft.com/windows/windowsmedia/de/format/default.aspx

http://developer.apple.com http://de.wikipedia.org http://www.youtube.com

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008

Page 38: Video Uwe Hebbelmann Web Publishing WS 2007/2008

Ende

Vielen Dank für Ihre Aufmerksamkeit!

Video • Uwe Hebbelmann • Web Publishing WS 2007/2008