Cumulative Layout Shift (CLS)

Cumulative Layout Shift (CLS) is a Core Web Vital — one of Google's page-experience metrics — that measures how much a page's content unexpectedly shifts position while it loads. It quantifies visual stability: the frustrating experience of text, buttons, or images jumping around as the page renders (an ad pushes the article down, a button moves just as you tap it). A low CLS means a stable page; a high CLS means a janky, shifting one. The 'good' threshold is a CLS score of 0.1 or below.

CLS is calculated from the unexpected movement of visible elements during loading, combining how much of the screen shifted with how far it moved, accumulated across the page's lifecycle. The common causes are predictable: images and videos without dimensions specified (so the browser does not reserve space and content reflows when they load), ads, embeds, and iframes that load late and push content around, web fonts that swap and re-lay-out text, and content injected dynamically above existing content. Each makes the page reflow after the user has started reading or acting, which is not just annoying but can cause real errors — tapping the wrong button because it moved at the last moment. The fixes map to the causes: always specify size attributes or reserve space for images, ads, and embeds; load fonts in ways that avoid layout-shifting swaps; and avoid inserting content above what the user is already viewing. CLS matters beyond UX because Core Web Vitals are a Google ranking signal (part of the page-experience signals): a poor CLS hurts both user experience and, at the margin, search performance, and it sits alongside the other Core Web Vitals (loading and interactivity metrics) as a measurable, improvable aspect of technical quality.

CLS matters for any website that cares about user experience and search, and especially for content and commerce sites where shifting layouts cause misclicks and frustration. The discipline is to measure CLS (via tools like PageSpeed Insights, Lighthouse, and field data in Search Console), to fix the specific causes — unsized media, late-loading ads and embeds, font swaps, injected content — and to keep it at or below the 0.1 'good' threshold. It is a concrete, fixable metric: addressing layout shift improves the experience directly and supports the page-experience signals search engines reward, making it one of the more actionable technical-quality improvements available.

Cumulative Layout Shift was introduced by Google in 2020 as one of the Core Web Vitals — a set of user-centric page-experience metrics (alongside loading and interactivity measures) — and became part of Google's ranking signals with the Page Experience update rolled out in 2021. It quantifies the long-recognized problem of pages that jump around while loading.

Etymology: source.

Search interest for this term over the last five years:

View interest-over-time on Google Trends →

Areas of marketing where cumulative layout shift (cls) is a core concern: