CLS (Cumulative Layout Shift)
CLS měří, kolik se obsah stránky neočekávaně posune během načítání - třeba tlačítko, na které jste chtěli kliknout, a najednou je o kus níž.
Je to jedna z metrik Core Web Vitals. Typická příčina: obrázek nebo reklama bez rezervovaného místa, font, který se načte později a změní rozměry textu, nebo dynamicky vložený banner nad obsahem. Google doporučuje CLS pod 0,1 - cokoliv nad tuhle hranici je vizuálně znatelný "skok".
Na CLS se vyplatí myslet dopředu, ne ho opravovat zpětně: obrázky s explicitní `width`/`height`, fonty s `font-display: swap` a předem vyhrazeným prostorem, animace omezené na `transform`/`opacity` místo vlastností, které mění layout. Přesně tenhle princip drží celý tenhle web - žádná animace, která by posouvala okolní obsah.
Pro e-shopy má CLS přímý dopad na tržby: posunuté tlačítko "Koupit" ve chvíli kliknutí znamená omylem kliknuté jinam, nebo ztracenou důvěru v to, že web funguje spolehlivě.
Související služba
Redesign webu pro B2B →