What is LCP?

LCP (Largest Contentful Paint) marks the moment the largest element in the visible part of the screen (usually a hero image, product photo or large heading) has fully rendered. Of the Core Web Vitals, it best reflects the user's feeling that "the page has loaded".

#Why it matters

• Visitors may leave before they see the main content; every second counts, especially on mobile networks.
• LCP is one of the three metrics in Google's page experience assessment.
• The causes of slow LCP are usually few and measurable: slow server response (TTFB), oversized images, render-blocking CSS/JS, a hero image that loads late.

#Where you see it in SEOAsist

• The Core Web Vitals card on the Overview page shows LCP in seconds, separately for mobile and desktop.
• SEO analysis raises a Slow LCP finding when mobile LCP exceeds 2.5 seconds.
• The Slow response (> 3 s) issue in Technical Audit points to server response times that directly delay LCP.

More: Overview dashboard.

#Example

Load the hero image with high priority and keep it out of lazy loading:

<link rel="preload" as="image" href="/img/hero-1200.webp" fetchpriority="high">

<img src="/img/hero-1200.webp" width="1200" height="600"
     alt="Oak dining table collection" fetchpriority="high">

#Common mistakes

• Giving the hero image loading="lazy", so the LCP element loads late.
• Sending a 3000-pixel image to phones; use srcset and WebP/AVIF.
• Hiding the main text until a web font loads; use font-display: swap.
• Working only on the front end and skipping server and caching.