Core Web Vitals: What Every CMO Should Know

core web vitals web speed illustration

Photo credit: Marc-Olivier Jodoin on Unsplash 

As CMO, you may not be thinking about site speed as a marketing concern — that typically falls under the realm of IT. But it’s actually a marketing issue. So, what do Core Web Vitals got to do with it?

No amount of amazing advertising or compelling content will compensate for a user’s impatience. In fact, it takes only three seconds for 53% of potential customers to give up and leave your website.

For example, you’ve spent about 10 seconds total reading this far. Imagine if instead of reading this article, you were still waiting for the page to load. You’d be annoyed, right?

Well, 46% of web visitors who hate waiting for pages to load would agree. But we’re just talking about a few seconds, is it that big of a deal? It is. A recent study by Google and Deloitte found that just one tenth of a second can decrease conversion rates by 8.4% and average checkout values by more than 9%. In short, for CMOs the data is clear: Speed matters.

The reality is website performance can be a complex topic, and with Google now throwing even more jargon into the mix (Core Web Vitals, anyone?) it’s easy to get lost. In this article, we’ll break down how page speed works, what metrics to pay attention to in order to retain consumers, and how to bring performance marketing into your CMO arsenal.

What are Google’s Core Web Vitals?

Google’s new Core Web Vitals program provides guidance on what exactly makes an excellent user experience. The new benchmarks define three common signals that summarize how your website is performing for real customers. They may sound complicated, but by the end of this article you’ll be able to quickly understand what each metric means and how it relates to your customers. We’ll explain each in simpler terms and provide real-life user interactions for each metric.

The core website vitals encompass all web experiences in order to unify all metrics. The three main ones are:

  • Largest Contentful Paint
  • First Input Delay
  • Cumulative Layout Shift

Here’s how to think about these performance metrics in terms of the user experience. Each metric answers one of the following user questions.

User Question Translation to User Experience
  1. Is it happening?
Is the page loading? Has the server responded?
  1. Is it useful?
Is there enough content loaded that I can click, scroll or engage with the site?
  1. Is it delightful?
Can I read and scroll through this page, or does it keep moving around? Is this site buggy?

 

This model for core web vitals puts it into user-centric terminology to translate them into layman’s terms.

Question 1: Is it happening?

The first step in the user journey is the initial response from your webserver to the user’s browser. Enter: This is where Largest Contentful Paint comes in.

Largest Contentful Paint (LCP) measures how long it takes the largest content block, or image, to become visible to the user. In other words, it’s a measurement of how long it takes for a web page to tell the user “This page is working.” This measures the time from when the page starts loading to when the largest text block or image element renders onscreen (the content in the poorly named ‘contentful’ part of the metric). This is often your hero image. With the main content now visible, the customer can now ‘see’ your page.

Question 2: Is it useful?

The user now has initial feedback that the page works. But how long until it’s useful? Enter First Input Delay (FID). You’ve probably experienced this when you’ve visited a site, tapped on a link and there was a lag in the response. Or, upon your first interaction with a site, the entire page reloads. And you’re left wondering whether the site broke, or is frozen. This site isn’t actually useful; you can’t interact with it. As you send the site input i.e., click a button, the delay is agonizing. You’d likely leave that site due to the bad experience.

FID measures the time from when a user first interacts with a website. That means, tapping on a button, clicking on a link, etc., to the time when the browser responds to that stimulus. In other words, FID measures the time it takes for the browser to respond to your first interaction with a website, and this is measured in milliseconds.

Question 3: Is it delightful?

Now, we have the main image, and the user can now start to interact with the site. But the website is still loading, so if you try to do anything on it, it might pause. This is a cause of frustration and can lead to users bailing on your site. This one isn’t exactly a metric but something everyone hates. 

Cumulative Layout Shift (CLS), while again, not a performance metric, is a valuable insight into the page layout. A layout shift occurs when a page lays the site out again, after the initial layout causing the page to “shift” around in view. Have you started to read the content on a site then BOOM, some ad pops up and shifts down what you were reading? That’s a layout shift.

And there you have the three Core Web Vitals. Before Google created these, there used to be a veritable alphabet soup of performance metrics and corresponding acronyms. It was complicated, and you pretty much needed an engineering degree to understand it. This year, a team at Google decided to take some of these metrics and explain them in a way regular people can understand.

Incorporating the three questions above makes these Core Web Vitals into user-centric metrics to clarify how it all works. This allows users to understand what’s being measured in terms of the journey they go on when they go onto a web page.

Jake Loveless is CEO and Co-Founder of Edgemesh