Largest Contentful Paint
Largest Contentful Paint (LCP) is a Core Web Vital that measures how long it takes for the largest visible content element in the viewport to render after a page starts loading.
Key takeaways
- LCP measures when the largest visible element renders – not the full page load.
- Google's good threshold is 2.5 seconds or less (75th percentile).
- Main causes of poor LCP: slow server, render-blocking resources, unoptimized images.
- Improve LCP by optimizing images, reducing blocking resources, and improving TTFB.
- Use field data (Search Console, CrUX) for accurate measurement, not just lab tests.
For SEO practitioners, LCP is a key page experience signal because it reflects when users perceive the main content as ready.
Example
A news article page loads. The largest visible element is a hero image (1200x600 px). LCP measures the time from navigation start until that image fully renders. If it renders in 1.8 seconds, the LCP score is 1.8 s (good). If the image is slow to load due to a large file size, LCP may exceed 2.5 s (poor).
When should I use this?
Monitor and optimize LCP for any page where user perception of load speed matters. This includes:
- Content-heavy pages (blogs, news, articles)
- E-commerce product pages
- Landing pages with hero images or videos
- Any page where first-impression speed affects bounce rate or conversions
What it is not
- LCP is not the time until the whole page finishes loading (it only measures the largest visible element).
- LCP is not the same as First Contentful Paint (FCP measures the first visible element, not the largest).
- LCP is not a measure of interactivity (use Interaction to Next Paint for that).
- LCP is not a single test-run metric; it should be evaluated using field data at the 75th percentile.
Quick start
- Measure your current LCP using PageSpeed Insights or Search Console.
- Identify the LCP element (often an image or text block).
- Optimize images: compress, use next-gen formats (WebP), lazy-load below-fold images.
- Reduce render-blocking CSS/JavaScript: inline critical CSS, defer non-critical JS.
- Improve server response time (TTFB): use a CDN, optimize hosting, enable caching.
- Preload key resources (e.g., hero image) using
<link rel="preload">. - Test again and monitor field data over time.
Common mistakes
- Treating LCP as the time until the whole page finishes loading instead of the largest visible content element rendering.
- Optimizing only images while ignoring render-blocking CSS, JavaScript, and server latency.
- Measuring only one device or one test run instead of looking at field data and the 75th percentile.
- Assuming the same element is always the LCP element on every viewport or device.
Next step
FAQ
What is Largest Contentful Paint?
LCP is a Core Web Vital that measures the time it takes for the largest visible content element in the viewport to render after a page starts loading.
What is a good LCP score?
A good LCP score is 2.5 seconds or less, measured at the 75th percentile of page loads.
How is LCP different from First Contentful Paint?
FCP measures the first visible element, while LCP measures the largest visible element, which better reflects perceived load time.
Related topics
Sources
- Google web.dev: Largest Contentful Paint (LCP) — Primary Google guidance with the clearest definition, scope, and threshold framing for LCP.
- W3C LCP specification repository — Technical specification source for the metric's formal behavior and terminology.
- Google Search Central / Core Web Vitals guidance — Best source for SEO relevance, ranking/page experience context, and how Google uses Core Web Vitals.
Reviewed by Lucía Marín, Founding editor.