Cumulative Layout Shift (CLS)
A Core Web Vital that measures the total amount of unexpected layout shifts that occur during a page's entire lifespan. Good CLS is 0.1 or less, where layout shifts are calculated from the impact and distance of moving elements.
CLS quantifies the visual instability users experience when page elements move unexpectedly. This includes images loading without reserved space pushing content down, ads injecting above existing content, or dynamically loaded fonts causing text reflow. Each unexpected shift is scored based on how much of the viewport was affected and how far elements moved.
For product teams, CLS directly impacts user trust and conversion. Users who click a button only to have the page shift and accidentally click something else have a terrible experience. Fix CLS by always specifying width and height attributes on images and videos, reserving space for ads and embeds with CSS aspect-ratio or min-height, preloading web fonts with font-display: optional or swap, and avoiding dynamic content insertion above existing content. For Next.js applications, the Image component handles dimension reservation automatically. Monitor CLS in the field through Chrome UX Report data, as lab-based testing often misses layout shifts caused by third-party scripts or slow-loading ads.
Related Terms
Core Web Vitals
A set of three Google-defined metrics that measure real-world user experience for loading performance, interactivity, and visual stability. Core Web Vitals are a confirmed ranking factor in Google Search.
Largest Contentful Paint (LCP)
A Core Web Vital that measures the time from page load start until the largest visible content element (image, video, or text block) is rendered on screen. Good LCP is 2.5 seconds or less.
Interaction to Next Paint (INP)
A Core Web Vital that measures the latency of all user interactions (clicks, taps, keyboard input) throughout the page lifecycle, reporting the worst interaction. Good INP is 200 milliseconds or less.
Time to First Byte (TTFB)
The duration from the user's request to the first byte of the server response reaching the browser. TTFB measures server-side processing speed and network latency, directly impacting all subsequent loading metrics.
Crawl Budget
The number of pages a search engine bot will crawl on your site within a given timeframe, determined by crawl rate limit and crawl demand. Crawl budget optimization ensures important pages are discovered and indexed efficiently.
Canonical URL
An HTML element that tells search engines which version of a page is the preferred one when multiple URLs serve similar or identical content. Canonical tags consolidate ranking signals and prevent duplicate content issues.