Google's Core Web Vitals are part of a new factor in the ranking of the most used search engine in the world. In Spanish they are called "essential web metrics" and they represent an opportunity to improve your web positioning, but only if you understand what they are and how to improve them for SEO.

Next, we bring you a guide that will be very helpful to learn about them and take advantage of the competition. Keep reading!

What are Google Core Web Vitals?

The Web Vitals Core are a number of metrics that Google will apply on all websites. They focus on real-world user experience, specifically loading time, interactivity, and visual stability. They were announced in 2020 and have started to be a ranking factor in June 2021.

Core Web Vitals, along with other search metrics that already exist, will be part of the on-page user experience algorithm update.

There are three essential web metrics:

  • LCP (Largest Contentful Paint). It is responsible for measuring the perception of the loading speed and must be less than 2.5 seconds. In other words, the largest content should be seen within this time since the page starts to load. This gives the user a good experience.
  • FID (First Input Delay). It measures the interactivity, the response and quantifies the experience when the person tries to interact with the page. It is recommended that it be less than 100 to give a good experience.
  • CLS (Cumulative Layout Shift). It refers to visual stability and measures the amount of unexpected changes in the layout of the visible content. It should be 0.1 or less to give a good user experience.

How does Google measure essential web metrics?

Google recommends certain thresholds for each metric. As you can see in the previous image, these indicate if the user experience on your page is rated as "good", "needs improvement" or "poor".

In addition, the search engine ranks the performance of a page or web using the value of the 75th percentile of all the pages viewed on that page or site. This means that if at least 75% of the page views of a site are considered "good" in that metric, the site will be classified as "good or good".

On the other hand, if 25% of the pages fall into the category of “poor”, the site is classified as “poor”.

core web vital google what are

Updating the page experience

Essential web metrics will be part of Google's algorithm from mid-June 2021, gradually starting with the mobile version. All of this will be updating the user's page experience.

Google explains that they are important since they are looking for a user-centered experience.

The search engine expects the page experience to be fully integrated into its systems from August. And they have clarified in several publications that it will be important, but that there are other factors that also take into account, for example, the quality of the content.

By announcing it almost a year ago, they have given webmasters and website owners time to prepare. And from what we mentioned in the previous paragraph, it should not cause big changes in the positioning of your website, as long as it is well optimized.

The page experience update includes as indicators the three essential web metrics and other existing ones. These are mobile optimization, use of HTTPS, safe browsing, and no intrusive interstitial ads.

An important point about this update is that Google indicates that AMP will no longer be required to appear in Google News. And that any page, whether it performs well or poorly on Core Web Vitals, can appear in the featured news.

Also, Google will no longer display the AMP format badge.

Tools to measure Core Web Vitals

Google, by announcing essential web metrics, also released and improved some of its tools to measure them. This facilitates the diagnosis. It also gives directions on how to improve the user experience. These are:

Search Console

Search Console has an up-to-date page experience report and combines essential web metrics with the other page experience indicators. It will tell you what percentage of the URLs have a good page experience and the search impressions of the good URLs.

This report will allow you to identify pages that require attention, based on the field data.

core web vitals google graph page experience
core web vitals google experience report page

Page Speed ​​Insights

It has been updated to use Lighthouse 6.0 and can measure Core Web Vitals in both field and lab data, on mobiles and computers. It allows you to diagnose problems and identify opportunities to improve the user experience.

It measures the three essential web metrics and they are included in the report. They are also a factor in calculating the performance score. Unlike Search Console, this allows you to identify opportunities by page.

core web vital google that are page speed insights

You might also like: What Is Content Marketing Strategy?

Lighthouse

It is a tool that you can access through Google Chrome. It helps developers diagnose problems and identify opportunities to improve the user experience. It measures different dimensions of the user experience in a controlled, laboratory environment, such as performance and accessibility.

The new version 6.0 includes audits, new metrics, and a performance score. It measures the three essential web metrics and also Total Blocking Time (TBT), related to FID (First Imput Delay).

core web vital google that are lighthouse

Chrome UX Report

It is a public data set of the real experience of users on millions of websites. Measure the field versions of Core Web Vitals. This way you can better understand the real user experience.

To access this report you must follow the steps indicated here.

core web vital google that are chrome ux

Chrome DevTools

This Chrome tool has been updated to help site owners find and fix issues with visual instability on their pages, as this can contribute to poor performance on the CLS metric.

You must select Layout Shift in Performance to see the details in the Summary tab. And thus visualize where that jump or overlap occurs. In this tool, you will also be able to see the TBT and FID metrics.

Web Vitals Extension for Chrome

This new extension can be installed in Chrome and it will measure Core Web Vitals in real-time.

core web vital google that are extension

Tools outside of Google are also measuring Core Web Vitals. Among them SEMRush and Website Auditor.

How to improve Core Web Vitals for SEO?

