For those of you interested in learning more about core web vitals, here’s a brief rundown.
First, core web vitals were introduced back in may with a Google update, and display on Google pagespeed, lighthouse, and the search console. They currently (In July 2020) don’t impact search rankings, but in a few months they will, so it’s important that you take them seriously.
The general purpose of core web vitals are this: Google wants to ensure that they only display websites that offer a good user experience. Core web vitals are a quantitative way to measure the user experience on a website. the better your core web vitals are, the more “delightful” the user experience will be on your website (or at least that’s what Google thinks).
A good way to get an understanding of your core web vitals is to generate a page speed report for your website. If available, it will populate with real world data, which is classified as good, needs improvement, or poor. (Green is good while red is poor). three of the four real world data metrics are core web vitals, meaning that you need to get them right.
Each real-world data point measures one aspect of the core web vitals. Let’s quickly run through them, if you want to learn more about them in depth, read this article: https://isotropic.co/what-are-core-web-vitals/
Largest contentful paint
This measures how long it takes for the largest content element to render on your website. Typically, the largest content element is a featured image or headline.
First input delay
cumulative layout shift
Cumulative layout shift is the summation of all individual layout shifts that are not triggered by user input. A layout shift is something that causes content on the page to move. For example, if you click on a button and a menu pushes content down the page, that’s a layout shift.
However, that layout shift is good because it was toggled by the user.
On the other hand, if something randomly pops up pushing content around, that’s a bad layout shift because it wasn’t triggered by user interaction, and it will count towards your cumulative layout shift score.
It’s definitely important to get these right, and some of them have to do with the speed of your site, while others have to do with the actual design.