Skip to main content
Back to Glossary (F)
Glossary · F

FCP (First Contentful Paint).

FCP measures how long it takes until the first visible content (text, image, SVG) appears in the browser. Target value: under 1.8 seconds. FCP is a sub-metric of Core Web Vitals and influences the perceived loading speed — i.e., how 'fast' your website feels.

FCP (First Contentful Paint) — Explained in Detail

FCP (First Contentful Paint) measures the time from page request to the moment the first visible content appears in the browser — whether it's text, an image, an SVG, or canvas content. It's the moment the user first sees that the page 'lives' and is loading. A good FCP is under 1.8 seconds; 1.8–3 seconds is considered needs improvement, over 3 seconds is poor.

FCP differs from LCP (Largest Contentful Paint): FCP measures the first visible content, LCP measures the largest. Both are visible in the PageSpeed Insights report. FCP significantly influences perceived performance: people perceive pages as faster when something appears early — even if complete loading still takes time. This is why techniques like Critical CSS (loading the most important CSS inline) and server-side rendering are so effective.

Measures to improve FCP: Reduce server response time (optimize TTFB), inline critical CSS directly in HTML (no render-blocking), load JavaScript asynchronously, deliver web fonts faster (font-display: swap, preloading), and use a Content Delivery Network for faster first byte delivery. DLM Digital measures FCP for all projects and optimizes to values under 1 second.

Related Page

Core Web Vitals

Frequently Asked Questions About FCP (First Contentful Paint)

FCP (First Contentful Paint) measures when the first visible content appears — no matter how small. LCP (Largest Contentful Paint) measures when the largest element (image, text block) is visible. LCP is the more important Core Web Vital, as it measures the 'main content'. FCP provides earlier feedback and is a good indicator of perceived loading speed.

Key measures: 1) Improve TTFB (server response time). 2) Inline critical CSS — prevents render-blocking. 3) Don't load JavaScript render-blocking (defer/async). 4) Load web fonts with font-display: swap. 5) Use a CDN. 6) For single-page apps: use server-side rendering or static site generation so HTML is already delivered on the first request.

FCP is not a direct Google ranking factor — LCP is. But FCP correlates strongly with Core Web Vitals and overall page experience. A slow FCP often indicates deeper performance issues that affect LCP and INP. In the PageSpeed Insights report, FCP is included in the performance score.

Ready for Your Project?

Apply this knowledge to your website — DLM Digital will help you.