Cumulative Layout Shift

Cumulative Layout Shift measures how much a page's visible content unexpectedly moves around while it loads. When elements jump, shift, or reflow after they first appear, the page feels unstable, and Cumulative Layout Shift puts a number on that instability. A low score means the layout stays put as it loads, so what a visitor sees is where things remain. A high score means content lurches around, which is the frustrating experience of reaching to tap a button only for it to slide away as an image or ad suddenly loads above it.

The mechanics work by observing elements that are already visible and detecting when they move to a new position without the user causing the change. Each unexpected shift is scored based on how much of the screen it affects and how far the content travels, and these individual shift scores are added together across the whole loading experience, which is where the "cumulative" in the name comes from. Movement that the user initiates, such as content expanding after they click, does not count, because it is expected. The metric focuses specifically on the jarring, involuntary shifts that happen while a page is still assembling itself.

The term combines "cumulative," meaning accumulating over time, with "layout shift," the movement of page elements. Google introduced Cumulative Layout Shift in 2020 as one of the three Core Web Vitals, its set of user-centered measures of page experience, and later refined how the metric is calculated to better reflect real sessions. Google has described target thresholds for a good experience, generally treating a low score as good, and it folded the Core Web Vitals into its assessment of page experience as a ranking consideration, which pushed visual stability onto the agenda of developers everywhere.

Cumulative Layout Shift matters because instability damages both usability and trust. Content that jumps can cause a visitor to click the wrong thing, such as accidentally tapping an ad or the wrong button, and it makes reading difficult when text shifts under the eye. On transactional pages a mis-tap can mean an accidental purchase or a missed one, and across any site the impression is one of a page that feels cheap and broken. Because it is one of the Core Web Vitals that inform rankings as well as a genuine experience signal, keeping the score low serves both visitors and search performance.

The common causes are well understood and largely preventable. Images and videos inserted without declared dimensions let the browser reserve no space, so surrounding content jumps when they load. Ads, embeds, and iframes that arrive late shove content down. Web fonts that swap in can reflow text, and content injected dynamically above what a visitor is already reading pushes everything downward. The fixes include specifying width and height on media, reserving space for ads and embeds, loading fonts carefully to minimize reflow, and avoiding inserting content above existing content. Cumulative Layout Shift works alongside the other Core Web Vitals, Largest Contentful Paint for loading speed and Interaction to Next Paint for responsiveness, and together they describe a page that loads quickly, responds promptly, and holds still. Getting layout stability right is often a matter of disciplined front-end habits that pay off in a calmer, more trustworthy experience.