A practical Core Web Vitals checklist for content sites
The handful of fixes that move LCP, CLS and INP the most — in priority order, with the trade-offs spelled out, so you spend effort where it actually changes the score.
To improve Core Web Vitals: fix LCP by right-sizing the hero image, preloading it and deferring render-blocking resources; fix CLS by reserving space for all media and late-injected elements; fix INP by shipping less JavaScript and eliminating long main-thread tasks. Most sites fail on the same small set of predictable issues.
- LCP is almost always the hero image — right-size it, serve WebP/AVIF, and preload it explicitly.
- CLS: set width and height on every image and embed; give cookie bars and ads reserved space.
- INP: ship less JS, break up long tasks, audit every third-party script — they are usually the culprit.
- Use Search Console CWV report (field data) to find real failures; use Lighthouse only to diagnose.
- A hand-coded site avoids most of these problems at build time by never shipping the bloat that causes them.
Core Web Vitals reward three things: a page that paints its main content fast (LCP), doesn’t jump around as it loads (CLS), and responds quickly when you interact (INP). Most sites fail on a small, predictable set of issues. Fix these in order and the score usually follows.
Largest Contentful Paint
- Right-size the hero image. Serve modern formats, exact dimensions and a sensible quality. The hero is almost always the LCP element.
- Preload what matters. Preload the LCP image and the fonts used above the fold so the browser fetches them first.
- Cut render-blocking work. Defer non-critical CSS and JS so the main content isn’t waiting behind it.
Cumulative Layout Shift
- Reserve space for media. Always set width and height (or aspect-ratio) on images and embeds so nothing reflows when they load.
- Avoid late-injected banners. Cookie bars and ads that push content down are classic CLS offenders — give them reserved space.
- Use font-display: swap. And match the fallback metrics so the swap doesn’t nudge the layout.
Interaction to Next Paint
INP punishes heavy main-thread work. The biggest wins are shipping less JavaScript and breaking up long tasks. On a content site the culprit is almost always a third-party script — a builder, a chat widget, an analytics stack — doing far more than it needs to.
Most Core Web Vitals problems are really one problem wearing three hats: the page is doing too much work to show too little content.
Measure, don’t guess
Field data beats lab data. Watch the Core Web Vitals report in Search Console for real-user numbers, and use Lighthouse only to diagnose. Chase the metric that’s actually failing for real visitors, not the one that’s easiest to improve in a test.
On a hand-coded site most of this is handled at build time, because we never ship the bloat that causes it in the first place. On an existing site, this checklist is usually a day or two of focused work for a large, lasting gain.
Quick answers
The hero image is not preloaded and is served at too high a resolution or in a non-optimised format (JPEG instead of WebP/AVIF). Adding a preload hint for the LCP image and serving it at the exact rendered size in a modern format typically cuts LCP by 40–60%.
Set explicit width and height attributes (or aspect-ratio in CSS) on every image and video embed. Give cookie consent bars and any injected banners a reserved block of space. Use font-display: swap with matching fallback metrics. These three changes eliminate most CLS on content sites.
Yes — they are a confirmed ranking signal in Google’s Page Experience update. Passing all three CWV thresholds (LCP < 2.5 s, INP < 200 ms, CLS < 0.1) is also required to be eligible for Google’s Top Stories carousel on mobile.
Use Search Console for your baseline — it shows real-user field data from Chrome users. Use Lighthouse and PageSpeed Insights for diagnosis once you know which metric is failing. Lab scores can differ significantly from field scores; always fix the metric that real visitors are actually experiencing.
Liked the article?
Join our Telegram — practical notes on WordPress, performance and getting found by AI search. No fluff.
Subscribe on TelegramHave a project in mind?
Send a short brief — free fixed quote within a few business hours.