Core web vitals for magento 2

A while back, Google made an announcement that caused some stir in the eCommerce world. The search engine giant announced that there will be a change in its algorithms in order to evaluate sites on three additional metrics. These metrics, called Core Web Vitals, will soon become the new ranking signals, starting May 2021.

Essentially, the Core Web Vitals have been designed to help Google to understand the experience its users get when they land on their web page. It is based on three pillars. These are:

  • Largest Contentful Paint (LCP): Many people confuse LCP with the time it takes for a page to upload fully. However, LCP is the time it takes for the largest piece of content to appear on the screen. After checking your LCP sore, make sure to match it with what Google recommends. According to the company, it should be 2.5 seconds or lower.
  • First Input Delay (FID): FID highlights the responsiveness of your website i.e., the time it takes to respond to any user interaction. For example, if a user comes to your website, taps a button, and nothing happens, it’s likely that he/she will leave the site. The lack of response happens because the browser is still doing other work in the background. FID should be less than 100 ms
  • Cumulative Layout Shift (CLS): CLS takes care of the problem that makes online shoppers feel most frustrated. It measures any layout shifts of your website while it loads. An ideal CLS should be less than 0.1.

How Core Web Vitals affect rankings

Google’s Core Web Vitals update is projected to become the new ranking signal, affecting all search results done on both desktop and mobile. For Magento 2 websites, it will be a crucial differentiator that can enable businesses to stay at the top of the competition. But a closer look presents a different picture.

Only 13% of e-commerce websites can currently pass Google’s new metric. This means that for the majority of businesses, Core Web Vitals can pose a serious loss in sales revenue. In such a scenario, it is more crucial than ever to test how a user navigates through your website. Core Web Vitals are also going to be the criteria to appear in Google Top Stories (News results that usually appear at the top of search results). Previously, websites required AMP to appear in this section.

Improving Core Web Vitals for Magento 2

These are some of the ways that can help you to improve your Magento 2 site.

  • Remove unused CSS: Many developers utilize CSS to deliver customization that goes beyond the confines of a particular theme, builder or lay-out. In this case, CSS is utilised to improve the user experience. However, it is vital to keep a tab on any additional CSS that is being implemented as unused codes with no benefits can slow down your website.
  • Optimize image and video: While large immersive elements can have the desired user engagement, it is also essential to ensure the right balance. Large files will not only generate more request but take more time to load. This means that you need to take relevant steps to optimize images and videos, and at the same time, keep larger file sizes to a minimum.
  • Reduce internal server response time: Speed is the name of the game when it comes to Core Web Vitals. You should take every step necessary to reduce your platform’s initial server response time in order to boost your LCP performance.
  • Removal of render blocking resources: Render blocking can contribute to slower response times. This can be easily remedied by modifying code in the <head> of your website. It is also vital to take steps to defer offscreen images.
  • Defer offscreen images: A quick solution for this Lazy Loading. This is an easy way to stop the downloading of unnecessary images.

Tools at your disposal

It’s easy to keep a tab on your Magento 2 site performance with Google’s Core Web Vitals. Here’s a list of essential resources that will help you to adapt to the changes.

  • Chrome UX Report: This API for Chrome allows you to check how your website has performed in the last 28 days.
  • Page Speed Insight: This one is a great tool to get a quick overview of your Core Web Vital scores.
  • Lighthouse: With this, you can get actionable guidance on how to optimize your Core Web Vital scores.
  • Chrome DevTools: This free tool provides you with instructions on how to improve your scores.
  • Web Vital Extension: You can use this extension to see the key user experience metrics for any site that you visit.

The road ahead

It will be a difficult road ahead for slow Magento stores. The ones who will prevail in Google search ranking are fast eCommerce stores that offers a spectacular user experience. It is time to prepare your Magento score for Core Web Vitals.