Zum Inhalt springen
BeoHosting
BeoHosting

10 Min.

Wie Sie Bilder fürs Web optimieren

WebP, AVIF, Lazy Loading, CDN und srcset.

BeoHosting Team

10+ Jahre Erfahrung — Spezialisten für Webhosting und Infrastruktur

Zuletzt aktualisiert:

Bilder machen meist 60-80 % der gesamten Seitenlast aus. Ihre Optimierung ist der größte Einzelhebel für Performance. WebP und AVIF reduzieren Dateigrößen um 25-50 % gegenüber JPEG/PNG ohne sichtbaren Qualitätsverlust, Lazy Loading verschiebt nicht-sichtbare Bilder, srcset liefert die richtige Größe pro Gerät. Dieser Leitfaden behandelt jede Technik.

Wie Sie Bilder fürs Web optimieren

1

Richtiges Format wählen — WebP/AVIF

WebP: 25-35 % kleiner als JPEG, in allen modernen Browsern unterstützt. AVIF: 30-50 % kleiner als WebP, aber noch teils unsupported — mit WebP/JPEG-Fallback nutzen. PNG nur für Transparenz. SVG für Logos und Icons.

2

Vor dem Upload skalieren

Niemals ein 6000x4000-DSLR-Foto bei 800 px Darstellung hochladen. Auf tatsächliche Anzeigegröße × 2 für Retina skalieren. Mit FastStone Photo Resizer batch-skalieren.

3

Mit smarten Tools komprimieren

WordPress: ShortPixel, Imagify, Smush, EWWW. Außerhalb WordPress: TinyPNG, Squoosh. 70-85 % JPEG-Qualität — optisch identisch zu 100 % bei deutlich kleinerer Größe.

4

Lazy Loading aktivieren

Native: <img loading="lazy">. WordPress 5.5+ fügt das automatisch hinzu. Für ältere Browser Lazysizes-JS-Bibliothek. Lazy Load verzögert nicht-sichtbare Bilder — massiver Core-Web-Vitals-Boost.

5

srcset für responsive Bilder

<img srcset="img-400.jpg 400w, img-800.jpg 800w, img-1600.jpg 1600w" sizes="(max-width: 600px) 400px, 800px"> — Browser wählt die richtige Größe. WordPress erzeugt srcset automatisch.

6

Vom CDN ausliefern

Ein CDN (Cloudflare, BunnyCDN) liefert Bilder vom nächsten Server zum Besucher — Latenz minus 50-200 ms. Cloudflare Polish konvertiert on-the-fly zu WebP/AVIF. BeoHosting integriert mit QUIC.cloud CDN für LiteSpeed Cache.

Bereit, Ihre Website zu starten?

SSL-Schutz
Geschwindigkeit
24/7-Support

Schließen Sie sich 4.000+ zufriedenen Kunden an. Kostenlose Migration und 15-Tage-Geld-zurück-Garantie.

15 Tage Geld-zurück-Garantie
Kostenlose Migration15-Tage-Garantie24/7-Support

FAQ

Antworten auf die häufigsten Fragen zu unseren Diensten.

WebP wird universell unterstützt und reduziert Größe um 25-35 %. AVIF ist noch kleiner (30-50 %), fehlt aber in einigen älteren Browsern. Optimal: AVIF mit WebP-Fallback, JPEG/PNG als finaler Fallback.

Typisch: JPEG → WebP 30 %, PNG → WebP 40 %, WebP → AVIF 30 %. In Kombination mit Skalierung wird ein 2 MB DSLR-Foto zu 150-300 KB bei gleicher Optik.

Nein — Google versteht natives Lazy Loading. Achten Sie nur darauf, dass Above-the-Fold-Bilder NICHT lazy geladen werden (sie sollten sofort laden für LCP).

ShortPixel für das beste Verhältnis Kompression-zu-Qualität. Imagify dicht dahinter. Smush kostenlos und ausreichend für Basisbedarf. EWWW behält Dateien lokal ohne externe API.

Core Web Vitals sind Googles Kennzahlen für die Nutzererfahrung: LCP (Largest Contentful Paint — Ladezeit des größten Elements), CLS (Cumulative Layout Shift — visuelle Stabilität) und INP (Interaction to Next Paint — Interaktivität). Bilder wirken sich direkt auf den LCP aus, da das größte Element auf einer Seite meist ein Bild ist. Optimierte Bilder mit definierten width-/height-Attributen verbessern sowohl LCP als auch CLS.

Unsere Garantien für Ihren Seelenfrieden

Von allen Seiten geschützt

15-Tage-Garantie

Wir erstatten ohne Fragen in den ersten 15 Tagen.

Kostenlose Migration

Wir migrieren Ihre Site ohne Ausfallzeit — Sie tun nichts.

24/7-Support

Unsere Experten sind 24/7 über Tickets und Live-Chat verfügbar.