Oct 14 | Categories: SEO

What Are Core Web Vitals and Why Are They So Important for SEO Success?

Share: instagram | facebook | pinterest

Google Algorithm updates are frequent, to say the least. Many of these updates are made to advance the power of an already existing analytics model. But sometimes, Google puts out new Google Analytics updates that shift the landscape of search engine optimization (SEO), user experience (UX), and website development. 

Google Analytics analyzes your website’s health, which is why putting in intentional, consistent SEO efforts is vital to your digital marketing success. That’s the importance of SEO: optimizing your site for your users tells Google that you are a credible, informative, and necessary resource for searchers’ inquiries and experience. 

In May 2021, Google Developers announced a new ranking factor for evaluating sites: page experience.

Page experience is based on metrics called ‘Core Web Vitals.’ On this page, you’ll learn what Core Web Vitals are and how they affect your site’s ranking.

What Is Page Experience? 

Core Web Vitals are one subsection of page experience. So, before we jump into the details of Google Core Web Vitals, let’s cover the overarching topic of page experience.

Page experience encompasses the factors that determine the user experience of a visitor to your webpage. 

At its core, UX is a user’s interaction with your website and webpages. The quality of this experience helps determine if the user will stay on your page. 

UX is becoming an increasingly important part of how Google and other search engines rank your page. Learn more about UX and the role it plays in interacting and coexisting with SEO in our UX vs. SEO blog post.

Page experience is all about how users interact with your site. Optimizing page experience signals helps ensure your users can walk away satisfied with their interaction with your site. Hopefully, they will return based on a helpful and productive visit to your site. 

Page Experience Signals 

There are four page experience signals that the latest Google Algorithm update takes into account:

1. Core Web Vitals
2. Mobile-friendliness
3. HTTPS (Hypertext Transfer Protocol Secure)
4. No intrusive interstitials

Mobile friendliness is how adaptable your website is for being viewed and interacted with on a mobile device.

HTTPS indicates whether your website has a secure connection.

No intrusive interstitials is Google’s way of saying that your users should be able to view the page. Pop-up ads, banners, and other obstructive elements count against you. If you need a real-life example, just consider the 2017 MARTA bus photobombing of the Georgia Dome Implosion. Don’t be like the MARTA bus. You want your users to see how awesome your website is. 

What Are Core Web Vitals?

Google Core Web Vitals are metrics used to measure and determine UX. Core Web Vitals, SEO, and UX are all connected.

Think of it this way: UX is extremely important, but you—and Google—can’t have a conversation with every single person who visits your website about how they felt about their time on your website. Sure, a user may be able to leave a review, but what about their actual experience? 

Enter, Google Core Web Vitals. 

Core Web Vitals measure a user’s experience so Google can evaluate whether your website is worthy of appearing on a search engine results page (SERP). 

Using the metrics measured by Core Web Vitals, Google can get a better understanding of your website. This is science, research, and human experience all combined into a measurable tool for improving your website.

What Are Core Web Vitals’ Individual Metrics?

There are three Core Web Vitals metrics used to measure a user’s real-world experience with your website:

1. Largest Contentful Paint (LCP)
2. Cumulative Layout Shift (CLS)
3. First Input Delay (FID) 

Let’s take a deep dive into what each of these are and how these Core Web Vitals metrics affect your SEO and UX. 

Largest Contentful Paint

LCP is all about loading performance. LCP is the amount of time, measured in seconds, that a webpage takes to load. Load time starts right when a page is opened and stops when all of the page’s content has been loaded. 

LCP is important because it’s a measurement of the main content of a webpage. 

Largest Contentful Paint are those elements that are bulky because they are, well, large (as the name suggests).

*Hint: This is where the worlds of SEO and development unite.*

Important LCP elements include:

• Block texts
• Images, particularly high-resolution images: <img>
• Images inside scalable vector graphics (this code is just an example, real website SVG elements will have more child elements): <svg> <image> </svg>
• Videos: <video>
• Background images not in CSS
• Large CSS—this is not a single element, but CSS is the design that goes on the page; the larger the CSS is, the higher your LCP score may be

