LCP (Largest Contentful Paint) is the Core Web Vitals metric that measures how long it takes for the largest visible element on your page to render: a hero image, a product photo, a large text block, or a video. Google has used it as a direct ranking signal since 2021.
Simply put, LCP answers the question: "When can the user actually see the main content of this page?"
What Elements Does LCP Measure?
The browser identifies the "largest" element by the area it occupies in the viewport. Common candidates include:
<img>tags or images inside<picture>elements- CSS background images (
background-image) on the largest visible element <video>elements (using the poster image)- Large text blocks inside
<p>,<h1>–<h6>, etc.
LCP updates as the page loads and is frozen on the user's first input (click, scroll). The final value Google reports corresponds to the last "largest" element recorded before that interaction.
What Are Good, Acceptable, and Poor LCP Values?
| LCP | Rating | SEO Impact |
|---|---|---|
| ≤ 2.5 s | Good | Contributes positively to ranking |
| 2.5 – 4.0 s | Needs improvement | Neutral / slight disadvantage |
| > 4.0 s | Poor | Page experience penalty |
Google applies the Core Web Vitals signal using the 75th percentile of real users (CrUX data). That means 75% of your visits must experience LCP ≤ 2.5 s for your site to be in the "good" range.
How LCP Affects SEO
LCP is part of the signal group called Page Experience, alongside INP and CLS. Google includes it in its ranking algorithm as a tiebreaker between pages of similar content quality.
In practice, the ranking impact is moderate — content is still king — but in competitive markets it can mean the difference between position 3 and position 1. Additionally, poor LCP increases the bounce rate, which does indirectly affect rankings.
Beyond SEO, slow LCP destroys conversions. Google research shows that improving LCP from 6 s to 2.4 s can increase conversion rates by 15%.
The Most Common Causes of Poor LCP
1. Unoptimized Images
A 3–5 MB hero image in an older JPEG format is the number one culprit. The solution: convert to WebP or AVIF, compress aggressively, and set explicit dimensions.
2. Slow Server or Hosting (High TTFB)
If the server takes more than 600 ms to respond, LCP can never be good — no matter how much you optimize the frontend. Choosing hosting with low response times is the first step.
3. Render-Blocking Resources
Synchronous JavaScript and large CSS stylesheets block the browser parser. If your LCP element is an image but that image sits behind a blocking script, the LCP time skyrockets.
4. Missing Preload for the LCP Resource
The browser discovers the LCP image late — especially when it comes from CSS or a JavaScript slider. Using <link rel="preload"> in the <head> tells the browser to fetch that resource immediately.
5. Lazy Loading Applied to the LCP Image
Adding loading="lazy" to your main hero image is a classic mistake. That attribute should only go on images below the fold.
How to Improve LCP Step by Step
- Identify your LCP element in PageSpeed Insights or Lighthouse (the tool highlights it in the screenshot).
- Compress and convert that image to WebP. Target under 150 KB for mobile hero images.
- Add
<link rel="preload" as="image">in the<head>pointing to the LCP resource. - Check your TTFB. If it exceeds 600 ms, consider switching hosting or enabling a CDN.
- Eliminate or defer blocking scripts with
deferorasync. - Remove
loading="lazy"from above-the-fold images or elements. - Re-measure with PageSpeed Insights (field data) and iterate until you reach ≤ 2.5 s at the 75th percentile.
For hands-on guidance on each of these fixes, browse our web performance optimization articles.
Key Takeaways
- LCP measures when the largest visual element on your page appears — the most direct signal of perceived speed.
- The goal is ≤ 2.5 s for 75% of real users (75th percentile in CrUX).
- The main culprits are heavy images, high TTFB, render-blocking scripts, and misapplied lazy loading.
- Key fixes: WebP + compression, preloading the LCP resource, fast hosting, and deferring JS.
- Beyond SEO, a fast LCP lowers bounce rates and directly boosts conversions.
Is your LCP above 2.5 seconds and you're not sure where to start? The team at elenlace.com can diagnose and fix it for you — contact us for a free performance audit.
FAQ
Are LCP and FCP the same thing?
No. FCP (First Contentful Paint) measures when the first pixel of content (text, image, or SVG) appears, regardless of size. LCP measures when the largest visible element appears. LCP always occurs at the same time or after FCP.
Can I improve LCP without changing my hosting?
Yes, but with limits. Image optimization, preloading, and eliminating render-blocking resources can significantly improve LCP. However, if your TTFB exceeds 1.5 s, you've hit a ceiling and will also need to upgrade your hosting or add a CDN.
Is LCP measured on mobile or desktop?
Google uses real field data (CrUX) separated by device type. What appears in Search Console reflects the actual experience of your users — predominantly mobile. Lighthouse in "mobile" mode simulates a slow 4G connection, which is the most representative scenario.
How often does Google update LCP data in Search Console?
CrUX data updates approximately every 28 days (rolling window). This means changes you make today will take several weeks to fully appear in Search Console.
Further reading
Other providers and guides worth comparing:
