Core Web Vitals today: how to fix LCP, INP and CLS

Introduction: why Core Web Vitals matter in 2025

If you manage a website, work with SEO, or run digital campaigns, you’ve probably heard about Core Web Vitals. These are metrics defined by Google to evaluate user experience on web pages, and they directly influence rankings.

As of 2025, the three most important metrics are:

• LCP (Largest Contentful Paint): measures how long it takes for the largest visible element to load.

• INP (Interaction to Next Paint): the new responsiveness metric that replaced FID.

• CLS (Cumulative Layout Shift): tracks visual stability while the page loads.

This guide will break down what each metric means, common issues that cause poor scores, and practical ways to fix Core Web Vitals.

What is LCP (Largest Contentful Paint)?

LCP measures the time it takes for the largest visible element on the screen (image, video, or text block) to render.

• Google’s target: less than 2.5 seconds.

Common LCP issues

• Oversized or uncompressed images.

• Slow hosting or overloaded servers.

• Heavy third-party scripts.

• Missing lazy loading for images.

How to fix LCP

1. Optimize images: use WebP or AVIF formats, apply compression.

2. Improve hosting & CDN: faster servers and content delivery networks reduce latency.

3. Minify CSS & JavaScript: remove unused code and reduce render-blocking resources.

4. Preload critical assets: fonts and hero images should load first.

What is INP (Interaction to Next Paint)?

INP replaced FID and measures how responsive a page is to all interactions (clicks, taps, typing), not just the first one.

• Google’s target: less than 200ms.

Common INP issues

• JavaScript tasks blocking the main thread.

• Too many interactive elements on a page.

• Unoptimized event handlers.

How to fix INP

1. Break up long tasks: use code splitting and web workers.

2. Reduce heavy JavaScript frameworks: replace with lightweight alternatives.

3. Prioritize user interactions: ensure buttons, forms, and menus respond instantly.

4. Monitor performance: tools like Lighthouse, PageSpeed Insights, and Chrome DevTools highlight bottlenecks.

What is CLS (Cumulative Layout Shift)?

CLS measures how much elements move around while the page is loading.

• Google’s target: less than 0.1.

Common CLS issues

• Images without width/height attributes.

• Ads and embeds pushing content down.

• Web fonts causing size shifts when loaded.

How to fix CLS

1. Set dimensions for media: always include width/height for images and videos.

2. Reserve space for ads/embeds: avoid unexpected jumps.

3. Use font-display: swap: prevent layout shifts when fonts load.

4. Test across devices: CLS can vary between mobile and desktop.

Tools to measure Core Web Vitals

You don’t have to guess. These tools help track and improve Core Web Vitals:

• PageSpeed Insights – practical recommendations.

• Google Search Console – reports real-world Core Web Vitals.

• Lighthouse – performance audits directly in Chrome.

• WebPageTest – advanced load testing.

FAQs about Core Web Vitals

1. Do Core Web Vitals affect Google ranking?
Yes. Since 2021, they’ve been part of Google’s algorithm, especially when comparing sites with similar content quality.

2. Which metric should I fix first?
Focus on LCP. If your site loads slowly, visitors may bounce before interacting.

3. Is INP more important than FID?
Yes. Unlike FID, which only measured the first input, INP reflects all user interactions.

4. Are Core Web Vitals enough to rank?
No. They’re one ranking factor. High-quality content, backlinks, and on-page SEO are equally essential.