John Muller from Google posted a stream of tweets yesterday of tidbits he found interesting to share with the SEO community. He said "Since the Core Web Vitals are now in Search Console, I wanted to do a quick round-up of the tidbits I found while researching. Maybe this'll save you a few minutes, or encourage you to test, or to watch a video."
This is what Core Web Vitals metrics include:
The Core Web Vitals include loading, interaction, and annoyance (?) metrics: Largest Contentful Paint (LCP = loading), First Input Delay (FID = interaction), Cumulative Layout Shift (CLS = stability, the lack of which I find annoying :-)).
— 🍌 John 🍌 (@JohnMu) May 28, 2020
This is where you can dig deeper into these metrics:
There's a ton of information about them starting at https://t.co/LPlEXdVKxy - that's where I tend to go. LCP is similar to the page loading speeds you've probably looked at, but it tries to figure out when the primary elements are visible, which is what users care about.
— 🍌 John 🍌 (@JohnMu) May 28, 2020
Video with tips on Largest Contentful Paint / LCP:
There's a bunch about Largest Contentful Paint / LCP at https://t.co/gACbV8xs0j , tips on how to improve at https://t.co/r79NhK3eml , and a video with tons of details at https://t.co/U7o4vsWij0
— 🍌 John 🍌 (@JohnMu) May 28, 2020
Why First Input Delay is cool:
First Input Delay / FID is cool because it measures responsiveness - what's the user's first impression when they try to interact with your page? For me, it's usually the point at which I turn back and try other sites, even if I give them the benefit of a doubt during loading.
— 🍌 John 🍌 (@JohnMu) May 28, 2020
More help docs on this:
For FID we have docs at https://t.co/hUEO9RC6nH (these URLs are kinda predictable, huh?), and tips on optimizing at https://t.co/ZAAxt0xA2T . An interesting quirk of this metric is that you need a user to measure it. pic.twitter.com/PQKkMQzKJ5
— 🍌 John 🍌 (@JohnMu) May 28, 2020
The all new Cumulative Layout Shift / CLS:
Then there's the new one, Cumulative Layout Shift / CLS. It's calculated by taking the fraction of the page that moves during loading times the fraction of the position it moves. I find it totally annoying when pages do this, especially if I scroll through a longer one. Ugh. Bye. pic.twitter.com/S6uhMxYtlf
— 🍌 John 🍌 (@JohnMu) May 28, 2020
Video on Cumulative Layout Shift / CLS:
There's more about CLS at … https://t.co/0mA8zDDof7 and on how to optimize for it at https://t.co/wKHSgCG8Jo -- and a great video with much more information here: https://t.co/dPWbcRKXlo
— 🍌 John 🍌 (@JohnMu) May 28, 2020
But there is more in these tools:
So, apart from Search Console, where can you see these metrics? They're coming (or in) a lot of our tools, such as Chrome Dev Tools, Lighthouse, CrUX, Page Speed Insights, etc. They're also in https://t.co/s55K8LIOKY , and there's a JS library if you want to measure for yourself.
— 🍌 John 🍌 (@JohnMu) May 28, 2020
Know the difference between lab and field data:
With these tools, there's a difference between lab (when you test it yourself) & field data (when you see what users see, on aggregate). It's probably worth checking both, so you don't miss anything obvious.
— 🍌 John 🍌 (@JohnMu) May 28, 2020
Don't let your users abandon your pages:
The buckets for green to red are based on various studies and meant to be achievable (and already achieved). https://t.co/IZeNdiDAZN has some about that, as well as https://t.co/HH8bJ33BuA . The doc mentions "users are 24% less likely to abandon page loads" - which is niiice.
— 🍌 John 🍌 (@JohnMu) May 28, 2020
That's pretty much everything I've run into so far. Adding new metrics is always hard, but it's nice to see these being used in so many places.
— 🍌 John 🍌 (@JohnMu) May 28, 2020
Caveat: I'm not on the Chrome team, this is all just based on the public documentation!
That is about it.
Forum discussion at Twitter.
This post was pre-written and scheduled to be posted today, I am currently offline.