Skip to content

This translation has not been editorially reviewed yet. The German version is authoritative. Deutsche Fassung →

Performance

What is CLS, and why does content jump around while a website loads?

CLS (Cumulative Layout Shift) measures how much a page's content jumps around while loading — Google rates a value up to 0.1 as good, above 0.25 as poor. Everyone knows the effect: you're about to tap a link, and at the last moment a late-loading image pushes everything down, so your finger lands on the ad next to it instead. CLS is exactly these jumps, added up.

Layout jumps cost trust and lead to mis-clicks

A jump happens when an element only claims its space after the page has already been rendered: an image loads with no reserved area, an ad banner pushes itself between heading and text, a font that loads late changes the line height. To visitors, it feels like the page has a loose connection. The practical consequence is mis-clicks: a finger aims for "Cancel" and hits "Buy" instead, because the buttons shifted at the last moment. CLS adds up all these shifts across the page build into a single number — the larger the shifted area and the further the jump, the higher the value.

The Google thresholds: 0.1 good, 0.25 and above poor

Unlike the time-based metrics, CLS has no unit — it's a ratio of shifted area and jump distance. Up to 0.1 it counts as good, up to 0.25 as needs improvement, above that as poor. A page whose content doesn't jump at all scores 0. The audit service adopts these official Google thresholds unchanged and measures mobile and desktop separately, because the same jump has a bigger impact on a narrow phone screen: what's a small shift on desktop pushes away half the visible area on a phone.

How the audit service measures layout stability

The audit service retrieves Google's PageSpeed measurement for every page checked. It supplies CLS from two sources: field data from real visitors over the last 28 days, if the page has enough views, and a lab measurement under fixed conditions. Where field data is available, it takes priority — it shows what actually happens to real visitors, slow connections and older devices included. Every value above the threshold appears as a finding in the report, with the measured value, the source of the measurement, and the target value of 0.1 alongside it, so your agency can make targeted fixes.

  • Load your homepage on a mobile phone and watch the first few seconds: does the text slide down as soon as images or banners appear?
  • Ask your agency to set fixed width and height values for every image and video, so the space is reserved from the start.
  • Give ad spaces and embeds a fixed frame that stays in place even if the content arrives late or not at all.
  • Require notice banners — for cookies or promotions, say — to float above the page or be planned in from the start, instead of pushing the content down.
  • Recheck CLS after every redesign of the homepage, since even a single new banner can turn a good value into a poor one.

FAQ

What does CLS mean for a website?

CLS stands for Cumulative Layout Shift, the added-up shifting of the page layout. The value captures how much visible content changes position while loading — when a late-loading image pushes text downward, for instance. The larger the shifted area and the further the jump, the higher the number. A completely stable page scores 0.

What CLS value is good?

Google rates a CLS up to 0.1 as good, up to 0.25 as needs improvement, and above that as poor. The value has no unit — it's a ratio of the area and jump distance of the shifts. The audit service checks against exactly these official thresholds and states the measured value along with the source of the measurement in the finding.

What causes layout shifts while loading?

The most common causes: images and videos with no stored size information, ad banners and embeds with no reserved space, notice bars inserted afterward, and fonts that change the line height after loading. What they all have in common is that an element only claims its space once the page is already visible — pushing everything below it out of the way.

Why are layout jumps worse on mobile?

On a narrow phone screen, the same element takes up a much larger share of the visible area. A banner that's barely noticeable on desktop pushes half the screen down on a phone. Visitors also tap there with a finger instead of a mouse pointer — mis-clicks on shifted buttons happen more easily. That's why the audit service measures both device types separately.

Deutsche Fassung dieser Seite