Ultimate Guide to Core Web Vitals

doctors and nurses in a hospital observing how a website's core web vitals are performing

Ensuring your pages offer a great experience is fundamental to satisfying the users’ needs after landing on your page and completing your business goals.

That’s why since Google introduced Core Web Vitals in June 2021 as part of the Page Experience update, these metrics became a quantifiable way of evaluating user experience that actually goes beyond ranking in search.

This article explains what each Core Web Vitals metric measures, how to analyze your scores, and what to do to improve them as part of your SEO strategy in 2023.      

What are Core Web Vitals? 

Core Web Vitals are essential real-world web metrics that measure user experience on the web. The three metrics they consist of are Largest Contentful Paint (LCP), First Input Delay (FID), and Cumulative Layout Shift (CLS).

Core Web Vitals measure specific aspects of user experience:

  • Largest Contentful Paint measures loading performance — LCP identifies the point during page load when the main content has most likely loaded.
  • First Input Delay measures interactivity — FID evaluates how long users have to wait before they can interact with the page.
  • Cumulative Layout Shift measures visual stability — CLS sums up unexpected shifts in the visible page’s content layout.

Why Google introduced Core Web Vitals?

To understand why Google introduced Core Web Vitals, you need to take a look at Google’s mission.

Google aims to serve its users accurate and useful results to help them fulfill their search intent. However, that should be understood not only content-wise but also from the technical SEO perspective.

Why? Because users may not fully satisfy their search intent when a given page can’t serve them what they’re looking for due to web performance issues. For example, if your page is slow or its elements move unexpectedly, users may leave it unsatisfied before they even get to the main content.

[…] Site speed is always an important aspect of the user experience, which is why Google introduced Core Web Vitals, a set of metrics that measure load performance, interactivity, and visual stability of web pages to gauge the real-world user experience.

source: Codelabs

That’s why Google understands that pages that significantly lag in performance should drop in rankings as they may not necessarily help users find what they search for.

Also, introducing CWV as ranking signals has brought the awareness of the Page Experience signals to the table. Since then, it has been clear not only to developers and SEOs that optimizing web performance contributes to a website’s overall health.

Except for highlighting the importance of Page Experience factors, CWV help:

  • Google measure how well websites perform on the Web, and
  • webmasters prioritize their work and aim for specific thresholds.

When was Google Core Web Vitals update introduced?

In May 2020, Google announced that Core Web Vitals would become a ranking factor to evaluate Page Experience for a better Web. 

Over one year later, in June 2021, Core Web Vitals was officially introduced as part of the Google Page Experience update.

Initially, the Page Experience signals were used only in mobile rankings. However, since another rollout in February 2022, the Page Experience update also impacts your rankings on desktop.

Are Core Web Vitals a ranking factor?

Yes, Core Web Vitals are a confirmed Google ranking factor.

The metrics went live as part of the Page Experience update signals, including previously existing factors like mobile-friendliness, HTTPS, and no intrusive interstitials.

If you want to learn more on the topic of Page Experience and the rollout of the update, head to our article on Google Page Experience update.

How do Core Web Vitals impact SEO?

Core Web Vitals are metrics determining user experience in specific, measurable ways.

Improved user experience means users can easily find what they are looking for when visiting your site, and it will be more likely for them to return.

As you know, Core Web Vitals are a confirmed Google ranking factor, but their impact on rankings isn’t crystal clear. 

Here is John Mueller’s response from Google SEO Office Hours on February 26th, 2021, to a question about the influence of Core Web Vitals on search results:

[…] Relevance is still, by far, much more important. So just because your website is faster with regards to the Core Web Vitals than some competitor’s doesn’t necessarily mean that, come May, you will jump to position number one in the search results. […] It should make sense for us to show the site in the search results. Because as you can imagine, a really fast website might be one that’s completely empty. But that’s not very useful for users. So it’s useful to keep that in mind when it comes to Core Web Vitals. It is something that users notice. It is something that we will start using for ranking. But it’s not going to change everything completely. So it’s not going to destroy your site and remove it from the index if you have it wrong. It’s not going to catapult you from page 10 to number-one position if you get it right.

source: John Muller

In a Twitter post, John attempted to show the influence of CWV scores in a bit more detail:

https://twitter.com/JohnMu/status/1395798952570724352

Measuring the impact of Core Web Vitals on rankings has been difficult for members of the SEO community. When the Page Experience update rolled out, many other updates occurred in search, like the spam updates and a core update in July 2021.

