Complete Guide to Core Web Vitals

Featured article by Dhruv Chawla, Independent technology Author

With Google’s Page Experience update coming out in May 2021, many online businesses have been anxiously waiting while working on improving their Core Web Vitals. But, what exactly are these Core Web Vitals. In this article, we will be providing you a complete guide to understanding them and how they can boost your rankings.

What are Core Web Vitals?

The fact that you need an optimized website for better rankings isn’t new to anyone. Google has always incentivized websites that are mobile-friendly, secure, and have high speed and performance. Core Web Vitals are the benchmarks your website must meet to qualify for the ranking boost. Here are the three Core Web Vitals:

1.   Largest Contentful Paint (LCP)

This measures the point at which the screen has the largest content element. It doesn’t measure how much time it takes for the web page to fully load, but at when the important part loads. If your web page has a large image and a piece of text, the large image will be the LCP since it is the largest content to load in the web browser. If you get that to load quicker, the website will appear faster. So, in some cases, LCP can be as simple as image optimization. These elements can be any type of content such as images, videos, etc. In the past, metrics such as First Meaningful Content was used that measured the amount of time it took for the first content to appear on the screen.

As per Google, the LCP should happen in the first 2.5 seconds of the web page loading. Everything that occurs under 4 seconds should be improved and everything else that takes longer than that should be considered performing poorly. LCP is a dynamic metric which means the first thing that appears might not exactly be the largest content. Once the largest piece of content appears, the LCP will shift to that. LCP can be affected by several factors including slow server response times, slow-loading resources, render-blocking CSS and JavaScript, and issues on client-side rendering.

2.   First Input Delay (FID)

This Core Web Vital measures the amount of time the browser takes to respond to the first interaction of the user. If the browser reacts faster, the page will appear more responsive. Your page responsiveness is what will decide whether your user has a positive experience or not. The FID will measure every interaction happening while the page is loading including input actions such as clicks, taps, and clicks, but not interactions like scrolling and zooming. According to Google, in order for a page to appear responsible, the FID should be less than 100 ms. If your score is between 100 ms to 300 ms, your website needs improvement and anything above that should be considered poor performance.

Please note that if there isn’t any user interaction, the FID won’t be measured. This means that Google can’t use data from the lab for predicting FID. What they need is field data or data from real users. Also, since users have different types of devices which have different environments, the field data is less controllable. If you want to improve your scores, you have to focus on JavaScript. JavaScript is used for building amazing interactions, but the complex code can also slow your website. While the browser is executing JavaScript, it is unable to respond to input. By improving JavaScript code, you can work on improving your FID score.

3.   Cumulative Layout Shift (CLS)

This is a new metric that determines how the ‘stable’ stuff is loading onto the screen. It measures how often a piece of content jumps around while the web page is loading and by how much. Sometimes, a button loads on the screen. In the background, a large piece of content is still being loaded. When the content fully loads, the button will be pushed down a bit, maybe just when the user was about to hit the button.

Layout shifts are more frequent with ads. For many websites, ads are a lifeline, but in most cases, they are so poorly loaded that the user gets frustrated. Also, websites today have so much going on that they can be heavy to load. Content will be loaded when it is ready resulting in CTAs or content jumping around on the screen and resulting in slower loading content.

The CLS compares frames for determining the elements’ movement. It takes the point at which the shifts happen and calculates how severe the movements were. A score below 0.1 is considered good, a score between 0.1 and 0.25 means your website needs work, and everything above 0.25 is poor.

By combining these vitals, the Google algorithm will be able to incorporate a new factor for ranking named page experience. As a website owner, it is your responsibility to ensure that you have an acceptable score. If you want to know more about the Core Web Vitals, contact Edkent Media SEO Services.