The ultimate goal is to be in the “good” range of an LCP score. When you have a huge webpage with lots of elements, this isn’t always the case. 

LCP Core Web Vitals Report

Google’s LCP scores fall into three categories:

• Good: 0-2.5 seconds
• Needs improvement: 2.5-4 seconds
• Poor: 4+ seconds

Each score is paired with a corresponding green, yellow, or red indicator, making the results intuitive for users. 

LCP size is measured by what the user can see. This means that if you have an overflow element—something that goes off the screen—then the LCP score is only attributed to what’s shown on screen. 

If an element is resized, then the smallest version of the element is scored. The intrinsic size refers to an element’s original dimensions. So, if its width and height change after the fact, that’s fine because the intrinsic size gets the score. 

Design note: When you update elements in CSS, they should remain proportional and clear. Diverging from original image sizes in CSS can change an image’s resolution. If you want to resize an image, do so before you insert it into your code. That way, no matter the dimensions of the viewer’s device, the element will be of the quality you want.

Also, note that the LCP score pertains to what a user can see. If you have a long webpage, you will have multiple scores because new elements will appear as the user scrolls down. 

Cumulative Layout Shift

CLS is about your webpage’s visual stability. Visual stability is how smoothly your website’s elements interact with each other. CLS measures:

• Layout shift
• Distance fraction
• Impact fraction
  

Let’s take a look at each. 

Layout Shift

Layout shifts happen when elements on the page move from their original position. This is not always a bad thing! 

Layout shifts can help user experience, like when you have a button on your page and elements shift when the user clicks that button. 

Layout shifts can also have a negative impact on your site speed and user experience. There may be unstable elements that load at different times on different parts of the page. This can cause major annoyance and drag down your site speed, a big no-no for positive UX. 

For example, if a visitor clicked on a button for expandable content, and that content instead appeared somewhere offscreen. Or the resizing of a window pushed other content into an unreadable or inconvenient area.

Distance Fraction

The CLS score also takes into account the distance fraction. The distance fraction measures the movement in a layout shift. The fraction looks like this:

(frame movement)/(largest original dimension, either width or height)

If something moves too far—or not far enough—it could negatively affect your CLS score. The easiest way to avoid this issue is to make sure that your layout shifts make sense. The buttons on your site should do what an average user would expect them to do. 

Impact Fraction

Impact fraction means the total view frame that the unstable element takes up from the original position to the current position. 

Essentially, what happens is this: There is a single view of a screen without scrolling and a block of text is at the top. A shift of elements happens and that same block of text moves down the screen (still the same amount of screen, without scrolling). The total amount of screen that the text element takes of the entire screen is the impact fraction.

CLS Core Web Vitals Report

The layout shift score is the distance fraction multiplied by the impact fraction. You want to minimize the movement of elements so that the layout shift score is less. 

The CLS score is as follows:

• Good: 0-0.1
• Needs improvement: 0.1-0.25
• Poor: 0.25+

CLS is usually stressful and distracting. Ensuring your user has a positive experience means minimizing layout shifts. If you want movement on your webpage, gradual transitions are the way to go. 

Talk to the development team at Metric Marketing about how to optimize your website by adding cool features that don’t take away from good design. 

First Input Delay (FID)

First Input Delay is the handshake and hello you make with a new client or customer. In other words, FID is the amount of time it takes for your webpage to react when a user interacts with it. 

Think of FID as a measure of courtesy. It can be awkward when you say hello to someone and they don’t immediately respond or just ignore you. How rude! That is not a good experience to have with another person. 

Similar to that scenario, when your webpage responds to a click right away, the user recognizes your webpage’s promptness. If your user clicks and then nothing happens for too long, it’s discouraging. 

Optimizing your FID—aka, having a low FID score—means that your website can immediately respond to your users’ needs. 

But here’s the thing: Developers write code that’s made to work. But sometimes, browsers and other factors detract from the loading process, causing a delay in reaction time. This may happen because large content hasn’t yet loaded—a throwback to LCP—or the browser is working to present something else. 

