Stop the page layout from jumping while it loads on WordPress

Why it matters

Cumulative Layout Shift measures how much the content moves around as it loads, and a poor value means visitors lose their place or tap the wrong thing. It is usually caused by elements that have no reserved space.

Staged change. Do this in stages and check each one before the next, so a mistake does not break your site or your mail.

The fix

1. WordPress adds width and height to images it outputs from the Media Library. Look at the ones it does not, such as images in the theme or page builder, the site logo, and images inserted by plugins, and set dimensions there.
2. Find what pushes content down late. Typical culprits are cookie banners, newsletter bars, ad plugins, embedded videos and sliders; configure them as overlays or reserve space for them.
3. Host fonts locally and set font-display in the theme or the optimisation plugin, and avoid loading several font families. Deactivate plugins one at a time to see which one moves the layout.

Read the documentation ↗(opens in a new tab)

Related

• Reported by the Core Web Vitals check
• Make the largest element on the page load faster
• Make the largest element on the page load faster
• Stop the page layout from jumping while it loads
• Make the page respond faster to clicks and taps
• Make the page respond faster to clicks and taps
• Reduce the JavaScript that blocks the page while it loads
• Reduce the JavaScript that blocks the page while it loads
• Collect real-user speed data for your site