Wymiary obrazów (width/height)

Gdy <img> nie ma podanych width i height, przeglądarka do czasu wczytania nie wie, ile miejsca zajmie obraz, a po jego nadejściu treść „podskakuje”. Mierzy to metryka CLS (Cumulative Layout Shift).

Skakanie układu jest frustrujące (użytkownik klika w coś innego, niż chciał), a Google penalizuje je przez CLS w Core Web Vitals.

1. 1Podawaj width i height przy wszystkich <img> (przeglądarka wyliczy z nich proporcje).
2. 2Ewentualnie zarezerwuj miejsce przez aspect-ratio w CSS.
3. 3To samo dotyczy osadzeń i reklam, zarezerwuj im przestrzeń.