Core Web Vitals Update: Is your eCommerce store ready for?

August 3, 2021

Is your eCommerce site ready for Google Core Web Vitals Update 2021?

Not sure? Let’s sort it out together!

I hope, you run your eCommerce business successfully. But, are sure you have a well SEO-optimized website?

To be honest, when’s the last time you checked that everything was working right and you were getting the right results in terms of traffic and online authority?

Currently, many eCommerce websites don’t take SEO seriously. For sure, eCommerce SEO is not easy, and it may take a lot of time and effort to set up. But if set up properly, it will bring you quality traffic that converts.

At MageCloud, while doing hundreds of Magento site audits over the years, we usually come across the same common technical SEO issues over and over again.

Earlier, we created and shared our technical SEO checklist to help you find the SEO errors that hurt your Magento online store and a few tips on how to fix them.

Magento Technical SEO Issues You Shouldn’t Be Ignoring

Google Core Web Vitals

Today, we want to pay attention to Google Core Web Vitals as they can help improve your website’s ranking in search engines, provide your website more recognition as well as keep your website clean and well-organized, providing a hassle-free user experience.

  • NOTE
  • In mid-June, Core Web Vitals became Google ranking signals. At the end of August, page experience indicators will become full-fledged ranking factors alongside others, like qualitative and relevant content, mobile-friendliness, or HTTPS. [Source: Google]

Seems, now it’s high time to dig deeper and examine Core Web Vitals to understand the importance for your eCommerce business.

So let’s go!

Table of content

What are Core Web Vitals?

The Importance of Core Web Vitals for SEO

Components of Core Web Vitals

How to check Core Web Vitals on Google?

Recap

What are Core Web Vitals?

First, what even are the Core Web Vitals?

A handful of times each year, Google makes updates to its Core Algorithm. And each of those updates is designed to optimize the experiences of searchers. But such changes can dramatically impact the search engine results page (SERP) and your ranking in the TOP 10 of Google, if you are there.

On May 28, 2020, Google announced something they called Core Web Vitals. Core Web Vitals are the important characteristics you need in your website’s total usage.

Core Web Vitals
is a set of standardized metrics from Google used to measure user experience and improve it.

Page experience signals

The concept of judging websites by what a user feels when interacting with a page isn’t new. Google has already been using some page experience signals. These include:

  • Responsiveness or mobile-friendliness: it checks how your online store loads on the mobile and prioritizes the mobile version while ranking;
  • HTTPS: having SSL certificates is essential while selling on the Internet;
  • Safe browsing: each eCommerce store must be safe and any malicious activity, links, or products can penalize your store from the search engines;
  • Intrusive Interstitials: absence of officious popups, cause interstitials, or the large pop-up, ads blocking the main content of the eCommerce website, what is a poor user experience.

However, these signals couldn’t capture those aspects of UX which relate to web performance. With the roll-out, three new metrics, known as Core Web Vitals, will be combined with the existing UX signals to a unified Page Experience.

These vitals measure your website’s user experience, and there are three main factors Google is looking for: page loading performance, ease of interaction, and visual stability (from a user’s perspective).

Page-Experience-signal-metrics-CWV

Image source: Google

Each of these metrics provides its own perspective on different elements that impact how users interact and engage with a website.

Core Web Vitals offer more opportunities for a rankings boost.

But only if you get it right.

It’s important to remember that these metrics don’t tell the whole story about the user experience on a website, but each metric can be pieced together to help developers troubleshoot in an efficient and methodical way as well as to help site owners identify and fix technical issues across their website.

The Importance of Core Web Vitals for SEO

As user expectations continue to rise to higher and higher standards, most sites are not keeping up. These updates are simply a clear hint to the whole digital community and online business owners particularly, that it’s time to begin prioritizing user experience.

  • Statistics
  • According to Google, visitors are 24% less likely to abandon the site, if it adheres to these new standards.

For example, take a look at the screenshot from the PageSpeed Insights report on the Magento website – Christian Louboutin.


As you see, all CWVs on mobile for this prominent store is far from perfection.

ChristianLouboutin-CWV

Image source: Google

In order to pass Google’s Core Web Vitals, your site must score a “Good” in all these categories: loading speed, responsiveness and visual stability.

