How to use the Core Web Vitals report in Search Console

What is the Core Web Vitals report?

Google's Core Web Vitals report in Search Console displays how your web pages perform based on actual user experiences. This "field data" reflects real-world usage rather than simulated tests. The report groups URLs by their performance status (Poor, Need improvement, Good), by the specific metric type (LCP, INP, CLS), and by similar web page groups.

Core Web Vitals are a set of metrics that apply to all web pages and measure the real-world user experience across three key aspects: loading performance, interactivity, and visual stability. These metrics are Largest Contentful Paint (LCP), Interaction to Next Paint (INP), and Cumulative Layout Shift (CLS). The data for this report comes from the Chrome User Experience Report (CrUX), which collects anonymized real user measurement data. This data powers various Google tools, including Search Console's Core Web Vitals report.

What do LCP, INP, and CLS measure?

Each Core Web Vital metric represents a distinct aspect of the user experience. Largest Contentful Paint (LCP) measures how quickly the main content of a web page loads. To provide a good user experience, Google documents that LCP should occur within the first 2.5 seconds of the page starting to load for at least 75% of page visits.

Interaction to Next Paint (INP) assesses a page's overall responsiveness to user interactions by observing the latency of all qualifying interactions throughout a user's visit. For a good user experience, Google states that INP should be less than 200 milliseconds. This target applies to at least 75% of page loads, segmented across mobile and desktop devices.

Cumulative Layout Shift (CLS) measures the visual stability of a page. It combines how much visible content has shifted in the viewport with the distance the affected elements moved. To provide a good user experience, Google recommends a CLS score of less than 0.1 for at least 75% of page visits.

How is performance status determined?

The Core Web Vitals report assigns a status of "Poor," "Need improvement," or "Good" to URL groups for specific device types, such as mobile or desktop. This categorization is based on the real-world usage data collected from the Chrome User Experience Report (CrUX). CrUX gathers anonymous data from real Chrome users across millions of websites, providing a realistic view of performance.

A URL group must have a minimum amount of reporting data for both LCP and CLS to be included in the report; otherwise, the URL is omitted. The performance of a site can vary significantly based on factors like a user's device capabilities, network conditions, other running processes, and how they interact with the page. The report's statuses reflect these real-world conditions, with targets set for the 75th percentile of page loads to ensure most users have a good experience.

How do you use the report to fix issues?

Google recommends that you first fix all issues labeled "Poor" in the Core Web Vitals report. After addressing these critical problems, you should prioritize further work either by focusing on issues that affect the most URLs or by tackling issues that impact your most important URLs. This approach helps you make the most significant improvements to user experience.

When you believe a particular issue is resolved, you can click "Start Tracking" on the issue details page within the Search Console Core Web Vitals report. This action allows Google to monitor the changes and update the report status. When optimizing, it is best to start with field data, which is the real user data provided by CrUX. Tools like PageSpeed Insights can also help you view this CrUX data to identify performance gaps.

How do you optimize Largest Contentful Paint (LCP)?

To improve Largest Contentful Paint (LCP), you need to examine and optimize the entire page loading process. A key step is to ensure that your LCP resource, which is typically the largest image or text block, is discoverable directly from the HTML source. This helps eliminate unnecessary resource load delay.

It is important to never lazy-load your LCP image, as this will always introduce an unnecessary delay and negatively impact LCP. The most effective way to reduce resource load duration is to eliminate the network entirely from the process, for example, by serving resources from a cache or directly from the HTML.

How do you optimize Interaction to Next Paint (INP)?

Optimizing Interaction to Next Paint (INP) involves improving the responsiveness of your page to user interactions. Interactions consist of an input delay, which is the time from when a user initiates an interaction until the event callbacks begin. The best general advice for optimizing these event callbacks is to perform as little work as possible within them.

Minimizing the work in event callbacks helps prevent the collective work from becoming a "long task" that blocks the main thread. This allows other interactions that would otherwise be waiting on the main thread to run sooner, improving overall responsiveness. Additionally, avoid "layout thrashing," also known as forced synchronous layout, which is a rendering performance problem where layout calculations occur synchronously, causing delays.

How do you optimize Cumulative Layout Shift (CLS)?

Cumulative Layout Shift (CLS) measures the visual instability of content on your page. Common causes of a poor CLS score include images, ads, embeds, and iframes that do not have specified dimensions. Dynamically injected content, such as ads or embeds, without reserved space can also lead to unexpected shifts. Web fonts can also contribute to layout shifts.

To reduce CLS, always include width and height size attributes on your image and video elements. When placing content that loads later in the content flow, you can avoid layout shifts by reserving the necessary space for these elements in the initial page layout. It is worth noting that some lab performance tools may not fully capture the CLS of a page, as they typically perform a basic page load.

Common questions