Die tatsächliche Darstellung prüfen
Ein Foto direkt aus der Kamera enthält häufig mehr Bildpunkte, als die Website benötigt. Prüfe zunächst die dargestellte Größe. Erzeuge passende Varianten und vergleiche die Qualität auch auf hochauflösenden Displays. Ein großes Startbild verdient mehr Aufmerksamkeit als ein kleines Vorschaubild. Bilder sind allerdings nicht die einzige mögliche Ursache langsamer Seiten.
Format und Motiv zusammen betrachten
Beispiel: Eine Schreinerei zeigt ein Referenzmöbel. Vergleiche ein komprimiertes JPEG mit WebP oder AVIF bei ähnlicher Qualität. Holzmaserung und Kanten sollten erhalten bleiben. Ein Firmenlogo mit klaren Pfaden eignet sich dagegen für SVG. PNG kann bei verlustfreien Rastergrafiken sinnvoll sein. Das kleinste Format hängt vom Motiv und den Einstellungen ab.
Bilder verständlich ausliefern
Responsive Bildvarianten helfen dem Browser, eine passende Datei auszuwählen. Inhaltlich wichtige Bilder brauchen einen sinnvollen Alternativtext; dekorative Bilder erhalten ein leeres Alt-Attribut. Beschreibe relevante Informationen statt Suchbegriffe aufzuzählen. Lade das wichtigste Startbild nicht unnötig verzögert, während weiter unten liegende Bilder später geladen werden können.
Dein nächster Schritt
- Prüfe Größe und Darstellung wichtiger Bilder.
- Vergleiche komprimierte Varianten desselben Motivs.
- Kontrolliere Alternativtexte und mobile Darstellung.
Einordnung & Quellen
Praxisleitfaden: Die beschriebenen Schritte sind redaktionelle Empfehlungen. Welche Lösung passt, hängt von Angebot, Zielgruppe und technischer Umsetzung ab.