This makes it tricky to separate the influence of CWV from other changes, and it’s when you should consider taking advantage of technical SEO services.

According to SISTRIX, pages that meet all of Google’s recommended thresholds for CWV metrics rank one percentage point better than the average, equal to a 37% improvement. Meanwhile, pages that failed at least one CWV metric ranked 3.7% worse on SISTRIX’s Visibility Index. 

Moz found that the most significant impact of CWV metrics occurred for URLs that failed tests for all three metrics, which saw a drop by 1.15 positions:

moz crux data results on a chart

Either way, the impact of Core Web Vitals goes well beyond simply being a ranking factor. User experience can influence your business’ success – for example, it could increase conversion rates.

John summed it up in response to a Reddit post:

[…] The other thing to keep in mind with core web vitals is that it’s more than a random ranking factor, it’s also something that affects your site’s usability after it ranks (when people actually visit). If you get more traffic (from other SEO efforts) and your conversion rate is low, that traffic is not going to be as useful as when you have a higher conversion rate (assuming UX/speed affects your conversion rate, which it usually does). CWV is a great way of recognizing and quantifying common user annoyances.

source: John Muller

What are the three pillars of Core Web Vitals?

Working on improving CWV metrics is definitely an SEO aspect that shouldn’t be neglected. 

But before you get your hands dirty in the optimization process, let’s take a closer look at each of these metrics.

Largest Contentful Paint (LCP)

LCP is a metric focused on how long the page’s main content takes to load.

In other words, LCP quantifies how long it takes for users to see what they’re looking for rendered on the screen.

Also, it’s usually true that the largest element in the viewport is the one that the user needs to see immediately. The examples of the main content’s largest elements will typically be the hero image, video, or large paragraph of text.

For an in-depth analysis of how to measure and improve LCP, follow our guide to Largest Contentful Paint.

First Input Delay (FID)

FID measures how long it takes for a user to interact with the page.

That time is measured from when a user first interacts with a web page after entering it to when the browser can start processing that interaction.

These interactions can include actions like:

  • clicking a link in the navigation,
  • entering an email address into a sign-up form field,
  • selecting an option from a dropdown menu.

An example of an FID situation is when you take action, and the browser reacts to your action with a significant delay.

It also means that FID helps you discover how long tasks running on the browser’s main thread result in a poor experience for your website’s users.

For an in-depth analysis of how to measure and improve FID, follow our guide to First Input Delay.

How much time the main thread on your pages is blocked from user interaction?

Learn how to measure it in the lab! Read our article about Total Blocking Time (TBT) and how it’s related to First Input Delay.

Cumulative Layout Shift (CLS)

CLS determines how much elements on a page shift during page load, measuring the visual stability of content. 

Your page elements should be as stable as possible to be easily clickable for users and ensure the layout shift doesn’t prevent them from completing the desired action.

To provide a more detailed description, a score of 0 means the page’s contents are fully static during the page’s lifecycle, while a higher score means the contents are moving. It’s recommended that you keep your CLS score under 0.1.

For an in-depth analysis of how to measure and improve CLS, follow our guide to Cumulative Layout Shift.

What is the threshold for Core Web Vitals?

For each of the Core Web Vitals metrics, Google identified appropriate thresholds that correspond to different scores:

  • good,
  • need improvement,
  • poor. 

Here’s how the specific thresholds look like for each metric:

Good Need impro- vement Poor
LCP ≤ 2.5s ≤ 4s > 4s
FID ≤ 100ms ≤ 300ms > 300ms
CLS ≤ 0.1 ≤ 0.25 > 0.25
ultimate-guide-to-core-web-vitals - 12 ultimate guide to core web vitals

For a higher chance of reaching the set target for the majority of users, you should aim for at least 75% of pageviews to be in the “Good” threshold for each of the three metrics. This measurement was selected to ensure the pages provide a good experience to the majority of users, regardless of the device used and the network conditions.

It should also be noted that the CWV metrics are measured for every page unless there is not enough data gathered for it. If that is the case, the score may be inferred from the whole website or some of its sections.

Ahrefs conducted a research study on Core Web Vitals and analyzed the scores for a large number of sites. It showed that in 2022, ca. 33% of sites pass CWV metrics, this score being 10 pp higher compared to the year before.

But most importantly, according to Google’s research, in the case of a website that passed the Core Web Vitals thresholds, users were 24% less likely to abandon the page.

