Cumulative Layout Shift (CLS) is too high — the fix
The Cumulative Layout Shift — how much visible content unexpectedly moves while the page loads — exceeds Google's threshold. Good is 0.1 or under; over 0.25 is poor.
Where this fits: performance in SEO
Performance is both a ranking signal (Core Web Vitals) and a conversion multiplier. Google measures real-user loading (LCP), interactivity (INP), and visual stability (CLS) — and slow sites lose visitors before analytics even registers them. Most performance issues concentrate in a few repeat offenders: unoptimised images, render-blocking resources, and third-party scripts. Fixing the top three usually moves the needle more than fixing the next thirty.
Why cumulative layout shift (cls) is too high hurts your rankings
CLS is one of the three Core Web Vitals and a Google ranking signal. Content that jumps as images, ads, or fonts load causes mis-taps (e.g. hitting the wrong button) and a jarring experience. Google demotes pages that shift unexpectedly.
This is a high-severity issue: it directly suppresses rankings or click-through on the pages it affects. It belongs in your current sprint, prioritised by how many pages carry it.
How to fix it
Reserve space for anything that loads asynchronously: set explicit width/height or CSS aspect-ratio on images, iframes, and ad slots; never insert content above existing content once the page is visible; and preload web fonts while using font-display: optional or swap to avoid late reflow.
<!-- Reserve the image box so later loading causes no shift -->
<img src="photo.jpg" alt="…" width="1200" height="675" style="max-width:100%;height:auto" />Performance best practices
- Serve images in modern formats (WebP/AVIF), sized to their container, with explicit dimensions.
- Inline critical CSS and defer everything else; eliminate render-blocking third parties.
- Set far-future cache headers on static assets and an ETag on everything.
- Preload the fonts and hero image; font-display: swap to avoid invisible text.
- Measure with real-user Core Web Vitals, not just lab scores — Google ranks on field data.
The full library: SEO best practices, by category.
Frequently asked questions
What does "Cumulative Layout Shift (CLS) is too high" mean?
The Cumulative Layout Shift — how much visible content unexpectedly moves while the page loads — exceeds Google's threshold. Good is 0.1 or under; over 0.25 is poor.
Why does cumulative layout shift (cls) is too high matter for SEO?
CLS is one of the three Core Web Vitals and a Google ranking signal. Content that jumps as images, ads, or fonts load causes mis-taps (e.g. hitting the wrong button) and a jarring experience. Google demotes pages that shift unexpectedly.
How do I fix cumulative layout shift (cls) is too high?
Reserve space for anything that loads asynchronously: set explicit width/height or CSS aspect-ratio on images, iframes, and ad slots; never insert content above existing content once the page is visible; and preload web fonts while using font-display: optional or swap to avoid late reflow.
How serious is this issue?
This is a high-severity issue: it directly suppresses rankings or click-through on the pages it affects. It belongs in your current sprint, prioritised by how many pages carry it. It belongs to the performance family of checks.
How do I find every page affected by this on my site?
Run a free Dr Urls audit: it crawls your site, detects cumulative layout shift (cls) is too high on every affected page, shows example URLs, and generates a ready-to-use fix task. Re-scan after fixing to verify the issue is gone.
Does your site have this issue?
A free Dr Urls audit crawls your site, finds every page affected by cumulative layout shift (cls) is too high, and hands you a ready-made fix task.
Check my site free