Stop Your Page From Shifting While It Loads
Google considers Cumulative Layout Shift (CLS) good at 0.1 or less and poor above 0.25 (Google web.dev). CLS measures how much visible content moves around unexpectedly while a page loads. You go to tap a link, a banner appears above it, the text jumps, and you tap something else.
What the research observed
CLS is one of Google’s Core Web Vitals. Like the other vitals, it is assessed at the 75th percentile of page loads, with mobile and desktop measured separately (Google web.dev). Scores between 0.1 and 0.25 need improvement.
Shifts happen when the browser lays out the page before it knows how much space an element needs. Late-loading banners, ads, cookie bars, and embeds that push content down are typical causes, along with images that load without space reserved for them (Google web.dev). When those elements arrive, everything below them moves.
What it means for a business website
Layout shift is more than a score. It causes mis-taps. A visitor trying to tap your phone number may hit the wrong link because a cookie bar pushed the page down at the moment they tapped. On a phone, where links and buttons sit close together, a small shift is enough to land a tap on the wrong one.
Small business sites add third-party pieces over time: a chat widget, a review feed, a map embed, a notice bar. Each is a possible source of shift if it loads late and has no space set aside for it.
What to do
- Set width and height on every image so the browser reserves its space before it loads.
- Give embeds, ad slots, and notice banners a fixed-height container in the layout.
- Show cookie bars as an overlay at the bottom of the screen rather than inserting them above content.
- Load your pages on a phone with a slow connection and watch for anything that jumps.
Sources
- Cumulative Layout Shift (CLS). Google (web.dev).
- Web Vitals. Google (web.dev).