MP4 vs WebM fuer das Web - wann jedes Format verwenden
freetoolonline.com Editorial Team
MP4 (H.264) und WebM (VP9/AV1) sind die zwei Video-Container-Formate fuer das Web. MP4 ist der universelle Standard; WebM liefert 30-40% kleinere Dateien in modernen Browsern mit lizenzfreien Codecs. Dieser Leitfaden behandelt Codec-Abwaegungen, Browser-Unterstuetzung 2026 und die drei Produktionsentscheidungen.
Container vs Codec - was jede Datei tatsaechlich enthaelt
Ein Container umhuellt Video, Audio und Metadaten in eine einzige Datei, die ein Player lesen kann. MP4 (ISO base media) und WebM (ein eingeschraenktes Matroska-Profil) sind beide Container. Der Codec ist, wie die Videopixel und Audio-Samples komprimiert werden. Ein MP4 kann theoretisch fast jeden Codec tragen, aber in der Praxis behandelt das Web-Oekosystem MP4 als H.264-Datei. WebM ist speziell fuer lizenzfreie Codecs gebaut - VP8 (selten 2026), VP9 (Mainstream) und AV1 (neueste, hoechste Kompression).
Wenn die Entscheidung als "MP4 oder WebM" formuliert ist, ist die eigentliche Entscheidung H.264 vs VP9 vs AV1 - welcher Codec zu kodieren. Der Container folgt dem Codec. H.264 wird in MP4 ausgeliefert; VP9 und AV1 werden im Web in WebM ausgeliefert.
Codec-Groessenvergleich fuer dieselbe visuelle Qualitaet
| Szenario | H.264 (MP4) | VP9 (WebM) | AV1 (WebM) |
|---|---|---|---|
| 60-Sekunden-Clip 1080p 30fps | ~12 MB | ~7 MB | ~5 MB |
| 60-Sekunden-Clip 720p 30fps | ~6 MB | ~3.5 MB | ~2.5 MB |
| Relative Bitrate-Einsparungen vs H.264 | 0% (Basislinie) | ~40% kleiner | ~55% kleiner |
| Codierzeit fuer 1 Minute 1080p | ~15 Sekunden | ~2-3 Minuten | ~8-15 Minuten |
| Wiedergabe-CPU auf Mittelklasse-Laptop | Niedrig (Hardware-Decode) | Niedrig (Hardware-Decode) | Moderat (Hardware-Decode unregelmaessig bei Pre-2023-GPUs) |
Browser-Unterstuetzungsrealitaet 2026
MP4/H.264 wird in 100% der ausgelieferten Browser abgespielt - Chrome, Firefox, Safari, Edge, jedes mobile WebView. Seit einem Jahrzehnt. Wenn ein abspielbares Video wichtiger ist als eingesparte Bytes, liefern Sie H.264 aus.
WebM/VP9 wird in Chrome, Firefox, Edge, Opera und Safari abgespielt (seit Safari 14, macOS Big Sur, 2020). Mobiles Safari auf iOS 14+ unterstuetzt VP9. Eine sehr kleine Restpublikum auf Legacy-iPhones unter iOS 14 kann VP9 nicht dekodieren.
WebM/AV1 wird in Chrome 70+, Firefox 67+ und Edge 75+ abgespielt. Safari fuegte AV1-Unterstuetzung in 17.4 (2024) hinzu. Hardware-AV1-Decode erfordert relativ neues Silizium - Intel 11. Gen (Tiger Lake) oder neuer, Apple M3 oder neuer, AMD 6000-Serie oder neuer. Pre-2022-Geraete fallen auf Software-Decode zurueck, was die Batterie entleert und Frames bei 4K-Inhalt verlieren kann.
Das <source>-Fallback-Muster
Das kanonische HTML5-Video-Muster liefert einen empfohlenen Codec, den der Browser dekodieren kann, und faellt durch die Liste zurueck:
<video controls preload="metadata" poster="cover.jpg">
<source src="clip.av1.webm" type="video/webm; codecs=av01.0.05M.08">
<source src="clip.vp9.webm" type="video/webm; codecs=vp9,opus">
<source src="clip.h264.mp4" type="video/mp4; codecs=avc1.4D401F,mp4a.40.2">
<p>Ihr Browser unterstuetzt kein HTML5-Video.</p>
</video>Der Browser durchlaeuft die <source>-Liste von oben nach unten, waehlt den ersten type, den er erkennt, und ignoriert den Rest. AV1 zuerst auszuliefern faengt die ~60% der 2026-Geraete ein, die Hardware-AV1-Decode haben; VP9 faengt die meisten anderen ein; H.264 garantiert 100% Fallback.
Die drei realen Produktionsentscheidungen
Entscheidung 1 - Kurzer Social-Clip fuer breiteste Reichweite. → Nur MP4 (H.264). Einmal codieren. Jeder Browser, jede Social-Plattform, jeder E-Mail-Client spielt es ab. Bandbreiteneinsparungen von VP9/AV1 rechtfertigen nicht die Codierzeit und die Edge-Case-Geraete, die Sie verpassen wuerden.
Entscheidung 2 - Hintergrund-Hero-Video auf einer Marketing-Site bei 1080p, 15-Sekunden-Loop. → MP4 (H.264) + WebM (VP9). Die VP9-Datei liefert bei ~60% der H.264-Groesse aus, was schnellere Seitenladezeiten fuer Besucher mit langsamen Verbindungen bedeutet. Die H.264-Datei ist das Fallback fuer alle, deren Browser WebM ueberspringt. Codierzeit ist klein (einmalig, 15-Sekunden-Clip).
Entscheidung 3 - Langform-Streaming-Bibliothek (VOD-Dienst, Kursplattform, 30+-Minuten-Videos). → AV1 (WebM) + VP9 (WebM) + H.264 (MP4). Die AV1-Dateien sparen erhebliche CDN-Egress-Kosten bei Skala. Die VP9-Dateien decken jeden modernen Browser ab. Die H.264-Dateien sind das universelle Fallback. Codieren Sie auf GPU-Hardware oder einem Batch-Pipeline; die 10×-Codierzeit von AV1 ist wichtig, wenn die Bibliothek Tausende von Videos hat.
Codierrezepte
H.264 (MP4) - das sichere Universelle. Ein einzelner FFmpeg-Einzeiler trifft den Sweet Spot fuer Web-Auslieferung: ffmpeg -i in.mov -c:v libx264 -crf 23 -preset medium -c:a aac -b:a 128k -movflags +faststart out.mp4. Das +faststart-Flag setzt das moov-Atom an den Anfang der Datei, sodass ein Browser die Wiedergabe vor dem vollstaendigen Download beginnen kann.
VP9 (WebM) - bestes Kompressions-/Kompatibilitaets-Gleichgewicht. Verwenden Sie Zwei-Pass-Codierung fuer konsistente Qualitaet bei einer Ziel-Bitrate. -c:v libvpx-vp9 -b:v 0 -crf 31 -row-mt 1 -c:a libopus -b:a 96k. Das -row-mt 1-Flag aktiviert zeilenbasiertes Multi-Threading, das die Codierzeit auf modernen CPUs etwa halbiert.
AV1 (WebM) - maximale Kompression. SVT-AV1 ist der Encoder, auf den sich die Industrie geeinigt hat: -c:v libsvtav1 -crf 35 -preset 6 -c:a libopus -b:a 96k. Preset 6 ist das Standard-Gleichgewicht zwischen Geschwindigkeit und Kompression; niedrigere Presets (4, 5) bevorzugen die Qualitaet auf Kosten viel laengerer Codierungen.
Wann WebM ganz vermeiden
Wenn Ihr Publikum hauptsaechlich iOS < 14, aelteres Android WebView oder Legacy-Enterprise-Browser ist, bietet WebM keinen Nutzen - diese Geraete fallen ohnehin auf die H.264-Quelle zurueck, und die WebM-Codierung ist verschwendete Muehe. Wenn das Video benutzergenerierter Inhalt ist, den Zuschauer oft speichern, neu teilen oder bearbeiten, ist H.264 MP4 das Format, das ihre Werkzeuge erwarten zu akzeptieren.
E-Mail-Clients rendern <video> fast nie nativ. Wenn das Video in einem E-Mail-Newsletter ist, exportieren Sie ein kurzes animiertes GIF oder einen MP4-Link zu einer Landing Page - weder WebM noch ein Inline-HTML5-Videotag helfen.
Zwischen Formaten konvertieren
Unser Video-Konverter handhabt MP4 ↔ WebM im Browser mit FFmpeg.wasm - kein Upload, keine Installation. Fuer Langform-Batch-Konvertierung installieren Sie FFmpeg lokal und verwenden die obigen Rezepte; der Inbrowser-Konverter ist durch Ihren verfuegbaren RAM begrenzt (typischerweise 2-4 GB pro Tab), was fuer einzelne Clips funktioniert, aber nicht fuer einen 50-Video-Katalog. Sehen Sie unseren FFmpeg-Online-vs-Lokal-Vergleichsleitfaden dafuer, wann jeder gewinnt.
Verwandte Werkzeuge
- Video Converter - MP4-, WebM-, MOV-Konvertierung im Browser.
- FFmpeg Online - FFmpeg-Kommandozeile im Browser.
- Video Maker - Bilder zu einem Videoclip zusammenfuegen.
- Compress Image - Dateigroesse des Cover-Bildes reduzieren.
Verwandte Leitfaeden
- MP4 vs MOV vs MKV - which container when - Auswahl zwischen den drei gaengigen Containern fuer verschiedene Produktionspipelines.
- Before a video call - which tools to run - Checkliste vor dem Anruf fuer Bereitschaft von Bildschirm, Kamera und Mikrofon.
Why trust these tools
- Ten-plus years of web tooling. The freetoolonline editorial team has shipped browser-based utilities since 2015. The goal has never changed: get you to a working output fast, without an install.
- No install, no sign-up. Open a tool and get a working output in seconds - nothing to download and no account to create. Tools that need heavy processing run it on our service, so even a low-powered machine gets the job done.
- Analytics stops at the page view. We measure which pages get visited, not what you type or upload inside a tool. There is nothing to sign in to and no profile is attached to your input.
- Open-source core components. The processing engines underneath (libheif, libde265, pdf-lib, terser, clean-css, ffmpeg.wasm, and others) are public and audit-able. We link to each one in its tool page's footer.
- Free, with or without ads. All tools are fully functional without sign-up. The Disable Ads button in the header is always available if you need a distraction-free run.