Performance

First Contentful Paint (FCP)

The moment the browser first shows any text or image on the page.

By Nick Irmo · Updated

What First Contentful Paint (FCP) means

FCP tells you when visitors first see that something is happening. A slow FCP makes people think the site is broken and leave. It is closely tied to server speed and render-blocking resources.

Why it matters for your website

First contentful paint is the moment visitors see that something is happening, so a slow one makes your site feel broken. People who stare at a blank screen often leave before the page loads. Improving it usually means fixing the same issues that slow down the rest of the page.

Example

An auto repair shop's homepage stays blank while a large font file and several scripts load. Deferring scripts lets the heading and phone number appear much sooner.

Tips

  • Reduce or defer render-blocking CSS and JavaScript.
  • Use good hosting and a CDN to cut server response time.
  • Make sure text shows while custom fonts load.

Common mistakes

  • Loading many third-party scripts in the page head before any content.
  • Using a heavy slider or animation that must load before anything appears.

Questions about First Contentful Paint (FCP)

What is First Contentful Paint (FCP)?
The moment the browser first shows any text or image on the page.
Is first contentful paint a Core Web Vital?
No. The Core Web Vitals are LCP, INP and CLS, but FCP is still a useful diagnostic for how fast a page starts to show.
What is the difference between FCP and LCP?
FCP measures when the first text or image appears. LCP measures when the largest main element, like a hero image or headline, finishes showing.

Tell us what the site needs to do.

Share a few details and a budget range. We reply within one business day with a plan, a platform recommendation and a fixed quote.