Skip to content
weballin

weballin DIGIWIKI

Cumulative Layout Shift

Cumulative Layout Shift (CLS) is a Core Web Vitals metric for unexpected layout shifts. It helps identify problems such as text and buttons moving when images or advertisements appear late.

weballin

When an element moves while someone is reading or clicking, the person may lose their place or select the wrong control. Unsized images and ads, dynamically inserted content, and font changes can cause shifts.

Specify image and video dimensions or aspect ratios and reserve space for ads and embeds. Choose a font-loading strategy after checking fallback font metrics and the rendered result.

Lab tests and real-user data reflect different conditions. Check for shifts during scrolling and interaction as well as initial loading. Reporting a specific improvement requires actual measurements taken under comparable conditions.

References

Frequently asked questions

What should I check first?

Distinguish the element that moved from the element that caused the movement. Start with reserved space for images, ads, and embeds, and the placement of dynamically inserted content.