Bilder fürs Web komprimieren (ohne wahrnehmbaren Qualitätsverlust)

Aktualisiert 2025-09-01 17 Wörter • 1 min Lesezeit

Praktischer Leitfaden zur Reduzierung der Dateigröße von JPG, PNG und WebP bei Erhalt der wahrgenommenen Schärfe und Verbesserung der Core Web Vitals.

1. Warum komprimieren?

Bilddaten machen oft den größten Anteil der Seitengröße und des LCP aus. Weniger Bytes bedeuten schnellere Ladezeiten, bessere UX und SEO.

2. Empfohlene Formate

  • WebP: Sehr gutes Verhältnis zwischen Qualität und Größe.
  • JPEG: Für komplexe Fotos (Qualität 75–85).
  • PNG: Nur bei echter Transparenz / verlustfrei nötig.

3. Ablauf

  1. Auf benötigte Maximalbreite skalieren.
  2. Gegebenenfalls nach WebP konvertieren.
  3. Qualität iterativ reduzieren und Artefakte prüfen.

4. Praxiswerte Qualität

TypQualitätHinweis
Fotos80Balance
Illustrationen75Verläufe prüfen
Icons / UIWebP @ 70Meist ausreichend

5. Sichtbare Verluste vermeiden

  • Side-by-Side Vergleich.
  • Auf Blockartefakte und Banding achten.
  • Qualität +5% falls Artefakte sichtbar.

6. Orqui Workflow

  1. Skalieren
  2. Konvertieren
  3. Optimieren

7. Checkliste

  • < 250KB Hero / 100KB Inline.
  • Keine überflüssigen Pixel.
  • Modernes Format verfügbar.
  • Keine wahrnehmbaren Artefakte.

Verwandte Tools

Andere Sprachen

FAQ

  • Warum Bilder komprimieren?
    Weniger Bytes verbessern LCP, Ladegeschwindigkeit, SEO und Conversion.
  • Welche Qualität wählen?
    Beginne bei 80 für Fotos, 75 für Illustrationen und passe an falls Artefakte sichtbar werden.

Zähler deiner lokalen Transformationen hier (konvertieren, optimieren, skalieren, zuschneiden, Hintergrund entfernen). Alles passiert privat im Browser.