CLS quantifies how much your page content shifts around unexpectedly after it starts rendering. You've experienced it: you're about to tap a button, an image loads above it, everything shifts down, and you tap the wrong thing. CLS puts a number on that frustration. Google considers a CLS score under 0.1 "good," 0.1-0.25 "needs improvement," and above 0.25 "poor."
For landing pages, CLS is conversion poison. Every unexpected shift erodes trust and creates a subliminal feeling that the page is broken or untrustworthy. I've watched session recordings where visitors click a CTA, the page shifts, they accidentally click a different link, get sent somewhere unexpected, and never come back. That's a real conversion lost to a preventable layout issue.
The usual culprits
Images and ads without explicit dimensions are the top offenders. When the browser doesn't know an image's size upfront, it renders text first, then shoves everything down when the image loads. Fix: always set width and height attributes on images. Web fonts loading and swapping with system fonts cause text reflow — use font-display: optional or size-adjust to minimize this.
Dynamic content injected after load — cookie banners, chat widgets, promotional bars — is the third major cause. If you're inserting a 60px banner at the top of the page after load, everything below shifts. Reserve the space in your layout or load these elements before first render.