Bengaluru and Erode, India — working with clients in other time zones

SEO Algorithms & Updates

Cumulative Layout Shift explained: why your page feels like it jumps

What CLS measures, why it matters for both ranking and user trust, and the specific, common causes worth fixing first.

Search data reviewed on a laptop

Cumulative Layout Shift measures how much a page's visible content unexpectedly moves around while it loads — the frustrating experience of trying to tap a button just as an ad loads above it and pushes everything down. It is the visual stability component of Google's Core Web Vitals.

How CLS is actually calculated

CLS sums the impact of every unexpected layout shift during a page's visit, weighted by how much of the viewport moved and how far it moved. A single large, unexpected shift, or several smaller ones adding up, both contribute to a worse score.

Google's scoring thresholds

Google considers a CLS score of 0.1 or less 'good', 0.1 to 0.25 'needs improvement', and above 0.25 'poor'.

  • Good: 0.1 or less.
  • Needs improvement: 0.1 to 0.25.
  • Poor: more than 0.25.

The most common causes

Images and video without explicit dimensions specified in the HTML, causing the browser to allocate the wrong amount of space until the file loads and its real size becomes known; ads, embeds and iframes injected dynamically without reserved space; web fonts that cause a visible text reflow when they load; and content dynamically inserted above existing content, pushing everything else down.

  • Images and video without explicit width and height attributes set in the HTML.
  • Ads and embeds injected without a reserved placeholder space.
  • Web fonts causing a layout shift when they swap in (font-display flash of unstyled text).
  • Content dynamically inserted above existing visible content.

Almost every serious CLS problem traces back to the browser not knowing how much space something will need until it is too late to reserve that space in advance.

Practical fixes

Set explicit width and height (or aspect-ratio in CSS) on every image and video element, reserve fixed-size placeholder space for ads and embeds before they load, and use font-display: optional or size-adjust techniques to minimise text reflow when web fonts load. Google's web.dev CLS guide covers the technical implementation in detail.

Frequently asked questions

Does CLS only matter for the initial page load?

No, CLS is measured across the entire page visit — a shift caused by a user scrolling into new dynamically loaded content still counts, though shifts caused directly by a user's own interaction (like clicking to expand a section) are typically excluded.

Can ads ever be CLS-friendly?

Yes, provided a fixed-size container is reserved for the ad slot before the ad itself loads, so its eventual appearance does not shift any existing content.

Is a high CLS score only an SEO problem?

No — poor CLS directly frustrates real visitors, sometimes causing accidental clicks on the wrong element, which affects conversion and trust regardless of any ranking impact.

If your site suffers from layout shift issues and you want a technical audit, reach out to our team.

The takeaway

Add explicit width and height attributes to every image and embed on your site — this single, mechanical fix resolves the most common cause of poor CLS scores.


Written by Fibvo — Bengaluru and Erode, India — working with clients in other time zones. Questions, or think we have it wrong? Tell us.

Keep reading

Related articles

Next step

Tell us what you are trying to grow.

Send the problem in a paragraph. We will reply within one working day with an honest view of whether we can help, and what it is likely to cost.

Call +91 93451 90983 WhatsApp us