Video für Webseiten

MP4-Video

Flash-Video war über Jahre hinweg das sicherste Format für Video im Internet. Seit einem Jahrzehnt ist der Computer nicht mehr das Internet. Mobile Geräte stellen auf allen Webseiten den großen Anteil der Zugriffe und haben zum Umdenken geführt.

Zur Standard-Kombination für Video in HTML-Seiten gehörten MP4 oder WebM, das jetzt auch von Safari unterstützt wird. Auf jeden Fall müssen vier Einstellungen für jedes Video im Internet getroffen werden:

Speicherformat

Ähnlich wie bei Bildern, wo man sich zwischen JPEG, GIF und BMP entscheiden muss, muss auch für das Video ein Speicherformat festgelegt werden.

Schema für Video-Formate, Bild-Formate und PDF

Videos bestehen i.d.R. aus einem Video-Track, einem oder mehreren Audio-Tracks, Untertiteln und evt. aus Metadaten wie dem Titel des Videos. Diese Tracks sind miteinander verbunden, damit Audio-Track und Untertitel immer synchron zu den gezeigten Bildern bleiben.

MP4, M4V, MOV, AVI, FLV, OGV … sind Containerformate für Videos – ähnlich wie TIF ein Container für Pixeldaten und PDF ein Container für Text und Bilder sind.

Auflösung des Videos

Zusätzlich müssen hochauflösende Videos - z.B. ein Full HD-Format mit 1920 x 1020 Pixeln – verkleinert werden. Auf der einen Seite wäre Full HD für die meisten Monitore zu groß und natürlich spart die Verkleinerung jede Menge Bandbreite.

Immerhin strebt das Video Web der HD-Auflösung (1280 x 720 Pixel) entgegen, aber zusätzlich sollte für mobile Geräte eine kleiner Version des Videos angeboten werden.

<video controls> 
   <source type="video/mp4" media="all and (min-width:680px)" src="video-large.mp4" > 
   <source type="video/mp4" media="all and (min-width:320px)" src="video-small.mp4" >  
</video>

Datenrate des Videos

Bei der Vorbereitung des Videos für das Internet wird eine Datenrate eingestellt – die erzielbare Datenrate richtet sich nach der Übertragungsleitung vom Server zum Betrachter des Videos. Für eine normale DSL-Leitung können wir z.B. eine effektive Datenrate von 1 bis 5 MBit/s annehmen, für HD-Video sollte die Datenrate 2 bis 5 MBit/s betragen.

Browserunterstützung für Videoformate

Mit der Dateiendung der Videodatei können wir Videos am einfachsten identifizieren – .avi, .mov oder .mp4. Es gibt .mp4 (MPEG 4) und .m4v (von Apple entwickeltes Videoformat, wie mp4, aber mit optionalem DRM-Kopierschutz), Google kommt mit webM.

Browser spielen nur eine begrenzte Zahl von Videoformaten von Haus aus ab. Mit HTML5 bringen alle Browser ein Videoformat von Haus aus mit.

Nach anfänglichen Differenzen können heute alle modernen Browser MP4 und WebM abspielen – auch Safari (seit OS Big Sur).

Eines Tages sind die Server sicher schnell genug, um Videos on the fly von einem Format in ein anderen zu konvertieren, aber bis dahin müssen Videos »auf Vorrat« in die gängigen Formate konvertiert werden. Ein einfaches Programm zum Konvertieren von MP4- oder MOV-Videos in OGV oder WebM ist z.B. ffmpeg2theora, zum Konvertieren von Videos in MP4 bzw. M4V ist Handbrake.

• MP4 (MPEG-4-Dateiformat) | Standard-Containerformat für MPEG-4-ASP-/-AVC-Videostreams; basiert auf dem Quicktime-Containerformat.
• OGG | ein Format für Firefox, das sowohl Audio als auch Video enthalten kann.
• OGV | heute setzt Firefox auf OGV für Video und ogg oder oga für Audio.
• webM | Google wollte urprünglich webM als Standard für Video im Internet etablieren.
• FLV Flash Video von Adobe Systems | Flash Video (.flv) ist ein für Webstreaming optimiertes Format. Allerdings muss im Webverzeichnis des Servers ein Shockwave-Player liegen, denn flv kann nicht direkt abgespielt werden, sondern braucht einen Shockwave-Player.
• AVI (Audio Video Interleave) | das wahrscheinlich überflüssigste Containerformat, das wir jetzt endgültig begraben können.