Core web vitals updates - need to know!

Web vitals have become an integral part of improving the user experience of your website, as well as helping to identify areas for improvement.

What are Web Vitals?

Google has created Web Vitals as guidance for quality signals, which help to deliver a great user experience on your website.

Several tools have been provided over the years to help measure and report on website performance. These tools can be difficult to keep up with as changes are made daily.

What are Core Web Vitals?

Core Web Vitals are the subset of Web Vitals that apply to all of the web pages across your site. Each Core Web Vital represents an individual, measurable aspect of the user experience.

According to Google, the following three Core Web Vitals create the best user experience when:

  • Largest Contentful Paint (LCP) – measures loading performance - occurs within 2.5 seconds of when the page first starts loading.
  • First Input Delay (FID) – measures interactivity – pages have an FID of less than 100 milliseconds.
  • Cumulative Layout Shift (CLS) – measures visual stability – pages should maintain a CLS of less than 0.1

How can you measure and report Core Web Vitals?

Google places great importance on the Core Web Vitals, which is why they have included these metrics in all of their popular tools.

The three main tools that these metrics have been applied to are:

The resulting data from the Chrome User Experience Report is made available via:

  1. URL-level experience metrics for popular URLs that are known by Google’s web crawlers.
  2. Public Google BigQuery project – groups user experience metrics by origins, that are known by Google’s web crawlers.

 

  • PageSpeed Insights – reports on the performance of a web page on both mobile and desktop devices, and makes suggestions on how the pages can be improved.

PageSpeed Insights provides two forms of data about a page:

  1. Lab data – uses data collected within a controlled environment to debug performance issues.
  2. Field data – captures, real-world user experience but has a more limited set of metrics in comparison to lab data.

  • Search Console – allows you to learn information on your site performance and the people who visit it. You can find out information such as the location of your visitors, how they have found your website, which pages are most popular, and whether visitors are viewing on a mobile device or desktop.

 

 Additional Web Vitals

Aside from the Core Web Vitals, there are other Web Vitals that serve as supporting metrics for the Core web Vitals, to help diagnose performance issues.

Vital aspects of the loading experience

  • Time to First Byte (TTFB) – identifies the time it takes for a user's browser to receive the first byte of page content.
  • First Contentful Paint (FCP) – is the metric that measures the time between when the page starts loading to when the page content appears on the screen. Content refers to aspects such as images, text, SVG elements, and non-white canvas. The image below shows FCP beginning in the second image.

Vital aspects of catching and diagnosing potential interactivity issues

  • Total Blocking Time – measures the amount of time between First Contentful Paint and Time to Interactive (the time the page is prevented from responding to user input).
  • Time to Interactive (TTI) – measures the time between when a page starts loading to when the page becomes responsive to user input.

The continuous evolution of Web Vitals

Web Vitals and Core Web Vitals are seen as the best ways to measure the quality of a user's experience across the web, however, these are not perfect hence continuous improvements and additions.

Developers should expect Core Web Vital interpretations and thresholds to be steady and secure, with additional updates made with prior notice. All Web Vitals changes can be viewed here.

If you would like to discuss improving your website’s performance, we offer a front-end website consulting package, which allows you to review the required fixes, without treading on the toes of your incumbent agency or in-house teams.

share this article: