In diesem Artikel erfahren Sie mehr über die Grundlagen von Mediendateien, z. B. die Konzepte eines Containers, und einige der vielen verfügbaren Codec-Formate, die Sie in einem Stream verwenden können. Außerdem werden Themen wie adaptives Streaming, Bitrate und Auflösung leicht behandelt. All diese behandeln wir in späteren Abschnitten.
Videodateien bereitstellen
Vielleicht denken Sie, dass Sie eine RAW-Datei von einer Videokamera unverändert in das Web hochladen können. Auf Video-Streaming-Websites wie YouTube oder Vimeo können Sie genau das tun und sogar Livestreaming-Funktionen bereitstellen. In der Regel werden Sie eine Verbindung zum HDMI-Port Ihrer Kamera herstellen und diese dann über eine Aufnahmekarte verarbeiten. Diese Dienste vereinfachen die Verarbeitung und das Hochladen von Videos erheblich. Dazu gehört das Generieren der vielen Dateien und Manifeste, die für adaptives Streaming und verschiedene Auflösungen erforderlich sind. Außerdem gibt es viele andere komplizierte und differenzierte Anforderungen, die das Selbsthosting zu einer lästigen Pflicht machen. Das Vorbereiten und Bereitstellen eines Videos von Ihrer eigenen Website – wahrscheinlich einem separaten Medienserver – ist etwas komplizierter als das reine Hochladen einer Kamerarohdatei, wenn es Ihnen wichtig ist, wie Nutzer Ihre Website erleben.
Videodateien sind in einer Vielzahl von Formaten verfügbar. Das Format der Kamera ist in der Regel eine .mov
-Datei oder .mp4
, wenn Sie eine gute moderne spiegellose Kamera haben.
Ein .mov
eignet sich zwar gut zum Aufzeichnen, zur Bearbeitung und für andere frühe Nachbearbeitungsprozesse, ist aber aufgrund der Dateigröße nicht für das Streaming über das Web geeignet. Außerdem ist die Größe einer RAW-.mp4
-Datei in 4K extrem unangenehm, um diese Datei auf Mobilgeräten abzuspielen. Da Browser unterschiedliche Dateiformate unterstützen, müssen Sie mehrere optimierte Dateien und möglicherweise ein Manifest erstellen, wenn Sie adaptives Streaming unterstützen möchten. Bevor Sie Dateien konvertieren, müssen Sie einige Grundlagen
über sie und ihre Eigenschaften verstehen.
Container, Codecs und Streams?
Die Datei, die Sie in der Betriebssystem-Shell sehen, ist ein Container, der durch eine Dateiendung (.mp4
, .webm
, .ogg
usw.) identifiziert wird. Der Container enthält einen oder mehrere Streams. Eine Mediendatei kann eine beliebige Anzahl von Streams und wesentlich mehr Formate enthalten, als hier beschrieben werden.
Die weiter unten in diesem Abschnitt verwendeten Beispieldateien enthalten höchstens zwei Streams: einen Audiostream und einen Videostream. Zu den anderen Typen, die Ihnen begegnen können, gehören Bildunterschriften und Daten, die beide den Rahmen dieses Artikels sprengen. Es gibt Fälle, in denen Audio- und Videostreams separat behandelt werden. Die meisten Dateien enthalten nur einen Audiostream und einen einzigen Videostream.
In den Audio- und Videostreams werden die eigentlichen Daten mit einem Codec komprimiert. Ein Codec oder Coder/Decoder ist ein Komprimierungsformat für Video- oder Audiodaten. Die Unterscheidung zwischen einem Container und einem Codec ist wichtig, da der Inhalt von Dateien mit demselben Container mit unterschiedlichen Codecs codiert sein kann.
Das Bild unten veranschaulicht diese Struktur. Links sehen Sie die grundlegende Containerstruktur mit zwei Streams. Rechts sind die Details dieser Struktur für eine einzelne WebM-Datei aufgeführt.
![Vergleich der Mediendateistruktur mit einer hypothetischen Mediendatei](https://web.dev/static/articles/media-file-basics/image/comparing-media-file-stru-58d7e1713333f.png?authuser=6&hl=de)
Dateien in WebM-Containern können um einiges kleiner als andere Formate sein, was sie zu einer guten Wahl für das Streamen von mobilen Websites macht. Leider unterstützen nicht alle Browser aktuelle Container und Codecs. WebM wurde beispielsweise speziell für das Web als qualitativ hochwertige und Open-Source-Option entwickelt, unterstützt aber noch nicht universell. Insbesondere Safari unterstützt WebM gemäß der Richtlinie Can I use zum Zeitpunkt der Veröffentlichung dieses Dokuments nicht für eingebettete Videos. WebM bietet jedoch teilweise Unterstützung für den in WebRTC verwendeten VP8- und VP9-Codec. Daher ist es am besten, ein Fallback-Video bereitzustellen.
Codec-Formate
Viele Dateitypen unterstützen mehrere Codecs innerhalb desselben Containers. Eine vollständige Liste der verfügbaren Video-Codecs und Audio-Codecs wäre eine ganze Website für sich selbst. Die eben bereitgestellten Links sind für MDNs praktische Listen mit nützlichen Inhalten im Web gedacht. Nachfolgend sind die derzeit bevorzugten Dateitypen und die eventuell verwendeten Codecs aufgeführt. Klicken Sie auf die Links zu den Dateitypen, um zu sehen, welche Browser sie unterstützen.
File type | Video-Codec | Audio-Codec |
---|---|---|
MP4 | AV1, AVC (H.264)*, VP9 | AAC |
WebM | AV1, VP9* | Vorbis, Opus |
* Gibt den bevorzugten Video-Codec an.
Bitrate und Auflösung
Die Bitrate ist die maximale Anzahl von Bits, die zum Codieren einer Sekunde eines Streams verwendet wird. Je mehr Bits zum Codieren einer Sekunde des Streams verwendet werden, desto höher sind die potenziellen Details und die Genauigkeit. Weitere Informationen zu diesem Konzept findest du in der Bitrate.
Die Auflösung ist die Menge der Informationen in einem einzelnen Videoframe, angegeben als Anzahl der logischen Pixel in jeder Dimension. Weitere Informationen zu diesem Konzept finden Sie unter Lösung.
Als Nächstes zeigen wir Ihnen im Abschnitt Grundlagen der Medienanwendung, wie Sie diese Eigenschaften mit zwei Befehlszeilentools untersuchen können: Shaka Packager und FFmpeg.