First Contentful Paint, commonly abbreviated as FCP, is a performance metric that measures the time at which users first see an actual content element on the screen while a web page is loading. This content can be text, an image, SVG, background image or canvas element. FCP does not measure when the page is fully loaded; it measures the first meaningful visual moment when the user can tell that the page is no longer blank and content has started to appear.
FCP is important for understanding the early stage of the page loading experience. When a user visits a website, they may first see a blank or white screen. Then the browser may display the first pixels, a background or simple visual changes related to the page. However, First Contentful Paint measures the moment when a meaningful content element is shown to the user for the first time. Therefore, FCP is not just about showing colour or empty areas; it is about the beginning of perceptible content for the user.
FCP should not be confused with First Paint. First Paint refers to the moment when the browser first paints any pixel on the screen. This pixel may be something without content value, such as a background colour. First Contentful Paint, on the other hand, measures when real content elements such as text, images or similar assets are first rendered. This distinction is important because the real value for users is not simply seeing colour, but seeing readable or recognisable content.
A good FCP value helps users quickly understand that the page is loading. According to Google’s web.dev documentation, websites should aim for an FCP of 1.8 seconds or less for a good user experience. Values between 1.8 and 3 seconds can be considered as needing improvement. FCP values above 3 seconds may cause users to perceive the page as slow. These values can be monitored through PageSpeed Insights, Lighthouse, Chrome User Experience Report and other performance analysis tools.
A slow FCP can negatively affect user experience. If users see a blank screen for too long after entering a page, they may think the site is not loading or may leave the page. FCP becomes especially critical on mobile devices, slower connections and pages that use heavy visuals or JavaScript. For this reason, FCP is not only a technical metric but also an important performance indicator that affects the user’s first impression.
Many technical factors can affect FCP. Slow server response time, render-blocking CSS and JavaScript files, large font files, unoptimised images, heavy third-party scripts and unnecessary resource loading can increase FCP time. The browser needs to download and process critical resources before it can display the main content of the page. The heavier or more blocking these resources are, the longer it takes for users to see the first content.
To improve FCP, critical resources should be optimised first. Server response time should be reduced, CSS and JavaScript files should be minified, unnecessary code should be removed and critical CSS should be prioritised. Images should be served at appropriate sizes, font loading should be optimised and third-party scripts should be prevented from blocking the initial page load. CDN usage, caching and modern file formats can also support FCP performance.
Although FCP is an important speed metric, it does not explain page performance on its own. A page may show the first content quickly, but the main visual may load late, interactions may respond slowly or the layout may shift afterwards. Therefore, FCP should be evaluated together with Largest Contentful Paint, Interaction to Next Paint, Cumulative Layout Shift, Time to First Byte and overall user experience metrics. A holistic approach should be used in performance optimisation instead of focusing on a single metric.
In summary, First Contentful Paint is an important web performance metric that measures how quickly users see the first real content on a page. A low FCP value can strengthen the perception that the page responds quickly and can make it easier for users to start interacting with the site. However, for a successful performance experience, main content loading time, interaction speed, visual stability and mobile usability should also be optimised together with FCP.
