Web Vitals are the speed metrics used for measuring the user experience on web pages. are the subsets of the Web Vitals, which are focused on measuring the following aspects: Core Web Vitals Loading Interactivity Visual stability The Core Web Vitals are not only for better user experience but also for SEO. As of 2021, Google considers it as one of the ranking factors. A good Core Web Vital score would give a boost to the site in ranking. Metrics As of 2023, we have 3 Core Web Vital metrics. The metrics would continue to evolve. You may see some metrics would get added in future. The following are the Core Web Vital metrics: LCP - Largest Contentful Paint FID - First Input Delay CLS - Cumulative Layout Shift LCP LCP is the measure of time taken to load the largest image or text block in the visible viewport. The time taken for the largest image to load in the viewport. Example: The optimum threshold for LCP would be: 0 - 2.5s -> Good 2.5s - 4s -> Needs Improvement \>4s -> Poor FID FID is the measure of time taken between the user interacting with the controls on the page to the browser starting processing the event for the control. Time between the user typing in a textbox and the onChange event called in the browser. Example: The optimum threshold for FID would be: 0 - 100ms -> Good 100ms - 300ms -> Needs Improvement \>300ms -> Poor CLS CLS is the measure of unexpected layout shifts throughout the lifecycle of the page. : When a user is trying to interact with the page and the page shifts due to the introduction of some additional components (like alerts, ads), resulting in triggering some other action, which the user is not intended for. Example The optimum threshold for CLS would be: 0 - 0.1 -> Good 0.1 - 0.25 -> Needs Improvement \>0.25 -> Poor How to measure Core Web Vital Metrics? The following are the ways, in which we can measure Core Web Vital Metrics. 1. Google Search Console In the Google Search Console, we have a called Core Web Vitals, in which we can measure the metrics based on the last 90 days' data of the webpage. This is possible only if you are the owner of the website. Google would verify your ownership of the website, before letting you check the details of the website. menu 2. Page Speed Insight Page Speed Insight is a in which we can measure the metrics just by typing the URL for websites. tool 3. Lighthouse Lighthouse is a tool that comes with the Chrome dev tools in Chrome browsers. We can use this tool to analyze the page load. 4. Chrome Dev Tools We can use the Performance tab in the Chrome dev tools as well to measure the metrics just by checking the checkbox. Web Vitals 5. Web Vital Chrome Extension We can use the Web Vital Chrome Extension (Addon) to the metrics. We can measure just by navigating to the website in the browser. The extension would provide the metric details. measure That's all about the Core Web Vitals. Hope this is useful to you. Looking forward to your suggestions and feedback. Thank you! Also published . here

Walkthroughs, tutorials, guides, and tips. This story will teach you how to do something new or how to do something better.

Optimizing Your Website Using Google's Core Web Vitals

About Author

Comments

TOPICS

THIS ARTICLE WAS FEATURED IN

Related Stories

Untitled Story

A Beginner's Guide to GIT: Chapter 1

3 Simple Ways to Optimize Your Images and Improve Core Web Vitals

5 Tips to Improve the Core Web Vitals of WordPress Websites

7 Ways to Achieve a Faster Core Web Vitals Score

8 Ways to Improve the CLS Score in Google’s Core Web Vitals

A Beginner's Guide to GIT: Chapter 1

3 Simple Ways to Optimize Your Images and Improve Core Web Vitals

5 Tips to Improve the Core Web Vitals of WordPress Websites

7 Ways to Achieve a Faster Core Web Vitals Score

8 Ways to Improve the CLS Score in Google’s Core Web Vitals

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps