What is ‘First Contentful Paint’

The Core Web Vitals metric First Contentful Paint (FCP) measures the time from when the page starts loading to when any part of the page’s content is rendered on the screen.

First Contentful Paint

Content can refer to any text, images (including background images), <svg> elements, or non-white <canvas> elements.

Core Web Vitals - Render Timeline - CNN
For CNN.com, FCP happens in the third frame, as that is when the first text and image elements are rendered to the screen. You’ll notice that some of the content has rendered, but not all.
Core Web Vitals - Render Timeline - Site Schema
For Site Schema, FCP happens in the second frame and appears ready for the visitor to interact.

The distinction between First Contentful Paint (FCP) and Largest Contentful Paint (LCP) is the difference between some of the content rendering but not all of it. LCP measures when the page’s main contents have finished loading.

Need Help with Core Web Vitals?

We’re here for you

We love solving complex problems and want to help you solve yours. We’ll take care of the heavy lifting so that you can focus on your audience.