If a page does not pass, it risks the ability to be given lower ranking scores than more usable pages.

  • Statistics
  • Only 4% of all websites passed all Core Web Vitals tests, rank as “good” and are ready for the update.
    [Source: Searchmetrics]

Seems, your question is:

How Core Web Vital new update will affect my eCommerce store/marketplace rankings?

While original and relevant content will always be stellar for SEO, Google will also be evaluating website performance based on how well users interact with your website.

Actually, the weight of this change will initially be small for all sites but will likely increase over time as more and more websites adopt Google’s best practices for adhering to its Core Web Vitals.

Any business, including yours, that values brand awareness and visibility should care about CWV and optimize the eCommerce store for the upcoming Core Web Vitals update.

That way, you will stay ahead of the competitors.

However, it is important to note that these updates should not dramatically impact your site’s organic visibility it is following SEO best practices. Google highlights that page experience is one of the other 200+ factors that they use to rank websites.

This means that well-written and relevant content is still crucial and your website should provide the best user experience in addition to nice web design and quality content.

Components of Core Web Vitals

Let’s take a look at the three main metrics included in Core Web Vitals to improve your websites today!

Core Web Vitals focuses on loading, interactivity, and visual stability, and here are the three current components of Core Web Vitals consequently:

    • LCP – Largest Contentful Paint
    • FID – First Input Delay
    • CLS – Cumulative Layout Shift

 

Ecommerce, both B2B and B2cC, Core web vitals reports come in two segments:

  1. Desktop
  2. Mobile

 

You will get most of such information on the web.dev website.

Core Web Vitals show whether your site is actually usable for visitors. Core Web Vitals could not only influence the position of your online store in search engine results but also prompt weak points really worth fixing.

Thus, eliminating these problems will simultaneously raise your online shop in SERPs and ameliorate other critical metrics: the bounce rate, conversions, and so forth.

Largest Contentful Paint (LCP) — loading

  • Statistics
  • 1-second delay reduces customer satisfaction by 16%.

Largest Contentful Paint is a Core Web Vitals metric that site owners can use to assess user experience by determining how quickly the biggest piece of content on the page appears on a mobile/desktop screen.

 

The largest element is usually going to be a featured image or maybe the <h1> tag but could be any of these:

  • Images: either <img> element or <image> element inside an <svg> element
  • Video poster images – the images inside <video> elements
  • Background images
  • Block-level text
  • <svg> and <video> may be added in the future.

Site owners should aim for LCP within 2.5 seconds of when a page starts loading.

First Input Delay (FID) — interactivity

It can be also frustrating when trying to click something and nothing happening on the page.

FID is the time from when a user interacts with your page until the page can respond. You can also think of it as responsiveness. This does not include scroll or zoom.

Example interactions:

  • clicking on a link or button
  • inputting text into a blank field
  • selecting a drop-down menu
  • clicking a checkbox.

 

Cause of FID

JavaScript competing for the main thread. While a task is running, a page can’t respond to user input. This is the delay that is felt. The longer the task, the longer the delay experienced by the user.

Not all users will interact with a page, so they may not have an FID value. This is also why lab test tools won’t have value because they’re not interacting with the page. Use Total Blocking Time (TBT) instead.

Developers need to reduce the time users spend waiting for a browser to respond to their input to improve engagement and usability across the site.

Site owners should aim to provide a good user experience with FID below 100 milliseconds.

Cumulative Layout Shift (CLS) — visual stability

I believe you will definitely agree that it’s pretty annoying and frustrating when you try to click something on a page that shifts and you end up clicking on something you didn’t intend to.

So, Cumulative Layout Shift is a metric that identifies links or buttons that shift after a web page has loaded, and reflects the level of difficulty users will experience when trying to engage with elements on your site once a page renders. It takes into account the size of the content and the distance it moves.

CLS shows how you can improve usability, drive click-through rates, and improve online sales.

One major issue with the metric is that it continues to measure even after the initial page load. Google is taking feedback on this particular metric, so we’ll likely see some changes to it in the future.

Common causes of CLS include:

  • Images without dimensions
  • Ads, embeds, and iframes without dimensions
  • Injecting content with JavaScript
  • Applying fonts or styles late in the load

 

Site owners should maintain a CLS of 0.1 or less.

Other Performance Metrics

Along with the main metrics listed above, developers can also understand how their code impacts the way users consume content on their site.

