Google Core Web Vitals is also officially a new ranking signal. It shows how pages are performing based on real world web usage data from the Chrome User Experience report, Google calls this real-world data as field data and uses it to also power the engine behind this feature.

As a result of multiple tests and research, Google released Core Web Vitals to replace the Page Speed report. Google Core Web Vitals run on a sophisticated engine called the Web Vitals engine released by Google on May 5th, 2020.

How to used Google Core Web Vitals

Let’s start by understating the report that we see on Google Search Console first.

The report is based on URL performance grouped by status. It's a ranking Google uses to classify which category of performance that the group of URLs’ belong too – Red for Poor, Green for Good and Yellow for Needs Improvement.

There are three main metrics that are used with the report:

1. LCP (Largest Contentful Paint): The amount of time to render the largest content elements visible in the viewport, from when the user lands on the page or requests the URL. These elements are typically an image or video, a large block of text. A good speed to have here is less than 4 seconds.

LCP Image

Source: Google Analytics

2. FID (First Input Delay): The amount of time it takes for a page to become interactive from the time a user lands on a page. This should be less than 100 seconds for optimal performance.

FID image

Source: Google Analytics

3. CLS (Cumulative Layout Shift): The amount of time it takes layouts to shift also known as ‘content jank’ after the page is loaded. This is to stop layouts from moving even after the page is loaded on the site. A good speed to have is less that 0.25 seconds.

CLS image

Source: Google Analytics

Where to find the web vitals report

Web vitals can be measured using any of the tools listed below:

Some of the above tools use field data (actual user data) whereas others use user simulation data to predict behaviour patterns.

Why is Google Core Web Vitals Important?

According to Google, the Core Web Vital is a key ranking factor hence it has a direct impact on your website SEO. Also, this signal will be used to decide which article should rank higher than the other when all articles have equally strong content and other ranking factors in place.

In addition to optimising for other factors such as content quality, intent and authority, this will be a new factor to think about when publishing each page within a complete web experience.

How to optimise for Google Core Web Vitals?

The overall idea here is to provide a technically sound experience. A bug free, lag free experience that doesn't disrupt generic site usage and flow. The best way to do that is by optimising for these metrics and making sure all elements are up to the green mark.

LCP (Largest Contentful Paint)

One of the main contributors to a poor content experience is content load time. In this case, the amount of time it takes to render on the page. What the LCP does is measure how long it takes for the largest element in the viewport to become visible. This helps Google understand when the main content of the page is rendered and is displayed on the screen.

Some reasons to why LCP can load slow are:

  • Slow server response times
  • Render-blocking JavaScript and CSS 
  • Slow resource load times (<img>, <image> in side <svg>, <video> tags etc.)
  • Client-side rendering 

FID (First Input Delay)

The First Input Delay is a field metric. It uses the user's real time data to capture the first impressions of a site’s interactivity and responsiveness. It measures the time from the moment a user interacts with the page to the time when the browser responds to that interaction.

Although there may be many reasons why FID might be slow, the main cause for poor interaction time is:

  • Heavy JavaScript execution
  • Unminified JavaScript
  • Polyfills

CLS (Cumulative Layout Shift)

Cumulative Layout Shift metric measures the instability of content by summing shift scores across layout shifts that don’t occur within 500ms of user input. It looks at how much visible content shifted in the viewport as well as the distance the elements impacted were shifted.

Most common causes of a poor CLS are:

  • Images without dimensions
  • Ads, embeds and iframes without dimensions
  • Dynamically injected content
  • Web fonts causing FOIT/FOUT
  • Actions waiting for a network response before updating DOM

To find out more about how this impacts your Sitecore website and understand your current Sitecore’s Web Vitals report, get in touch with us and we can help your website perform better on search engines.