How can I use Google Core Web Vitals to optimize my WordPress

Whether you use WordPress or if you are not going to get tired of reading the next few months about what is called Google Core Web Vitals, or Main Web Metrics.

Core Web Vitals are Google's penultimate attempt to change the Internet. Google Core Web Vitals are a set of performance and user experience metrics that are going to become a major SEO factor over the next few months and years, and you shouldn't ignore them.

The idea of Core Web Vitals is to offer a series of uniform criteria under which to measure the experience of users when they visit a website, taking into account the usability and loading speed of all its elements.

In this guide we are going to see what Google Core Web Vitals are and why they are important for WordPress users. Next we will see how to analyze the performance of Core Web Vitals on your WordPress site and how to improve the scores.

What are Google Core Web Vitals?

Google Core Web Vitals are 3 specific metrics that measure the speed and user experience of your site.

Core Web Vitals are primarily concerned with how your website loads, rather than your overall load times.

For example, measure the following:

  • How quickly visitors can see and interact with your content, even if your site hasn't fully loaded.
  • Does your site load smoothly or does it skip and change styles as different resources load?
  • Are there delays when users try to interact with the content on your site?

To do this, Core Web Vitals uses these three metrics:

  • Largest Contentful Paint (LCP) or Main content painting - measure load - how long it takes to load the main content of your page. Not all content - just the main content your visitor sees first. Your LCP should be below 2.5 seconds.
  • First Input Delay (FID) or Delay until the first interaction - measures the interactivity - how long it takes for your page to be interactive. That is, when a visitor can click on a button or other element. Your FID should be below 100 ms (this number will reflect the delay in processing the interaction).
  • ACumulative Layout Shift (CLS) or Cumulative Layout Shift - measures visual stability - how much your content visually changes as it loads. For example, if your content "moves" when an ad is shown. Your CSL should be below 0.1

Why should I care about Google Core Web Vitals?

I could tell you a lot of reasons, but there are two big reasons why, as a WordPress user, you should catch up and worry about Google Core Web Vitals: User experience, SEO

The first reason is because, according to Google, and anyone with a little common sense, the main objective when analyzing how your website performs is the user.

Taking into account the Core Web Vitals you should be able to get a better browsing experience for your visitors, avoiding usability errors such as, for example, that they click the wrong button due to a design jump (CLS), or that the button not working yet (FID).

The second important reason to consider Core Web Vitals is, of course, SEO. Google does not stitch without a thread, and when it has «proposed» these measurements in order to make websites more accessible and with a better user experience, it is that it takes them into account for the candy that puts us all in front of us: the search rankings.

And yes, Core Web Vitals are a ranking factor in Google searches, more and more. It's fair? Is it logical? Everyone will have their opinion, I believe that what one is looking for is content of value, and I am capable of supporting a poorly designed website if the content is worth it, but anyway, we all appreciate a design oriented towards usability and good user experience? Why is it easier to consume content on a well-performing website?

In any case, if you prefer, take the Core Web Vitals as performance and usability recommendations that, analyzed and applied with common sense, in no case will ruin your website, but will improve it in terms of the experience of your visitors.

How do I measure Google Core Web Vitals?

There are 3 fundamental ways to measure Google Core Web Vitals: PageSpeed Insights, Google Search Console, Lighthouse in your browser

PageSpeed Insights

A quick way to analyze your website using Core Web Vitals is to use the Google PageSpeed Insights tool.

Once you put the URL of the page you want to analyze, you will see the metrics:

  • Largest Contentful Paint (LCP)
  • First Input Delay (FID) - Only in field data
  • Cumulative Layout Shift (CLS)

You will only be able to see the First Input Delay (FID) metric if your site has enough data to provide field data.

If your site still does not have a lot of traffic, only the data from experiments will be seen, without the First Input Delay (FID) metric, which is the one based on user interaction and, consequently, dependent on whether your page has enough traffic to have relevant statistical data.

Google Search Console

Another way for us to understand the performance of our site is the Top Web Metrics report that has been included in the Search Console.

Lighthouse in your browser

Finally, you should know that you do not need to go to websites or external resources, in the same console for developers of your browser you have the Lighthouse engine, which is the one used by Google to determine the Core Web Vitals.

Just right-click anywhere on a page and click "Inspect" to open the developer console.

Once there go to the tab called "Lighthouse" and launch a report.

You can configure which parameters you want to measure (for Core Web Vitals, the one for "Performance" is mandatory) and if you want to measure for desktop (desktop) or mobile (mobile).

The report generated is very complete, as in PageSpeed Insights, with all the details, and you can analyze the 3 Core Web Vitals.

Ok, I already know how to measure Core Web Vitals, but how do I improve its results with WordPress?

Well, I think you will already be clear that to improve your Core Web Vitals, or main web metrics, you have to focus on improving the performance and usability of your website, right?

Oh no! Go back up and start reading again 🙂

Seriously, you have to understand that Google is not really so concerned about how long it takes for your website to fully load, which is what we were used to measuring in speed tools until now, but is more focused on how long your website takes visitors to have a good browsing experience and usability of your pages, and for that it is not always necessary to wait for your page to load completely.

So while load time optimization techniques are likely to improve some of the Core Web Vitals, you have to start focusing more on how your site loads, and not just how long it takes to load.

The correct way to deal with the analysis of your pages in order to analyze the Core Web Vitals would be as in these examples:

  • Is your "main" content optimized to load as quickly as possible?
  • In what order do your scripts and CSS load?
  • Do you have scripts that block the display of your main content?
  • Can you embed the critical CSS to avoid unstyled content breaks?
  • Are you serving ads or other resources from external servers that can cause leaps in the design.

Date update on 2021-02-16. Date published on 2021-02-16. Category: Computer class Author: Oscar olg Fuente: ayudawp