Web Vitals

The delivered user experience of a website has a critical impact on user interaction, conversion, bounce rate and sales. Additionally, when someone visits your website, they are not just comparing you against your immediate competitors, they are rating you against the best-in-class services they use every day. This has resulted in a necessity to understand different aspects of the quality of user experience delivered by websites to their visitors.

In 2021 Google have implemented a set of technical metrics, called Web Vitals, aimed at observing the quality of user experience and have incorporated them into their ranking algorithms, consequently, they can have a direct impact on search results (SERPS) and other ranking-reliant processes such as PPC.

What are Web Vitals?

Web Vitals is the collective name for a set of user experience signals that Google has brought together to establish insight into whether a web page delivers a good or bad user experience.

The initial set of Web Vitals comprises of six metrics, with each of them focusing on a different aspect of how a web browser loads and presents a web page.

• Largest Contentful Paint to observe how quickly the page is loading.
• Cumulative Layout Shift to observe how stable the web page is during loading.
• First Input Delay to observe an aspect of delay before the web page can be interacted with.
• Speed Index to observe how the web page is painted into the screen.
• Time to Interactive to observe how long the visitor must wait before the web page becomes fully interactive.
• First Contenful Paint to observe how long the visitor must wait before the web page begins to be painted onto the screen.

Together these metrics form a powerful, but incomplete set, of observation points that if worked with can result in improvements in user experience for visitors to your website.

Core Web Vitals

In the 2021 release Google prioritized three key areas of user experience and have defined the metrics associated with these aspects as a distinct subset known as Core Web Vitals. Each core metric focuses on the specific areas of loading, interactivity and visual stability and how they contribute to the overall user experience delivered.

Largest Contentful Paint (LCP) establishes a user's perception of load speed as it represents the point in the page load time line when the largest image or text block is visible within the viewport (screen). A fast LCP helps loads critical content quickly and can reassure the user that the web page is useful to them and what they are expecting the web page to deliver.

Cumulative Layout Shift (CLS) is a measurement of visual stability of the web page. It quantifies how much the web page content, text, image or video, visually shifts around on the screen. Stability is achieved by the lower the value of the CLS score is as this translates directly to better user interaction with the web page.

First Input Delay (FID) is a measure of interactivity and responsiveness to user input. It is a complex metric that measures the total delay time between the first non-white pixel appearing in the user's viewport to the time when the web page is interacted with. A low FID enables the user to be interacted with quicker.

First Input Delay can only be captured from actual visitors to a website as the metric relies on observing how quickly the web page is interacted with; this type of data capture is known as field data. However, in a test and development environment a surrogate metric, Total Blocking Time (TBT) is used as a method of reducing the delay time measured by FID itself. This type of data is known as lab data as it is generated under controlled conditions.

Put together these metrics are deemed as a quantifiable measure of how a user perceives the experience of a web page. All of the metrics are measured at the 75th percentile across both mobile and desktop devices. This means any improvements made will impact the majority of your site visitors.

Why do Web Vitals Matter?

In their page experience update in mid 2021, Google now use Core Web Vitals as part of their page ranking algorithms. This means that it will give preference to sites it determines delivers good user experience.

Currently, Web Vitals makes up 55% of the Google Lighthouse Performance score. The Lighthouse score is a user-based method of understanding the Web Vitals metrics. This approach is termed "Lab testing" and is useful for helping identify and improve web page performance and user experience.

To drive the page ranking algorithm, Google collects its own data to validate the Core Web Vitals for assessing the speed of a web page. It is then used as one of the user experience ranking factors for both mobile and desktop devices, which in turn can impact how Google audits and views the SEO characteristics of a web page.

Consequently, to protect your investment in search engine optimization (SEO), attention to the Core Web Vitals is imperative. However, passing the core web vitals assessment criteria does not mean that your website delivers either a good user experience, or good web performance. It only means that you have passed Google's assessment criteria.

What are the recommended values for Web Vitals?

Google has defined a set of pre-defined range of values that it uses to determine if a web page delivers a good user experience. Each metric has its own range of values and a good experience is highlighted in green below. A poor experience is highlighted in red. A third category of Needs Improvement is observed if it is between these values.

Even months after the page experience update, surprisingly there are still only a few websites that have achieved a 'Good' rating for each of the 3 core metrics.

With competition ever increasing, small increments in performance can make the difference to how Google views the user experience you deliver to your website compared against your online competitors.

How do I track Web Vitals?

The Webspeed Index platform enables measurement of both your mobile and desktop Web Vitals metrics for any given web page. This provides a consistent way to benchmark and measure user experience and performance improvement or regression and also enables the comparison of user experience that your website delivers compared to other competitive websites.

Inbuilt in Webspeed Index is the ability to build a custom view of your closest competitors and rank them specifically by Web Vitals.

This can be an easy way to spot opportunities to gain competitive advantage as if the content of your web page and that of your competitors is deemed equal, Web Vitals could be the difference between which page Google ranks higher.