Guide · 9 min · Updated 20/05/2026

How to fix Core Web Vitals in 2026

LCP, INP, CLS — what each metric actually measures and the three engineering moves that fix 80% of failures.

LCP — Largest Contentful Paint

LCP measures when the largest above-the-fold element renders. The fixes: preconnect to the CDN hosting the hero, preload the LCP image, kill render-blocking JS in the critical path, and serve images in modern formats (AVIF / WebP) with explicit width/height.

INP — Interaction to Next Paint

INP replaced FID in March 2024. It measures the worst-case latency of user interactions across the page session. Fixes: defer non-critical JS, break long tasks with scheduler.yield, debounce expensive handlers, and offload work to web workers where possible.

CLS — Cumulative Layout Shift

CLS measures visible elements moving during load. Fixes: width/height on all images, reserve space for ads and embeds, avoid late-loaded fonts that swap (use font-display: optional or swap with FOIT).

Common questions

  • Does Core Web Vitals affect rankings?

    Yes, as part of the page-experience signal. The lift is modest, but failures on competitive SERPs cost rank, especially mobile.

  • Do I need to pass on every URL?

    Google ranks on URL-level field data when available, falling back to origin-level. Optimise origin-wide; you cannot cherry-pick rankings via vital templates.

Related guides