Why Do My Buttons Jump Around While My Website Loads? Layout Shift Explained
You've felt this even if you never had a name for it: you go to tap a button on your phone, and right as your finger lands, something else pops into place above it and you end up tapping the wrong thing. That's not clumsiness - it's cumulative layout shift, and if your audit flagged it, Google is measuring the exact same thing you just felt.
What cumulative layout shift actually is
Cumulative layout shift (CLS) is one of Google's three Core Web Vitals, alongside loading speed (LCP) and interactivity (INP) - we cover all three together in Core Web Vitals Explained. Where those two measure "how long," CLS measures "how much did the page move." Every time visible content shifts position without you doing anything to cause it - a button drops six inches, a paragraph of text jumps down a screen's worth - that movement gets scored and added to a running total for the page. A low score means what you saw first is basically what stayed put; a high score means the page kept rearranging itself under you.
Why a moving page costs you real customers
The direct cost is mis-taps: a visitor aiming for "Call Now" or "Get a Free Quote" taps a heading, a menu link, or an ad instead, because the layout shifted in the half-second between them looking and their finger landing. On mobile - where most local-business traffic comes from - that's not a rare edge case, it's the single most common way layout shift actually loses you a lead. There's a softer cost too: a page that keeps rearranging itself reads as unfinished or untrustworthy even to a visitor who couldn't explain why, the same instinct that makes a wobbly storefront sign feel like a warning sign. And because CLS is one of the three scores Google uses directly in mobile ranking, a high one can quietly cost you search position on top of the lost clicks.
The four causes we see most in audits
Images and embeds with no reserved size
An <img> tag with no width and height (or CSS aspect-ratio) tells the browser nothing about how tall it will be until the image file itself finishes downloading. Until then the browser collapses that space to zero, then snaps everything below it downward the instant the image arrives - a full-width photo appearing after the visitor's already reading the paragraph beneath it is one of the single biggest shifts an audit will find.
Ads, cookie banners, and promo bars injected after the page loads
Anything that gets added to the page programmatically - a third-party ad slot, a cookie-consent banner, an email signup bar - after the rest of the page has already rendered pushes everything below it down by exactly its own height. This is the most common cause behind the specific "I tapped the wrong thing" complaint, because it happens right when a visitor has started reading and reaching for something.
A custom web font swapping in at a different size
The browser often shows a fallback system font first, then swaps in your actual brand font once it finishes downloading - and if the two fonts aren't close enough in width, every line of text using them reflows to a new size, shifting everything below. We cover this specific failure mode, including the fix, in why your website's text disappears while it loads.
Content inserted above what a visitor is already looking at
Late-arriving search results, a "loading more" list, or a form's validation message appearing above the field instead of below it all push existing content down a screen's worth without warning. The fix isn't complicated - reserve the space in advance, or insert new content below the fold instead of above it - but it's easy to miss because it only shows up once real, variable-length content is in play, not in a quick design preview.
What doesn't count against you
Google's CLS score deliberately ignores shifts a visitor caused themselves - opening an accordion, expanding a dropdown menu, or triggering an animation with a click. Only unexpected shifts count: the ones nobody asked for and nobody could have predicted, which is exactly why they're the ones responsible for real mis-taps.
How to check your own site
Run a free PageSpeed Insights or Lighthouse report on your homepage. CLS shows up as one of the three headline Core Web Vitals scores, and Lighthouse lists the specific elements that shifted and by how much - not just a number, but which image, ad slot, or font is responsible. A passing score is under 0.1; most sites we audit that fail it are well above that, usually from one or two of the four causes above doing most of the damage.
How the free audit catches this
Layout shift is one of the checks in our free audit, run alongside the rest of your Core Web Vitals and the full website audit checklist. The report names the specific elements causing the shift, not just a generic warning that something moved.
Frequently asked questions
What is cumulative layout shift?
Cumulative layout shift (CLS) is one of Google's three Core Web Vitals - it measures how much visible content moves around after it first appears on screen. If you've ever tried to tap a button on your phone and had an ad or image pop in above it at the last second, shoving the button down so you tap something else instead, that's a layout shift. CLS adds up every unexpected shift on the page into a single score.
Why does layout shift matter for a small business website?
It causes real mis-taps and mis-clicks - a visitor aiming for your "Call Now" or "Get a Quote" button ends up tapping an ad, a menu link, or nothing at all, because the page moved between when they looked and when they tapped. It also feels unpolished even when a visitor can't say exactly why, and it's one of the three scores Google uses directly in mobile search ranking, alongside loading speed and interactivity.
What usually causes layout shift?
The four most common real-world causes: (1) images or embedded videos with no width and height reserved in the code, so the page doesn't know how tall they'll be until they finish downloading; (2) ads, cookie-consent banners, or promo bars that get injected into the page after everything else has already loaded, pushing content down; (3) a custom web font swapping in for a fallback font partway through loading, at a different size that reflows the whole paragraph; (4) content - like search results or a form's error message - inserted above what a visitor is already reading, rather than below it.
Is a layout shift caused by something the visitor does, like clicking a menu?
No - Google's CLS score specifically ignores shifts caused by a visitor's own action, like opening a dropdown menu or an accordion they clicked. It only counts unexpected shifts: ones the visitor didn't trigger and couldn't have predicted, which is exactly why they're the ones that cause mis-taps.
How do I check my own site for layout shift?
Run a free PageSpeed Insights or Lighthouse report on your homepage - CLS is reported as one of the three headline scores, alongside a list of exactly which elements shifted and by how much, so you can see the specific image or ad slot causing it rather than guessing. A passing score is under 0.1; anything above that is worth fixing.
The cheapest way to find out
Run the free audit below. We check layout shift alongside the rest of Core Web Vitals, SEO, accessibility, and security, using the same tooling Google itself uses, and email you a plain-English report the moment something's wrong. If something needs fixing, it's a flat $149 for your fixable speed/image/SEO/broken-link issue, or $299 for everything, with before-and-after proof once it's done.