CLS (Cumulative Layout Shift)
CLS measures how much page content unexpectedly shifts during loading - for example, a button you wanted to click suddenly moves lower down.
It is one of the Core Web Vitals metrics. Typical causes include an image or ad without reserved space, a font that loads later and changes text dimensions, or a dynamically inserted banner above the content. Google recommends a CLS below 0.1 - anything above that threshold is a visually noticeable "jump."
It pays to plan for CLS in advance rather than fix it afterward: images with explicit `width`/`height`, fonts with `font-display: swap` and space reserved beforehand, and animations limited to `transform`/`opacity` rather than properties that change layout. This entire website follows exactly that principle - no animation shifts the surrounding content.
For online stores, CLS has a direct impact on revenue: a shifted "Buy" button at the moment of a click means clicking elsewhere by mistake or losing trust that the website works reliably.
Related service
B2B website redesign →