metric

Cumulative Layout Shift

The extent to which visible content moves unexpectedly during load, which correlates with mis-taps and is almost entirely preventable by reserving space.

Of the three principal field metrics, layout shift is the one with the clearest causes and the cheapest fixes. Content moves because something arrived that had no space reserved: an image without dimensions, a web font swapping in at different metrics, an advertisement or consent banner inserted above existing content, or a personalised region filled after first paint.

The user consequence is concrete. Someone reaches for a link, the layout shifts, and they tap something else — frequently something with a consequence, since the elements that arrive late are often the ones that matter.

The fixes are mechanical: width and height on every image so the box is reserved before the bytes arrive; explicit reserved space for any region filled asynchronously; font loading configured so the fallback and the web font have similar metrics; and anything injected placed below the fold or into pre-allocated space.

The measurement caveat that matters: it must come from field data. A laboratory run on a fast connection frequently misses shifts that only occur when a resource is slow, which is the case the metric exists to capture.