So let’s take a quick look at a few other metrics you can use to understand the experience visitors have on your site.

  • First Contentful Paint (FCP) — measures how long it takes for a user’s browser to render DOM elements (images, non-white <canvas> elements, and SVGs). This metric identifies render-blocking resources and is measured in seconds.
  • Time To Interactive (TTI) — calculates the amount of time it takes for the content on a page to become functional for it to be fully interactive. TTI helps you identify pages with unnecessary JavaScript and is measured in seconds.
  • Total Blocking Time (TBT) — helps site owners assess how long a web page responds to specific user input. This metric will identify pages with unnecessary JavaScript and is measured in milliseconds.
  • Speed Index (SI) — shows you the average time that content on your site takes to display to a user. This metric will identify excessive JavaScript on a page and is measured in milliseconds.
  • PageSpeed Score — a single metric that considers all of the important user experience metrics in Core Web Vitals. This score uses an aggregate scoring system across all mobile or desktop visits. 

 

While these metrics are simplified in the Page Performance Score metric, developers can reference scores in each category based on the specific score of 90 (good), 50–90 (needs improvement), and below 50 (poor).

Now, let’s see how you can measure Core Web Vitals to optimize for each vital.

How to audit Core Web Vitals and prioritize the fixes

Understanding what makes up your core web vitals and being able to accurately measure these aspects are distinct challenges.

Fortunately, the assessment of Core Web Vitals for any site is not secret knowledge. Conversely, Google explains the essence of Core web vitals indicators, provides free tools to evaluate them and gives helpful advice on coping with the detected troubles.

There are a handful of ways to see if your page is categorized as “poor URLs,” “URLs need improvement,” or “good URL. You can both examine your website and get some advice on how to make improvements.

We’d recommend you to use one of the following (all of them are free):

Image source: Web.dev

 

Google tools for web developers support measurement of Core Web Vitals:

  • PageSpeed Insights: analyses both mobile and desktop pages for lab and field issues and generates suggestions to make those pages faster.
  • Chrome UX Report API: provides customized reports on your site’s performance
  • Chrome DevTools
  • Lighthouse: measures and tests page updates and optimizations to help improve the correctness, quality and performance of your web apps.
  • Web Vitals Extension: measures the Core Web Vitals metrics on your site in real-time on Google Chrome. 
  • Google Search Console: a much broader tool that will measure search traffic and help you make optimizations.
    Note: Using Google Search Console(GSC), you can see the data for many pages at once. But at the same time the data is a bit delayed and on a 28 day rolling average so changes may take some time to show up in the report.

 

More Apps:

  • GTmetrix: a free tool that monitors your site’s performance, reveals why it’s slow and proposes optimization opportunities.
  • WebPageTest: a web performance tool that uses real browsers to access web pages and collect timing metrics.
  • Layout Shift GIF Generator: a tool to measure CLS.

 

These free tools will help provide an excellent starting point for optimizing your core web vitals and will equip you with the knowledge and data required to begin to make improvements.

We anticipate that Google will continue to add elements to its list of page experience factors over time, so if you have not considered evaluating your website’s usability, the time to act is now.

 

Finally, here is a list of our recommended actions to take:

  • Conduct an audit of your website. An audit will help evaluate the current state of your website and identify pages that need updating and optimizing.

Before optimizing your website to make it “easier” for Google

  • Use the findings of the website audit to inform page optimizations to obtain a “Good” score for all three of the Core Web Vitals to ensure your page continues to rank high in the SERP.
  • Continue to evaluate and optimize your website to monitor its compliance with the Core Web Vitals and any other page experience factors that Google may implement over time.

Recap

In a nutshell, Core Web Vitals produce a report of your website’s performance and provide a useful framework for auditing and improving the overall experience for visitors and boosting ranking on Google.

I believe, now you definitely want to measure your current performance and optimize your platform, if necessary, for your users to have a better experience. And not just for ranking, revenue but to have a useful, usable and enjoyable plus-one website for visitors.

To do that – you should work with your developers.

In case you’re on your own and need help – contact us, we at MageCloud are here for you to help.

 

 

***

Partner With Us: If you would like to know how MageCloud can help your business, please contact us to start discussing your requirements. For more information, email us at [email protected].

 

Want to learn more?

Let us prove our skills and provide you video review for your ecommerce site. Feel free to schedule meeting with our team.
Cities we operate in