All resources
PerformanceOctober 20, 20268 min read

Core Web Vitals: Why Your Website Feels Slow and How to Fix It

A plain-language guide to LCP, INP, and CLS: what the thresholds mean, the usual causes on small business websites, and the fixes that move the numbers.

Speed is one of the few website qualities a visitor feels immediately. Google measures that experience with Core Web Vitals, three metrics reported from real Chrome users over a rolling 28-day window. They are not a ranking switch, but they are a tie-breaker, and they correlate strongly with bounce rate and form completion.

The three metrics, without jargon

  • LCP (Largest Contentful Paint) measures how long until the biggest visible element, usually the hero image or headline, has finished rendering. Good is under 2.5 seconds, poor is over 4 seconds.
  • INP (Interaction to Next Paint) measures the delay between a tap or click and the interface responding. Good is under 200 milliseconds, poor is over 500.
  • CLS (Cumulative Layout Shift) measures how much the page jumps around while loading. Good is under 0.1. A button that moves as you tap it is the classic failure.

INP replaced First Input Delay in March 2024, so audits that still quote FID are out of date.

The usual causes on small business sites

  • Uncompressed hero images: a 4 MB photograph from a phone camera loaded at 3000 pixels wide where 1600 would do.
  • Fonts loaded from three families with every weight, blocking text rendering.
  • A chat widget, a heatmap script, and four marketing tags loading before the page can respond to a tap.
  • Layout built with a carousel that injects content after load, pushing everything below it down.
  • Shared hosting with no server-level caching, so every visit rebuilds the page.

Fixes that produce the largest movement

  1. 01Compress and resize hero imagery, then serve WebP or AVIF with width and height attributes set so the layout reserves space.
  2. 02Lazy-load everything below the first screen; never lazy-load the LCP image.
  3. 03Self-host one or two font families, subset them, and use font-display: swap.
  4. 04Defer non-critical scripts and audit third-party tags. Remove the ones nobody reads the reports from.
  5. 05Reserve fixed dimensions for embeds, ads, and images so nothing shifts after paint.
  6. 06Enable page caching and a CDN if your audience is spread across regions.

How to measure correctly

Use PageSpeed Insights for a lab diagnosis, but trust the Search Console Core Web Vitals report for the field data that Google actually uses. Test on a mid-range Android phone over throttled mobile data, not on a desktop with fibre. A site that scores 98 on desktop and 41 on mobile is a slow site for most of its visitors.

What not to do

Do not chase a perfect score. A 90 with real content beats a 100 achieved by removing content, deferring the hero image, or hiding elements from the lab test. Google's field data will catch the difference, and so will your visitors.

If you want a starting point, open PageSpeed Insights with your own homepage in a mobile tab and look only at LCP and CLS. Those two account for most of the pain, and both are usually fixable in an afternoon of image and layout work.

Written by the team at Solutions Elites, a digital agency in Ottawa working with local businesses across Canada and the Gulf region. If you want this applied to your own site, book a free consultation.

Solutions Elites

Ready to Transform Your Digital Presence?

Join businesses across Canada and the Gulf that trust Solutions Elites to build their online success.