If you work in SEO or digital marketing, you should know how to optimize your website for Google's Core Web Vitals. They will help you improve the user experience. And that's something the search engine has focused on in recent years.

As we mentioned at the beginning, Google rates web metrics as "good", "needs improvement" or "poor". If your pages fall into the "good" category, that means you are giving users a good experience.

Sidenote: It's important to know the difference between SEO and SEM.

Optimize Largest Contentful Paint

For the LCP metric, it is indicated that the ideal is less than 2.5 seconds. Reports the rendering time of the largest image, video, or text block, in which it is visible. It's not about the loading time of the entire page, but about the most important part.

The LCP is affected by factors such as slow server responses, JavaScript and CSS rendering crashes, resource load times, or client-side rendering issues.

Google indicates in the following image the first content that loads vs. the LCP, which, in this case, would be the Instagram logo.

what are google core web vitals for instagram

The best practices for optimizing your visual content and improve the score LCP are:

  • Make your photos more efficient. Use more modern file formats, such as AVIF, JPEG 200 or XL, and WebP.
  • Compress your images to reduce bandwidth, but make sure it looks high-quality.
  • You can use lazy loading.
  • Use responsive images to make sure it loads well on all devices.
  • Prefer videos over-animated GIFs.
  • Displays the largest content from the cache, rather than from its original location.
  • Optimize the server.
  • Send users to a nearby CDN.
  • Cache the files.
  • Establish third-party connections first. Google recommends using rel = "preconnect" to inform the browser that your page is trying to establish a connection as soon as possible.
  • If the problem is rendering and blocking of JS and CSS, you have to reduce the CSS blocking time by minimizing it. Also deferring the one that is not critical and putting the critic online. To block JavaScript you have to minimize and compress files of this type, defer the one that is not used and minimize the polyfills that are not used.

We have a bunch of valuable tips to get your website to drive organic traffic: How To Increase Web Traffic Or Visits To My Website & Blog?

Optimize First Input Delay

It is important to understand the concepts first. FID measures the time since the user first interacts with a page. For example, when they click, over time the browser can actually process this action and respond to it;

First Entry Delay (FID) arises because images and scripts are being downloaded out of order. This clutter causes the web page download to pause, start over, and pause again.

And the above causes it to not respond well when users try to interact with the page. Generally, the browser is busy doing something else, so it cannot respond quickly.

Related to this metric is FCP (First Contentful Paint), which measures users' first impression of how fast a site loads, while FID measures the first impression of when your site is interactive and responsive.

To fix the FDI of your site, analyze it with Lighthouse and see the opportunities that the audit suggests. Although this is a field metric and the tool analyzes in "lab", this guide will help you improve.

The main cause of delay is disorganized download of scripts and images. To solve this you will have to order the way in which those files are presented to the browser so that it downloads them.

This is accomplished by using HTML attributes to control how scripts are downloaded, and by organizing images and omitting unnecessary scripts.

The goal would be to optimize what is downloaded to eliminate those download starts and pauses that make the web disorganized. It is important to understand that the FID score varies from user to user, so it can be variable and inconsistent.

Other tips to optimize FID:

  • Reduces the impact of third-party codes.
  • Reduces JavaScript execution time.
  • Minimize code snippets (polyfills) that you don't use.
  • Keep requests low and transfer size to a minimum.

Optimize Cumulative Layout Shift

What this metric analyzes is the visual stability of a page, and seeks to ensure a good user experience. Occurs when a visible element changes its position.

It is not fulfilled if, when the person is reading something, the text moves and gets lost from where it was; Or if you are going to click a button and when you do, it changes places and in the end, you click something else.

All of this annoys users. And they could even lead you to do or accept things that you don't want to. As shown in this Google video:

what are google core web vitals

These movements can happen because resources load out of sync or DOM elements are dynamically added to the page over existing content. It can be for an image or a video with non-explicit dimensions, a font that loads larger or smaller, a third-party widget that dynamically changes its size ...

This usually happens because the operation of a site, while it is being developed, is different from how the user sees it.

Some ways to optimize the CLS are:

  • Always include size attributes in images and videos. Or reserve the required space with CSS size boxes.
  • Never insert content over an existing one. Except in response to user interaction. Thus, if there is a change in the design it is expected.
  • Downloaded fonts can cause Flash of invisible text (FOIF) and Flash of Unstyled.
  • Text (FOUT): you can prevent this if you use rel = ”preload” in the link to download that source.
  • You prefer to transform animations or property animations that trigger layout changes.

Knowing what Google Core Web Vitals are and how to improve them for SEO will help you in your web positioning to be in the first place of the search engine. We know that there are also other factors involved, and this is only part of the optimization, but updating the user experience on-page is already a reality, and it is very relevant. That is why it is essential to always be up to date!

Source

Handpicked articles for you: