A complete guide on Core Web Vitals for SEOs

August 10, 2021
A complete guide on Core Web Vitals for SEOs

At the end of May 2020. Google announced that somewhere in 2021, Core Web Vitals will become a crucial ranking signal in search, forming a new ranking factor called page experience. 

In this guide, we’ll walk you through the meaning of Core Web Vitals and its three metrics. Plus, we’ll also discuss its importance and how you can measure it using Google Search Console. 

What are Core Web Vitals? 

Core Web Vitals is a mix of three factors or metrics that Google considers while measuring your webpage’s user experience. 

The three factors that makeup Core Web Vitals are discussed below. 

Image source

Largest Contentful Paint (LCP) 

LCP deals with the page’s loading performance, i.e., how fast a page loads from the user’s point of view. Specifically, it assesses how it takes — in terms of seconds — for all the page’s elements to load, such as images or text. For a good user experience, the LCP should happen within 2.5 seconds. 

Image source

Unlike other page speed metrics like First Contextual Paint or TTFB, LCP focuses on the content that really matters when a user opens a webpage. Some common causes of LCP are uncompressed images, slow server response time, client-side rendering, and a large number of JavaScript files. 

The elements or metrics that are considered the LCP are: 

  • Images
  • Image tags 
  • Video elements 
  • Background images with CSS
  • Text elements, such as headings, paragraphs, etc. 

How to optimize LCP? 

Here’s how you can optimize it: 

  • Optimize and compress whatever content you can, as small files mean faster loading. Convert images into lighter formats, or don’t use images unless necessary. For text compression, reduce the number of HTML, CSS, and JavaScript files. 
  • Choose a good hosting service that has a good reputation in the market and provides adequate infrastructure for your website elements. 
  • Avoid JavaScript to load images as it can slow down the process and leads to unnecessary delays. 

First Input Delay (FID) 

First Input Delay is a user experience metric that measures your site’s interactivity. In other words, it looks at how responsive your site is. FID tracks the time — in milliseconds — from when a user taps or clicks on a link or button to the time the browser responds to your action and starts processing it. 

Examples of interactions include: 

  • Choosing an option from the menu
  • Entering your name and email to the field
  • Clicking on the link while navigating the site, and so on. 

According to Google, a good FID score is less than or equal to 100 milliseconds, whereas a poor score is more than 300 milliseconds. The poor FID score is mainly due to unoptimized CSS and JavaScript files. 

Image source

How to optimize FID? 

Here’s what you can do to improve your site’s FID: 

  • Minify the JavaScript so that users can easily interact with the webpage without waiting for the browser to load JS. 
  • Removing any third-party scripts like Google Analytics and heatmaps can work wonders. 
  • Using a browser cache can help page content load faster. 

Cumulative Layout Shift (CLS) 

Cumulative Layout Shift measures the visual stability of the webpage. Specifically, it looks at how often the page’s elements, like images or buttons, remain stable or move around upon loading. Each shift or movement is known as a layout shift. And, the sum of these individual layout shifts makes up the CLS score. A CLS score of less than or equal to 0.1 is considered a good score and indicates a pleasant user experience. 

Image source

CLS is an essential metric in assessing good webpage experience as unexpected movements can irritate the users and cause them to close the website or cancel the purchase. So, make sure your page elements are as static as possible.

The most common issues that affect the CLS score are: 

  • Adding new elements to a webpage
  • Embedded ads or banners 
  • Not testing how the new elements play with the existing ones. 

How to optimize CLS? 

Here’s how you can improve CLS: 

  • Always use size attributes for images, videos, GIFs, infographics, and other embedded visuals. This allows users’ browsers to know exactly how much space that element will take up on that page.
  • The ads elements must have a reserved space to avoid them suddenly appearing on the page. Done wrong, it makes the content push down, up or to the side. 
  • Sure, fonts improve the readability of the webpage and convey your brand style and message. However, each font you use may slow down your page loading speed. This is where optimizing your fonts can help. 

Why are core web vitals important, and how it impacts the ranking? 

As of June 2021, Google considers page experience as an important ranking factor. It is a combination of factors that Google considers crucial while measuring the user experience, such as mobile-friendliness, HTTPS, safe-browsing without any malware on the page, and lack of annoying pop-ups. 

Core Web Vitals form a crucial part of your page experience score. Web pages that rank highly in Core Web Vitals are more likely to experience a boost in search rankings than those that rank lower. 

How can you measure core web vitals using Google Search Console? 

Understanding the new core web vitals metrics and measuring them is crucial for your overall website performance. Google search console has launched a Core Web Vitals report, replacing the old speed report. 

The Core Web Vitals reports help you identify the web pages with similar issues. This means you cannot detect problems on a single page. The Google Search Console will break down the Core Web Vitals as LCP, FID, and CLS for mobile and desktop. 

To get the report, go to your website’s Google Search Console and click the Core Web Vitals button on the sidebar. You can click the ‘Type” option to check the pages that are performing poorly, needing improvement, or are performing correctly. 

Summing up 

The introduction of Core Web Vitals has provided SEO yet another way to measure, track and iterate your website’s speed and performance. If you haven’t already started optimizing your core pages for how they perform according to their metrics, the right time to do it is now. Done right, it can positively impact how your website ranks on the Google search engine. 

Share this blog

Here’s to building an online brand your competitors can only envy.

Ready and rarin’ to realize some real ROI?

Ronak Kothari

Founder & CEO