Google’s Core Web Vitals Update And What It Means For Your Site

Core Web Vitals are a set of performance metrics and standards that analyse the speed of a site to ensure it is delivering an optimal user experience.

Earlier this year Google shared an update to the way they measure page ranking scores on their search engine. From May 2021, page experience signals (Core Web Vitals) such as loading and interactivity would now be considered in search ranking scores. This decision is a move to prioritise the user experience on a web page, which is significantly influenced by page load speeds.

Prior to this update, Google considered mobile useability and website security as a high priority in ranking scores. While these factors still influence the ranking of your site, page experience signals will now be vital to increasing your chance of higher rankings. 

“The new page experience signals combine Core Web Vitals with our existing search signals including mobile-friendliness, HTTPS-security, and intrusive interstitial guidelines.” – Google

So why the big focus on page speed? According to Unbounce, roughly 70% of people say that the speed of a page affects their willingness to buy from an online retailer. In this blog post, we go into more detail about the Core Web Vitals and how you can improve them.

What are Core Web Vitals?

Core Web Vitals are a set of performance metrics and standards that analyse the speed of a site to ensure it is delivering an optimal user experience. Google offers a Page Speed Insights tool where you can test the speed of your site and receive a detailed report outlining elements of the page that need to be optimised.

Types of Core Web Vitals

The types of Core Web Vitals are:

  • Largest Contentful Paint – marks the point in the page load timeline when the page’s main content has likely loaded
  • Cumulative Layout Shift – helps quantify how often users experience unexpected layout shifts
  • First Input Data – measures the time it takes for the browser to respond to the user’s first interaction. This considers the time it takes for the browser to first render any text, image (including background images), non-white canvas or SVG

Why are page load speeds important?

If you’ve ever left a website because it was too slow to load you’re not alone. For every second delay in mobile page load, conversions can fall by up to 20%. This bounce rate can have significant effects on e-commerce websites that take the user on a journey through a variety of pages, from product detail page to checkout.

Ultmately, lower page speeds = increased bounce rate = less conversions = less revenue.

Page Speed Conversion Results

Will a low Core Web Vitals score affect a website’s SERP ranking?

In the May update, Google revealed the Core Web Vitals will play a role in the algorithm for SERP ranking. This means, if a website and its competitor both rank for a keyword, but one has better page experience than the other (e.g. faster load speeds, cleaner code), Google will reward the faster site with a better position on their search results page for that keyword.

What are some techniques to improve page load speeds?

Google offers some clear instructions on how to improve page load speeds on the Page Speed Insights Tool. Common opportunities are:

  • Serve images in next-gen formats – Serve images in newer formats, such as WebP, to leverage advances in image processing and compression
  • Reduce unused JavaScript – Identify any excess JavaScript running on your site and either eliminate that code or split the bundled JavaScript into critical and non-critical through code-splitting
  • Reduce initial server response time – Choose a high-performing web hosting platform, consider a CDN such as Cloudflare, and carefully configure website caching

Headless architecture and it’s effects on page performance

Headless system architecture de-couples the front-end presentation layer – or what loads in the web browser – from the back-end system. This decoupling allows a browser to ​​pull content from multiple sources, resulting in fewer data layers and more optimal page performance. This improvement in page performance can positively impact the Core Web Vitals score of a website.

Some of the key advantages of headless architecture are:

  • Pages are served through CDNs improving page load speeds
  • Handles traffic scale without impacting backend components
  • Draws data from multiple “sources of truth” reducing data replication

Learn more about Matter’s headless architecture JAMM.™ here.