Durch die Wahl des richtigen Bildformats kann das Seitengewicht um 50 % oder mehr reduziert werden, ohne dass die visuelle Qualität darunter leidet. Wie entscheiden Sie sich, wenn JPEG, PNG, WebP, AVIF, GIF und SVG im Wettbewerb stehen?
TL;DR: Standardmäßig WebP für Fotos und komplexe Bilder. Verwenden Sie PNG für Grafiken, die Transparenz mit scharfen Kanten erfordern. Verwenden Sie SVG für Symbole und Logos. Ziehen Sie AVIF in Betracht, wenn Sie Fallbacks bereitstellen können.
Format-für-Format-Aufschlüsselung
JPEG
Seit 30 Jahren das Standardfotoformat im Internet. Verarbeitet Fotoinhalte gut, erzeugt aber bei gleicher visueller Qualität größere Dateien als WebP. Keine Transparenz. Verwenden Sie, wenn: Maximale E-Mail-Kompatibilität oder sehr alte Systeme.
PNG
Verlustfreies Format, ideal für Grafiken mit Text, Screenshots und Bilder, die Alpha-Transparenz benötigen. Erzeugt riesige Dateien für Fotos – verwenden Sie niemals PNG für Fotos.
WebP
Entwickelt von Google. Sowohl verlustbehaftet als auch verlustfrei. Erzeugt Dateien, die 25–35 % kleiner als JPEG und 26 % kleiner als PNG sind. Unterstützt Transparenz und Animation. Über 97 % Browser-Unterstützung im Jahr 2026. Der beste Allrounder für das Web.
AVIF
Format der nächsten Generation, das 20–50 % kleinere Dateien als WebP liefert. Die Kodierung ist langsamer, Browserunterstützung ~93 %. Ideal mit WebP/JPEG-Fallbacks über <picture>.
GIF
Veraltet. Begrenzt auf 256 Farben, enorme Dateigrößen für Animationen. Ersetzen Sie sie durch WebP-Animationen oder MP4/WebM-Videos für 80–90 % kleinere Dateien.
Dateigrößenvergleich
| Format | Foto (1920×1080) | Grafik (800×600) | Notizen |
|---|---|---|---|
| JPEG (q80) | 285 KB | 145 KB | Grundlinie |
| PNG | 2,1 MB | 95 KB | Großartig für Grafiken, schrecklich für Fotos |
| WebP (q80) | 195 KB | 68 KB | ~32 % kleiner als JPEG |
| AVIF (q80) | 142 KB | 52 KB | ~50 % kleiner als JPEG |
Entscheidungsflussdiagramm
- Logo, Symbol oder Illustration? → SVG
- Benötigt Transparenz? → WebP (verlustbehaftet oder verlustfrei) oder PNG
- Foto? → WebP (verlustbehaftet, q75–85)
- Maximale Komprimierung? → AVIF mit WebP/JPEG-Fallback
- E-Mail? → JPEG (beste E-Mail-Client-Unterstützung)
✅ So bedienen Sie mehrere Formate
Verwenden Sie HTML <picture> Element mit <source> Tags für AVIF und WebP, wobei auf JPEG/PNG zurückgegriffen wird <img> -Tag. Der Browser wählt das erste Format aus, das er unterstützt.
🔧 Konvertieren und Komprimieren in jedes beliebige Format – kostenlos
Legen Sie Ihre Bilder ab und konvertieren Sie sie mit Qualitätskontrolle zwischen JPEG, PNG und WebP. Läuft lokal in Ihrem Browser.
Öffnen Sie „Bild komprimieren“ →Fazit
Für die meisten Websites im Jahr 2026 ist WebP die korrekte Standardeinstellung. Es bietet die beste Balance zwischen Komprimierung, Qualität, Browserunterstützung und Funktionen. Verwenden Sie PNG für scharfkantige Transparenz, SVG für Vektoren und ziehen Sie AVIF für leistungskritische Seiten in Betracht.