Verbindung fehlgeschlagen. Bitte versuchen Sie es erneut.

Zum Inhalt springen
SEO Tools
Hilfe und Dokumentation
Geschwindigkeit Mittlere Auswirkung Einfach 5–15 Min.

Bildabmessungen (width/height)

Ohne Bildabmessungen springt das Layout (CLS).

Was es ist

Wenn ein <img> kein width und height angegeben hat, weiß der Browser bis zum Laden nicht, wie viel Platz das Bild einnimmt — und nach dessen Eintreffen „springt“ der Inhalt. Das misst die Metrik CLS (Cumulative Layout Shift).

Warum es wichtig ist

Springendes Layout ist frustrierend (der Nutzer klickt auf etwas anderes als gewollt) und Google bestraft es über CLS in den Core Web Vitals.

So geht's

  1. 1Gib width und height bei allen <img> an (der Browser berechnet daraus das Seitenverhältnis).
  2. 2Reserviere den Platz alternativ über aspect-ratio in CSS.
  3. 3Dasselbe gilt für Embeds und Werbung — reserviere ihnen Platz.

Beispiel

Falsch
<img src="foto.webp" alt="...">
Richtig
<img src="foto.webp" alt="..." width="800" height="600">

Fazit

Bildabmessungen zu ergänzen ist eine Fünf-Minuten-Sache mit direkter Wirkung auf CLS — eine der Core Web Vitals. Kombiniere sie mit Lazy Loading und modernen Formaten. Reserviere auch Embeds und Werbung Platz, damit nichts springt.

Verwandte Themen