CLS (Cumulative Layout Shift)
A Core Web Vital that measures the visual stability of a page — how much content unexpectedly shifts during loading.
Full definition
CLS quantifies how much the visible content shifts position during the page lifecycle. A high CLS score means elements are jumping around as the page loads — images appearing without reserved space, ads injecting above content, or web fonts causing text to reflow. A good CLS score is under 0.1; 0.1–0.25 needs improvement; above 0.25 is poor. CLS is a user experience problem — clicking a button that shifts just before your tap can cause accidental actions. Fix high CLS by setting explicit width and height on images and video elements, avoiding inserting content above existing content, and pre-loading fonts to prevent FOUT (Flash of Unstyled Text).
Real-world example
A news site injects a banner ad after the initial render, causing the article to jump down 200px. Setting a fixed-height placeholder for the ad space reduces CLS from 0.38 to 0.03.
Related terms
Google's set of speed and UX metrics — LCP, INP, and CLS — used as ranking signals.
Read definitionA Core Web Vital that measures how long it takes for the largest visible element on a page to fully load.
Read definitionA Core Web Vital that measures a page's responsiveness to user interactions like clicks, taps, and keyboard input.
Read definitionThe portion of a webpage visible without scrolling — the most prime real estate for first impressions and key messages.
Read definitionReady to apply this to your business?
Build a custom digital marketing proposal in 60 seconds. We scope the right strategy for your market, industry, and growth goals.
Build my proposal