Candidate metrics for Core Web Vitals

During Chrome Dev Summit 2021, Chrome announced that two additional performance metrics – Responsiveness and Smoothness – were being considered for Core Web Vitals.

Currently, First Input Delay measures the delay of input latency. However, it determines the time it takes the browser to get ready to process a request but doesn’t evaluate the total event duration from initial user input throughout a page’s lifetime. This is what the new Responsiveness metric would capture.

Find out how this metric could be measured in a post from web.dev on Responsiveness.

Meanwhile, Smoothness would measure “stutters” or “freezes” in animations or during scrolling to help understand how much animation frames being dropped can affect users. The score would show how smooth the animation is for the user.

To learn more about the concept of the Smoothness metric and the plan for measuring it, check out the post on Smoothness on web.dev.

How to measure Core Web Vitals?

You can use several tools to measure Core Web Vitals. Make sure you know what data the tools use: 

  • field data – taken from real-world users, or 
  • lab data – collected from predefined conditions.

To understand the use cases for both data types, be sure you’re familiar with our article on measuring web performance with lab and field data.

Chrome UX Report

The Chrome User Experience Report (CrUX) contains public, anonymized data on Core Web Vitals from real users on millions of websites. This dataset also includes information on the device and connection types, allowing for a more comprehensive evaluation and comparison of user experience between different technologies and sites.

CrUX has tremendous value for site owners and developers to help them assess pages’ performance on the web.

Data from Chrome UX Report can be found in PageSpeed Insights and the Core Web Vitals report in GSC.

Apart from that, check out some other options for using CrUX data.

Lighthouse

You can access Lighthouse in Chrome DevTools:

accessing lighthouse in chrome devtools

It’s important to note that Lighthouse contains lab data which means you won’t be able to use it to diagnose all CWV metrics. A proper example is FID which requires user interaction to be measured, so you can’t simulate it in a lab environment.

To analyze Core Web Vitals in Lighthouse, use the incognito mode, as any plugins or extensions added to Chrome can affect how the page loads and display inaccurate results.

After selecting Generate report on the page you want to analyze, you will see the assessment results and some additional practical details, like Best Practices and SEO checks.

scores shown in lighthouse
metrics scores in lighthouse

You can also see recommended actions to further improve your page’s loading.

Core Web Vitals report in Google Search Console

You can find a report dedicated to Core Web Vitals in Google Search Console. In the main GSC view, you will find it in the Experience section:

google search console core web vitals results

After opening one of the reports, you can see an overview of URLs with respective statuses, including the existing issues that led to these statuses:

google search console core web vitals status report

If you click on the status, you will display a list of URLs affected by the issue. You can then start addressing the problems. The perk of using this report is that you see data for all indexed pages within your site and don’t have to analyze each URL.

Data for the Google Search Console report comes from Chrome UX Report and reflects the experience of real users who visited the URLs.

PageSpeed Insights

PageSpeed Insights is a valuable tool for checking a page’s performance on mobile and desktop devices that can provide helpful recommendations for improving the page. 

Crucially, this tool can show both lab and field data for a page.

pagespeed insights core web vitals metrics

If you don’t want to check every page on your domain, you can focus on analyzing a few pages for each type to get an idea of how they are performing and which page templates may require adjustments.

For instance, if you have an eCommerce site, start by checking the performance of different types of product pages, as well as the category and contact pages, and those containing the cart or used to facilitate payments.

pagespeed insights opportunities and diagnostics for core web vitals

General SEO tools

Some popular SEO tools include features for checking CWV. 

One such tool is Screaming Frog – its paid version allows you to analyze CWV metrics after connecting to PageSpeed Insights API. You can export the data you get as a .csv to use it for further analysis.

Another option is using WebSite Auditor, offering an opportunity to analyze and segment CWV metrics in bulk for all of your pages to simplify the process of improving them.

How to improve Core Web Vitals?

Although all Core Web Vitals belong to the same group, each focuses on a different aspect of your website’s performance and requires a unique approach.

Here’s the checklist you can use to improve your Core Web Vitals scores for each metric:

Core Web Vitals metrics How to optimize them
Largest Contentful Paint (LCP)
  • Take care of your server-response time, e.g., consider using a CDN and enable caching.
  • Troubleshoot render-blocking resources: defer, minify, or remove non-critical or unused JavaScript or CSS files.
  • Adjust your image formats and dimensions.
  • Compress the size of your text assets.
