Start About Referenzen Blog Services Kontakt →
← Zurück zur Startseite
Marketing

Bilder für die Website optimieren: WebP, Größe und Ladezeit richtig einstellen

10. September 2026
M2K Redaktion

Ein Blick in die PageSpeed-Insights-Analyse zeigt bei den meisten Websites dasselbe Bild: ein Hero-Foto mit 3.000 mal 2.000 Pixeln und über 4 Megabyte Dateigröße, ausgeliefert an einen Bildschirmbereich, der auf dem Smartphone gerade einmal 400 bis 800 Pixel breit ist. Genau das ist in den meisten Fällen der Grund, warum eine WordPress-Website beim Laden hakt – nicht das Theme, nicht der Hoster, sondern unkomprimierte, überdimensionierte Bilder.

WordPress selbst erzwingt keine Bildoptimierung. Wer im Media-Uploader ein Foto direkt von der Kamera oder dem Smartphone hochlädt, bekommt genau diese Datei ausgeliefert, wenn Theme und Einstellungen nicht gegensteuern. Auf den meisten Websites ist ausgerechnet das größte Element im sichtbaren Bereich – Largest Contentful Paint, kurz LCP – ein Bild. Und ein unoptimiertes Hero-Bild ist damit der mit Abstand häufigste Grund, warum dieser Core-Web-Vitals-Wert schlecht ausfällt.

Warum Bilder meistens der größte Ladezeit-Faktor sind

Google bewertet mit den Core Web Vitals drei Aspekte: wie schnell der größte sichtbare Inhalt lädt (LCP), wie schnell die Seite auf Eingaben reagiert (INP) und wie stabil das Layout beim Laden bleibt (CLS). Alle drei Werte fließen indirekt ins Ranking ein und beeinflussen ganz direkt, ob Besucher bleiben oder abspringen. Bilder wirken sich auf alle drei aus: auf LCP durch ihre Dateigröße, auf CLS, wenn kein Platz für sie reserviert wird und die Seite beim Nachladen springt, und auf INP indirekt, wenn der Browser durch das Dekodieren großer Bilder blockiert ist.

Ein praktisches Beispiel aus der Optimierungspraxis: Eine Landingpage mit unkomprimierten Bildern kam auf 6,8 Megabyte Ladevolumen und einen mobilen PageSpeed-Wert von 38. Nach Umstellung auf moderne Formate und Lazy Loading sank das Ladevolumen auf 0,9 Megabyte, der Score stieg auf 94, die LCP-Zeit fiel von 5,2 auf 1,4 Sekunden. Das ist keine Ausnahme, sondern der typische Hebel, den Bildoptimierung auf WordPress-Websites hat.

Welches Bildformat du 2026 verwenden solltest

JPEG ist als Standardformat für Fotos technisch überholt. WebP komprimiert bei vergleichbarer Qualität deutlich stärker und wird seit WordPress 5.8 nativ unterstützt – die Software kann WebP-Dateien hochladen und teils automatisch aus JPEGs erzeugen. AVIF komprimiert noch einmal spürbar besser als WebP, wird aber noch nicht von jedem Tool und Plugin vollständig unterstützt. Für die Praxis heißt das:

  • WebP ist 2026 der solide Standard für die meisten Websites – breite Browserunterstützung, gute Kompression, unkomplizierte Umsetzung über Plugins oder Hosting.
  • AVIF ist die nächste Stufe für Websites mit vielen großformatigen Bildern, bei denen jedes eingesparte Kilobyte zählt – etwa Foto- oder Portfolio-Seiten.
  • PNG bleibt sinnvoll für Grafiken mit Transparenz oder scharfen Kanten (Logos, Icons), nicht für Fotos.

Ein reales Beispiel aus der Praxis: Ein 1,2 Megabyte großes Hero-Bild, als WebP über ein CDN ausgeliefert, schrumpfte auf rund 150 Kilobyte – die LCP-Zeit sank dadurch von 3,5 auf 1,8 Sekunden. Allein die Formatumstellung, ohne sonstige Änderungen.

Die richtige Bildgröße ist wichtiger als reine Kompression

