Bilder sind der Hauptgrund, warum Websites langsam laden.
Auf einer durchschnittlichen Webseite machen Bilder mehr als die Hälfte der gesamten Dateigröße aus. Ein einziges unkomprimiertes Hauptfoto (Hero-Image) kann schwerer sein als jede Codezeile, jede Schriftart und jedes Skript auf der gesamten Seite zusammen. Wenn dieses Foto 4 MB groß ist, warten Ihre Besucher. Und wartende Besucher verlassen die Seite.
Google weiß das. Die Seitengeschwindigkeit ist ein Rankingfaktor und das Gewicht von Bildern ist das Erste, was ihre Core Web Vitals messen. Langsame Bilder schaden gleichzeitig Ihrem Ranking, Ihrer Absprungrate und Ihren Conversions.
Die gute Nachricht: Sie können die Bilddateigrößen in der Regel um 60-80 % reduzieren, ohne dass ein sichtbarer Qualitätsverlust auftritt. Der Trick besteht darin, zu wissen, was zu komprimieren ist, wie weit man gehen kann und welches Format man verwenden sollte. Dieser Leitfaden deckt alle drei Aspekte ab.
Warum Bildkomprimierung wichtiger ist als fast alles andere
Die Seitengeschwindigkeit ist keine reine Eitelkeitskennzahl. Sie ist direkt mit Geld und Rankings verbunden.
Geschwindigkeit beeinflusst das Ranking
Google verwendet Core Web Vitals als Ranking-Signal. Das wichtigste davon, Largest Contentful Paint (LCP), misst, wie lange es dauert, bis das größte Element auf dem Bildschirm geladen ist. Dieses größte Element ist fast immer ein Bild. Komprimieren Sie es, und Ihr LCP-Wert verbessert sich, was wiederum Ihrem Suchmaschinen-Ranking hilft.
Geschwindigkeit beeinflusst die Absprungrate
Studien zeigen durchweg, dass die Absprungraten stark ansteigen, wenn die Ladezeiten zunehmen. Wenn das Laden einer Seite 1 bis 3 Sekunden dauert, steigt die Wahrscheinlichkeit eines Absprungs um 32 %. Von 1 bis 5 Sekunden springt sie um 90 % nach oben. Schwere Bilder sind die häufigste Ursache für diese langsamen Ladezeiten.
Geschwindigkeit beeinflusst die Conversions
Schnellere Websites konvertieren besser. Jede große E-Commerce-Studie hat das gleiche Muster gefunden: Sparen Sie eine Sekunde Ladezeit ein, und die Conversions steigen. Für einen Online-Shop kann die Bildkomprimierung den Umsatz direkt steigern.
Wie Bildkomprimierung tatsächlich funktioniert
Komprimierung reduziert die Dateigröße, indem das Bild effizienter gespeichert wird. Es gibt zwei grundlegend verschiedene Ansätze, und den Unterschied zu kennen, ist der Schlüssel zur Erhaltung der Qualität.
Verlustbehaftete Komprimierung (Lossy)
Verlustbehaftete Komprimierung verwirft dauerhaft einige Bilddaten, um die Datei kleiner zu machen. JPEG ist das klassische Beispiel. Der Trick dabei ist, dass zuerst die Daten verworfen werden, die das menschliche Auge am wenigsten bemerkt. Bei einer Qualität von 85 % sieht ein verlustbehaftetes JPEG für das menschliche Auge identisch zum Original aus, benötigt aber nur einen Bruchteil des Speicherplatzes.
Wenn Sie die verlustbehaftete Komprimierung zu weit treiben (unter 70 % Qualität), beginnen Sie Artefakte zu sehen: blockartige Bereiche, unscharfe Kanten, Farbabstufungen (Banding) im Himmel. Die Kunst besteht darin, den Punkt zu finden, an dem die Datei klein, der Schaden aber unsichtbar ist.
Verlustfreie Komprimierung (Lossless)
Die verlustfreie Komprimierung macht die Datei kleiner, ohne Daten zu verwerfen. Das Bild wird perfekt rekonstruiert. PNG verwendet eine verlustfreie Komprimierung. Der Kompromiss ist, dass verlustfreie Dateien größer sind als verlustbehaftete Dateien, weil sie alles behalten.
Verwenden Sie verlustfrei für Grafiken, Logos und Bilder mit scharfem Text, bei denen jeder Pixel zählt. Verwenden Sie verlustbehaftet für Fotografien, bei denen das Auge kleine Verluste nicht bemerkt.
Welche Komprimierung soll verwendet werden: Der Entscheidungsleitfaden
Wählen Sie das falsche Format und Sie blähen entweder Ihre Datei auf oder ruinieren Ihr Bild. So treffen Sie die richtige Wahl.
Für moderne Websites ist WebP die Standardantwort. Es komprimiert besser als JPEG und PNG und unterstützt sowohl Fotos als auch Transparenz. Der einzige Grund, etwas anderes zu verwenden, ist die Fallback-Unterstützung für sehr alte Browser.
Bildformate für das Web, nach Anwendungsfall sortiert
WebP (der moderne Standard)
WebP wurde von Google entwickelt und liefert bei gleicher Qualität 25-35 % kleinere Dateien als JPEG. Zudem unterstützt es Transparenz wie PNG. Es wird von jedem modernen Browser unterstützt. Für die meisten Websites im Jahr 2026 sollte WebP Ihre erste Wahl für fast jedes Bild sein.
AVIF (die Speerspitze)
AVIF komprimiert noch besser als WebP und ist oft 50 % kleiner als JPEG. Die Browserunterstützung ist inzwischen stark, aber noch nicht universell. Daher funktioniert es am besten mit einem WebP- oder JPEG-Fallback. Verwenden Sie AVIF, wenn Sie maximale Komprimierung wünschen und Fallbacks einrichten können.
JPEG (die zuverlässige Alternative)
Nach wie vor das am universellsten unterstützte Format für Fotografien. Verwenden Sie JPEG mit 80-85 % Qualität als Fallback für Browser, die WebP nicht unterstützen, oder wenn Sie eine garantierte Kompatibilität überall benötigen.
PNG (für Grafiken und Transparenz)
Verlustfrei und ideal für Logos, Screenshots, Grafiken mit Text und alles, was Transparenz erfordert. Der Nachteil sind große Dateigrößen bei Fotos. Verwenden Sie PNG niemals für Fotos im Web, es sei denn, Sie haben einen speziellen Grund.
SVG (für Logos und Icons)
Kein Komprimierungsformat, aber erwähnenswert. SVG ist ein Vektorformat, daher bleiben Logos und Icons in jeder Größe gestochen scharf bei winzigen Dateigrößen. Verwenden Sie es für alles, was eher eine einfache Grafik als ein Foto ist.
Sind Sie bereit, die Bilder Ihrer Website sofort zu komprimieren? Verwenden Sie den kostenlosen Bildkompressor → für eine schnelle 1-Klick-Komprimierung oder probieren Sie den benutzerdefinierten Kompressor →, wenn Sie die genaue Qualitätsstufe und Ziel-Dateigröße steuern möchten. Beide laufen in Ihrem Browser, ohne dass Sie etwas auf einen Server hochladen müssen.
Der schrittweise Workflow zur Bildkomprimierung
Dies ist der Prozess, um jedes Bild für das Web vorzubereiten – von der Rohdatei bis zum optimierten Upload.
Schritt 1: Größe ändern, bevor Sie komprimieren
Dies ist der Schritt, den jeder überspringt, obwohl er der wichtigste ist. Wenn Ihr Bild 4000 Pixel breit ist, es aber auf Ihrer Website mit 800 Pixeln angezeigt wird, liefern Sie 5-mal mehr Pixel aus, als irgendjemand sehen kann. Ändern Sie die Größe des Bildes auf die maximale Größe, in der es tatsächlich angezeigt wird, und komprimieren Sie es erst dann.
Das Ändern der Größe (Resize) und das Komprimieren sind unterschiedliche Vorgänge, die zusammenwirken. Wenn Ihnen nicht klar ist, wie sich „Resize“ von „Crop“ (Zuschneiden) und „Scale“ (Skalieren) unterscheidet, finden Sie hier eine klare Aufschlüsselung, bevor Sie mit der Optimierung beginnen.
Schritt 2: Wählen Sie das richtige Format
Verwenden Sie den obigen Entscheidungsleitfaden. Fotos erhalten WebP (mit JPEG-Fallback). Grafiken und Logos erhalten PNG oder SVG. Alles, was Transparenz erfordert, erhält WebP oder PNG.
Schritt 3: Komprimieren Sie auf die richtige Qualität
Für verlustbehaftete Formate ist eine Qualität von 80-85 % der Sweet Spot. Dadurch wird der Großteil des Dateigewichts entfernt, während das Bild optisch identisch bleibt. Testen Sie es, indem Sie die komprimierte Version bei 100 % Zoom mit dem Original vergleichen. Wenn Sie keinen Unterschied erkennen können, ist die Komprimierung gut.
Schritt 4: Überprüfen Sie die Ziel-Dateigröße
Als grober Richtwert gelten folgende Maximalwerte im Web: Hauptbilder (Hero) unter 200 KB, normale Inhaltsbilder unter 100 KB, Miniaturansichten (Thumbnails) unter 30 KB. Wenn Sie darüber liegen, komprimieren Sie entweder stärker oder verringern Sie die Abmessungen weiter.
Schritt 5: Liefern Sie responsive Größen aus
Fortgeschritten, aber wirkungsvoll. Anstatt ein einziges Bild für alle Geräte zu verwenden, liefern Sie über das srcset-Attribut kleinere Versionen für Telefone und größere Versionen für Desktops aus. Ein Telefon benötigt kein 1920px großes Bild. Dies allein kann das Bildgewicht auf Mobilgeräten halbieren.
Schritt 6: Aktivieren Sie Lazy Loading
Fügen Sie Bildern, die beim ersten Laden der Seite nicht im sichtbaren Bereich liegen („below the fold“), loading="lazy" hinzu. Der Browser lädt diese Bilder erst, wenn der Benutzer nach unten scrollt. Das beschleunigt das anfängliche Laden der Seite drastisch. Es ist eine Änderung eines einzigen Attributs mit großer Wirkung.
6 Fehler bei der Bildkomprimierung, die Websites verlangsamen
1. Komprimieren, ohne vorher die Größe zu ändern
Ein 4000px großes Bild auszuliefern, das mit 800px angezeigt wird, verschwendet enorme Mengen an Bandbreite. Ändern Sie vor dem Komprimieren die Größe auf die angezeigten Abmessungen. Dies ist der größte Gewinn für die meisten Websites.
2. PNG für Fotos verwenden
Ein als PNG gespeichertes Foto kann 5-mal größer sein als dasselbe Foto im gut komprimierten JPEG- oder WebP-Format. PNG ist für Grafiken und Transparenz gedacht, nicht für Fotos.
3. Überkomprimierung zu sichtbaren Artefakten
Die JPEG-Qualität unter 70 % zu drücken, um ein paar KB zu sparen, führt zu blockartigen Artefakten und unscharfen Kanten. Die wenigen gesparten Kilobytes sind ein sichtbar verschlechtertes Bild nicht wert. Bleiben Sie bei 80-85 %.
4. Mobile Nutzer vergessen
Die Auslieferung von Desktop-Bildern an Smartphones verschwendet mobile Daten und verlangsamt die Ladezeiten der Telefone. Verwenden Sie responsive Bilder mit srcset, damit jedes Gerät eine angemessen große Datei erhält.
5. Keine Next-Gen-Formate verwenden
Wer im Jahr 2026 bei JPEG und PNG bleibt, lässt 25-50 % Einsparungen bei der Dateigröße auf der Strecke. WebP und AVIF komprimieren dramatisch besser und werden weithin unterstützt. Verwenden Sie sie mit Fallbacks.
6. Verzicht auf Lazy Loading
Wenn Sie alle Bilder einer langen Seite sofort laden, zwingen Sie den Browser, Bilder herunterzuladen, zu denen der Benutzer möglicherweise nie scrollen wird. Lazy Loading von Bildern außerhalb des sichtbaren Bereichs beschleunigt das kritische anfängliche Laden.
Tools und Automatisierung für fortlaufende Komprimierung
Manuelle Komprimierung funktioniert für eine Handvoll Bilder. Für eine echte Website mit Hunderten oder Tausenden von Bildern benötigen Sie Automatisierung.
Für einzelne Bilder
Ein browserbasierter Kompressor ist am schnellsten. Bild reinziehen, komprimieren, herunterladen. Keine Software, kein Upload auf einen Server, wenn das Tool lokal arbeitet.
Für Bilderserien (Batches)
Wenn Sie einen ganzen Ordner mit Bildern auf einmal optimieren, spart Ihnen die Stapelverarbeitung Stunden. Die gleiche Logik, die für die Komprimierung von Bildern auf Ihrem Telefon gilt, trifft auch auf die Stapelverarbeitung am Desktop zu: Sie legen Ihre Regeln einmal fest und wenden sie auf jede Datei an.
Für den laufenden Website-Betrieb
WordPress-Plugins (wie ShortPixel, Imagify oder Smush) komprimieren Bilder automatisch beim Hochladen. Image-CDNs (Cloudinary, ImageKit, Cloudflare Images) komprimieren und konvertieren in Echtzeit in WebP oder AVIF. Für eine inhaltsschwere Seite macht sich die Automatisierung schnell bezahlt.
Ein Hinweis zu Bildern für den Druck
Alles in diesem Leitfaden bezieht sich auf die Web-Komprimierung, bei der kleiner gleich besser ist. Wenn Sie stattdessen Bilder für den Druck vorbereiten, drehen sich die Regeln komplett um und Sie möchten maximale Qualität. Hier ist der separate Leitfaden zum Ändern der Größe von Fotos für den Druck, bei dem Komprimierung der Feind und nicht das Ziel ist.
Zusammenfassung
Bildkomprimierung ist die Maßnahme mit dem größten Einfluss und dem geringsten Aufwand, die Sie für die Geschwindigkeit einer Website ergreifen können. Die meisten Websites liefern Bilder aus, die 3 bis 5 Mal größer sind als nötig, sodass die Behebung dieses Problems nichts weiter als ein paar Minuten pro Bild kostet.
Ändern Sie zuerst die Größe auf die Anzeigegröße. Wählen Sie WebP für fast alles. Komprimieren Sie auf 80-85 % Qualität. Bieten Sie responsive Größen für Mobilgeräte an. Nutzen Sie Lazy Loading für Bilder außerhalb des sichtbaren Bereichs. Wenn Sie diese fünf Dinge tun, werden Ihre Seiten schneller geladen, ranken besser und konvertieren mehr.
Ihre Bilder können einen Bruchteil ihrer aktuellen Größe haben, bei einer Qualität, bei der Ihre Besucher niemals bemerken werden, dass sie reduziert wurde.