What are Web Vitals?

Core Web Vitals is an initiative from Google to create clarity on what metrics matter most to users and for SEO.

Here's what Google has to say about Vitals:

Web Vitals is an initiative by Google to provide unified guidance for quality signals that are essential to delivering a great user experience on the web. - web.dev/vitals

Core Web Vitals are a subset of Web Vitals. Google has picked out three as the core main focus. If you get these three right, the rest of the metrics should naturally fall into place.

Cumulative Layout Shift (CLS)

Avoiding shifting the page around as it loads is very important in giving your users a positive experience.

Cumulative Layout Shift is the metric that measures these shifts.

Check out this recording Google showed to emphasize the importance of CLS:

How is CLS measured?

Anytime an element changes size and causes the start position of other elements to change, you've contributed to the CLS.

Below are the ranges for CLS:

https://s3-us-west-2.amazonaws.com/secure.notion-static.com/c7da23e4-732f-489d-86e9-a858e6d7242a/cls_range.jpg

For more info, check out:

Largest Contentful Paint (LCP)

The perceived performance of your site is probably one of the most important metrics – Largest Contentful Paint tries to measure just that.

The Largest Contentful Paint (LCP) metric reports the render time of the largest image or text block visible within the viewport. - web.dev/lcp