Ein häufiger Denkfehler: Kompression allein reicht. Tatsächlich ist die Pixelgröße oft der größere Hebel. Ein Bild, das auf dem Bildschirm 800 Pixel breit angezeigt wird, aber mit 3.000 Pixeln Breite ausgeliefert wird, verschwendet Bandbreite – unabhängig davon, wie stark es komprimiert ist. WordPress erstellt zwar automatisch verschiedene Bildgrößen (Thumbnail, Medium, Large) und liefert über das srcset-Attribut passende Varianten für unterschiedliche Bildschirmgrößen aus, aber das funktioniert nur zuverlässig, wenn:

  • im Theme oder Page-Builder tatsächlich die richtige Bildgröße eingebunden wird und nicht generell „Full Size“,
  • die Originaldatei selbst nicht schon unnötig groß hochgeladen wurde (eine Kamera liefert oft 4.000+ Pixel Breite, für die Website reichen meist 1.600 bis 2.000 Pixel an der breitesten Stelle),
  • Container-Breiten im Layout bekannt sind, damit Bilder nicht größer eingebunden werden als sie je angezeigt werden.

Lazy Loading richtig einsetzen – und wann nicht

Seit WordPress 5.5 lädt die Software Bilder standardmäßig verzögert (Lazy Loading): Bilder, die erst beim Scrollen sichtbar werden, laden auch erst dann. Das spart bei langen Seiten viel Ladevolumen. Ein verbreiteter Fehler ist aber, dieses Verhalten unverändert auf das Hero-Bild oder andere Elemente im ersten sichtbaren Bereich anzuwenden. Genau das verlangsamt den LCP-Wert zusätzlich, weil der Browser erst beim Scrollen erkennt, dass das Bild überhaupt gebraucht wird. Für das größte Bild oberhalb des Seitenfalzes gilt die umgekehrte Regel: kein Lazy Loading, stattdessen fetchpriority="high", damit der Browser es sofort und bevorzugt lädt.

Plugins und Tools, die die Arbeit abnehmen

Bildoptimierung muss nicht manuell passieren. Etablierte WordPress-Plugins wie ShortPixel, Smush oder Imagify komprimieren Bilder automatisch beim Hochladen, erzeugen WebP-Varianten und passen teils auch die Auslieferung über srcset an. Ergänzend lohnt sich ein CDN, das Bilder zusätzlich in Bildschirmgröße und modernem Format an den jeweiligen Besucher ausliefert, ohne dass am WordPress-Backend etwas verändert werden muss.

So prüfst du, ob Bilder bei dir das Problem sind

  1. PageSpeed Insights oder die Chrome-DevTools (Lighthouse-Tab) für die eigene Startseite und eine typische Unterseite laufen lassen.
  2. Im Bericht prüfen, welches Element als LCP identifiziert wird – ist es ein Bild, ist die Ursache meist gefunden.
  3. Im Network-Tab der DevTools nach Dateigröße sortieren: Alles über 300–500 Kilobyte pro Bild ist in der Regel ein Kandidat für Optimierung.
  4. Prüfen, ob das Hero-Bild als WebP oder AVIF ausgeliefert wird oder noch als JPEG/PNG.

Bildoptimierung ist einer der Hebel mit dem besten Verhältnis aus Aufwand und Wirkung – oft lässt sich die gefühlte Ladezeit einer Website spürbar verbessern, ohne Hosting oder Theme zu wechseln. Wenn die Analyse aber zeigt, dass auch nach der Bildoptimierung noch andere Ursachen bremsen, lohnt sich ein Blick auf die häufigsten Ursachen für langsame WordPress-Websites – oder, falls der Verdacht eher in Richtung Plugin-Überladung geht, auf die Frage, wie viele WordPress-Plugins wirklich zu viele sind.

Wenn die eigene Website grundsätzlich technisch überarbeitet werden soll, nicht nur an einzelnen Stellschrauben, unterstützt M2K bei Konzeption und Umsetzung von WordPress-Websites – inklusive der technischen Basis, auf der Content und Design überhaupt performant ausgeliefert werden können.

Bereit, dein nächstes Projekt groß zu machen?
Lass uns gemeinsam dein Kreativsystem aufbauen – von Strategie bis Umsetzung, alles aus einer Hand.
Jetzt Projekt starten →