First Input Delay (FID)
  • Minimize the time the browser’s main thread is blocked by JavaScript files, e.g., break up long JavaScript tasks into smaller ones and generate as much content as you can server-side.
  • Compress or remove non-critical or unused CSS code.
Cumulative Layout Shift (CLS)
  • Manage and prioritize custom font load using the font:display and link rel=preload values.
  • Specify width and height elements for images and videos using an aspect ratio.
  • Watch out for the implementation of dynamically injected content.

If the actions above look complex to you, don’t worry. We created three step-by-step plans to improve your Core Web Vitals scores in our LCP, FID, and CLS guides.

Google’s top Core Web Vitals recommendations for 2023

In January 2023, Google posted the list of best practices for improving CWV. Even though the last Core Web Vitals update rolled out a year ago, releasing updated documentation proves that Google still takes care of the CWV continuous enhancement.

Inside the document, Google underlines it understands the struggle of prioritizing the work on Core Web Vitals optimization. That’s why, their recent recommendations are the ones critical but also realistic to implement.

Also, Google says most websites have already followed the solutions presented in the document.

Some of Google’s tips on improving CWV in 2023 comprise prioritizing the discovery of the LCP element, avoiding large rendering updates for better FID scores, and avoiding animations that use layout-inducing CSS properties to prevent layout shifts.

For further reading, take a look at the top CWV recommendations article on web.dev.

What happens if you fail Core Web Vitals?

When your page doesn’t pass the Core Web Vitals assessment, you probably wonder how badly it can influence your website’s performance.

As you already know, with Core Web Vitals being confirmed ranking factors, your CWV results affect your mobile and desktop rankings.

However, if you don’t care to optimize these signals, I have bad news for you – their impact may go beyond your position in SERPs.

Poor Core Web Vitals scores may reflect your website’s health at three levels:

  • Worsened user experience

With main content taking more than expected to load or your page’s elements moving even without taking action, don’t be surprised if users leave your page before it gets fully loaded.

And when your users end their journey on your page unsatisfied (resulting in high bounce rates), they will likely head to your competitors.

That’s why, the goal of optimizing Core Web Vitals shouldn’t only be to pass the assessment but to make your pages faster and more satisfying to explore than your competitors.

  • Less organic traffic to your website due to poor search visibility

When your rankings decrease, it’s more difficult for users to find you on Google.

When it’s obvious that ranking on the second page doesn’t contribute to significant traffic flows, ranking at the top vs. the bottom of the first page also makes a huge difference. According to SISTRIX, the average CTR for the first position on Google is 28.5%, while for the tenth is calculated at 2.5%.

With average CTR significantly decreasing with each position, you shouldn’t count on tons of organic traffic if your page is buried down in SERPs.

  • Holding back your business from growing

When neglected, both user experience and lack of organic traffic will contribute to losing your revenue.

Because when users can’t find you on Google as you’re ranking low, you lose your potential to showcase even the best content. Also, if the competing websites are faster than yours, they are where your potential clients may go, stay and convert.

As you can see, taking care of your Core Web Vitals is connected to your website and brand development at all marketing funnel stages.

And if you care about organic traffic and how satisfied your website’s visitors are, you definitely shouldn’t ignore bad LCP, FID, and CLS scores.

NEXT STEPS

Here’s what you can do now:

  1. Contact us.
  2. Receive a personalized plan from us to deal with your web performance issues.
  3. Enjoy your organic traffic!

Still trying to decide whether to drop us a line? Take advantage of our Web Performance services to make your website faster than your competition.

Wrapping up

Whether you think of them as significant ranking factors or more of a measurable way of evaluating user experience, you can also expect CWV to affect your business goals positively.

That’s why we don’t need further research to determine that Core Web Vitals should be a fixed element of your website’s SEO strategy in 2023. It’s your users that will come to your site and have a satisfactory experience if you take the time to work on these metrics.

The good news is that you don’t have to do it all alone. Contact us for our website speed optimization services to speed up your website and outperform your competitors.

Hi! I’m Bartosz, founder and Head of Innovation @ Onely. Thank you for trusting us with your valuable time and I hope that you found the answers to your questions in this blogpost.

In case you are still wondering how to exactly move forward with your organic growth – check out our services page and schedule a free discovery call where we will do all the heavylifting for you.

Hope to talk to you soon!