Last Updated on June 17, 2021
Have you heard of the Core Web Vitals? Google gave an update in May 2020 about the Core Web Vitals becoming one of its ranking signals this year.
For the benefit of those who don’t know:
The Core Web Vitals are a set of factors that define a user’s experience on a web page. These factors include Largest Contentful Paint (LCP), First Input Delay (FID), and Cumulative Layout Shift (CLS).
Whether this is the first time you’ve encountered these terms or you’re looking to deepen your knowledge on this SEO update, you’ve come to the right place. This guide discusses each core web vital as well as how to measure them and improve them.
The Core Web Vitals: LCP, FID, CLS
First of all, we need to point out that Google cares about its users’ experiences. And therefore, it is Google’s mission to help business owners create websites that meet their audience’s needs.
Google will launch its page experience ranking signals in May 2021 (see the Twitter announcement), and it will include the Core Web Vitals plus the previous UX-related signals.
The Core Web Vitals include the following:
Largest Contentful Paint (LCP)
LCP measures the time it takes for the largest piece of content, such as an image or text block, to appear on a web page. A website should, ideally, have its largest contentful paint load occur within 2.5 seconds.
First Input Delay (FID)
FID measures the time it takes for the browser to respond to user interaction. For example, clicking a link or call-to-action button on a web page. For this metric, a good score to aim for is less than 100 milliseconds.
Cumulative Layout Shift (CLS)
CLS measures the unexpected movement of elements on a web page that’s still in the process of loading. Picture yourself as a user trying to click on a button, but then you end up clicking something else as other elements appear. This interrupts your experience, and as a result, you’re likely to leave. A good CLS score is less than 0.1.
How to Audit the Core Web Vitals
The first step to optimizing your website for these Core Web Vitals and positively impact your search rankings is to actually measure them. That’s how you’ll know that your website is causing user experience issues.
We’re fortunate that Google provides various tools that collect data on your website and show it to you in an organized manner. Take note, however, that some issues presented will require technical fixes. You may need the assistance of an SEO expert or a web developer.
Start checking your Core Web Vitals with the tools mentioned below.
Google Search Console
The Core Web Vitals can be conveniently measured within the Search Console. It has replaced the old Speed Report. Note that results on mobile and desktop checks may vary. The Search Console shows you URLs that are good and require improvement, including the issue involved. You can then check these URLs individually to gain more insight into each problematic URL.
This is a tool announced on SEJ just this February 2. You’ll need to manually enable Core Web Vitals by doing this: Right-click and choose Inspect Element, then click the icon for Customize and control Devtools (right of the Settings icon). Next, click More tools > Rendering and then click the Core Web Vitals checkbox.
What’s great about this tool is that it lets you conveniently check competitor sites.
With PageSpeed Insights, you’ll simply need to enter a web page URL, click ANALYZE, and wait for the results. It rates your web page from 0-100 with the color red (poor), yellow (needs improvement), or green (good). You’ll see both lab and field data for each metric with corresponding scores, plus suggestions for improvement.
Web Vitals Extension
This Chrome extension checks each metric in real-time for desktop. It immediately shows you the score for a web page that you’re currently on. Just click the extension icon and check the scores of the page at the bottom left corner.
The Experience section in Chrome DevTools enables you to detect unexpected layout shifts. To open DevTools, simply click the Customize and control Google Chrome icon from Chrome’s main menu, then click More Tools > Developer Tools.
How to Improve Your Core Web Vitals
Before the Core Web Vitals roll out in May 2021, make sure that your website is fully prepared. Here are some optimization steps you can take for a good on-page experience.
Use lazy loading.
This method speeds up the initial load time of a web page, thereby improving your LCP score. Here’s a basic idea of lazy loading: A visitor can start using a page because not all elements need to be loaded at once. Instead, these elements show up only when a visitor scrolls through the page. Lazy loading is also beneficial for users who don’t have fast internet speeds.
Add dimensions for your images and videos.
This is a way of letting your user’s browser know the width and height attributes of your web page elements. As a result, unexpected layout shifts are prevented. When it comes to ads and embeddable widgets, you need to style their container accordingly since these elements also cause layout shifts.
Consider upgrading your web hosting.
Some website owners don’t realize that their choice of web host can impact their SEO performance. If your website is too slow and you’re noticing high bounce rates, now is the right time to upgrade your host. Ideally, you’ll want to go for a host that guarantees high uptime and provides flexibility for your web developers or designers.
Avoid using fancy fonts.
Are you a fan of attractive fonts and have been using them for a while now? Because here’s the thing: Third-party fonts often take time to download, which can decrease your page speed, conversions and lower your LCP score. A simple solution would be to use a font available on your Apple or Windows device.
We hope that this guide clarifies any confusion on the Core Web Vitals. The sooner you can audit your site and address potential issues, the better your organic performance (and conversions) as soon as the update rolls out. Do this on top of essential SEO tasks like creating quality content, updating old content, and building quality backlinks — to name a few.
Before joining the team at Ethical Digital, Izaias built a successful SEO agency in São Paolo, Brazil. With over twelve years of experience providing data-driven SEO, he has worked with businesses of all sizes – from SMBs to Fortune 500 companies. After selling his business to travel the world with his wife, “The SEO Hustler” has been helping companies in more than 15 countries and 6 languages thrive in the digital and search world.