Most often, the browser is processing a large chunk of JavaScript, putting all of its attention toward processing code instead of what the user just asked for. 

In short, FID is the amount of delay time it takes for the site to respond to a user’s needs. 

The first input delay is not the processing time to get to the desired location of the click. Load time and reaction time should both be quick. There is a difference, and both affect UX. 

FID Core Web Vitals Report

Just like LCP and CLS (and golf, for that matter), an FID Core Web Vitals report score is best if it is low. FID score is measured in milliseconds. Also similar to LCP and CLS, FID is categorized as good, needs improvement, and poor:

• Good: 0-100 ms
• Needs improvement: 100-300 ms
• Poor: 300+ ms

As the name states, this Core Web Vitals metric is for the first input delay. This means that Google measures the first experience because, like a first impression, FID makes a major impression on a user. 

If we look at a webpage like a person, first impressions matter. If you have a great first impression, and then a person does something a little off in an interaction, it’s common to be more forgiving because you’ve already met them and had that favorable first impression. 

But, if someone makes a bad first impression—or a webpage has a high FID—then you’re less likely to continue engagement. First impressions matter, that’s why Google measures them. 

A Note on Ranking

Google Core Web Vitals—and all page experience signals for that matter—are extremely important. However, content remains king. Google ranks a page based more on the quality of content than on-page experience signals. You need to make sure your content fits a user’s intent and provides valuable information in a clearly communicated way.

That being said, Core Web Vitals and other page experience signals make all the difference when your competition’s content is just as good as yours. If there are many relevant pages Google can present as options to searchers, Core Web Vitals metrics can make a difference. 

As a concluding note, content always comes first, but when everyone has good content, it’s the Core Web Vitals that matter.

Measuring Core Web Vitals Metrics

There are many tools that you can use to measure your Google Core Web Vitals, all of which are approved by Google Developers.

Here at Metric Marketing, we utilize the following tools to interpret data:

• Google Analytics
• Google Search Console
• PageSpeed Insights

All of these are also recommended in Google Developers’ Core Web Vitals workflow. 

Measuring your Core Web Vitals will keep you up to speed on your website’s health. But measuring Core Web Vitals is not quite as simple as seeing your metrics on a graph. 

Different analytics will look at different elements. Google Search Console shows you information per URL, meaning per page. Google Analytics/CrUX Dashboard tracks an entire UX from the moment a user lands on your site. The way these results are presented can vary greatly. 

Evaluating Your SEO Core Web Vitals

Once you know your SEO Core Web Vitals score, you can create a strategy to make your website healthier. 

Strengthening your Core Web Vitals enhances a webpage’s UX. You can engage with audience members better by offering them an optimized experience. Ultimately, optimizing your Core Web Vitals optimizes your whole website. 

Working With a Digital Marketing Team

Knowing your Google Core Web Vitals is the first step in optimizing your website and overall SEO. Once you are familiar with your metrics, you can take action to fix errors, clean up your webpages, and have an overall optimized website. All of which means your users will have a better experience interacting with your site. 

When your page experience is boosted, your ranking will also increase. This takes time, patience, and effort. But rising in rank is possible with consistent attention to your Core Web Vitals SEO efforts as a whole.

If this sounds like a lot of work, that’s because it can be! If you’re ready for expert help, reach out to the digital marketing experts at Metric Marketing to help you optimize your website’s Core Web Vitals SEO. 

Your website can have the attention and consistency it needs to be at the forefront of your industry’s online domain with a combination of effective website development, content, and SEO strategy.

Contact Metric Marketing to Optimize Your Core Website Vitals

Core Web Vitals are a large part of both your website development and SEO. Our team of digital marketing experts can help you improve your site’s Core Web Vitals.

Having a well-rounded, healthy website takes a team of people. Why not put your trust in digital marketing experts who know exactly how to build an optimized site? Contact our team at Metric Marketing today by calling (734) 404-8714 or filling out our online contact form. We look forward to hearing from you! 

Looking to boost your digital marketing in your industry? Metric Marketing specializes in law firm marketing services, life science marketing services, and software marketing services.