SEO: What Are Core Web Vitals?

The Page Experience Update was rolled out starting mid-June 2021 and completed in August 2021. Just like its name, the update is to gauge the page experience by actual users. The page experience update comprises 4 ranking signals: Core Web Vitals, Mobile-Friendliness, HTTPS Security and Absence of Intrusive Interstitials. What are Google’s Core Web Vitals? Let’s talk about what are the three core web vitals elements alongside the core web vitals scores and how we can optimize them. The page experience score consists of 3 Core Web Vitals metrics: the LCP, FID and CLS.

Are Core Web Vitals Important?

The better your core web vitals metrics are, the better your page experience scores will be. You would be surprised how optimizing your core web vitals metrics gives a much needed organic boost to your website.

1. LCP (Largest Contentful Paint)

-Largest contentful paint is the time taken to load the page’s main content, which can be the largest image or text block on the page. Considered to be a more user-centric metric as compared to the First Contentful Paint, which captures the page speed to load the first element of the page. The main content is what users want to see and what users interact with. A good largest contentful paint takes only 2.5 seconds or less which can be challenging for large web pages or if your web page comes with complicated features. 

To know your page speed score using your LCP data is to gauge your user interactions while browsing your webpage which directly goes into the Chrome User Experience Report. Something that we’ve learned is that using “lazy loading” makes loading speed faster. You should consider upgrading your web house to quicken loading speed.

2. FID (First Input Delay)

-First input delay is the time taken for the browser to process the first interaction by the user on the login page or to put simply the initial page load. For example, when a user lands on a web page and clicks on a video to play it, the first input delay is the time taken by the browser to respond to that interaction, which is to play the video. The first input delay measures only the first interaction done by the user input on the web page, any subsequent interaction won’t be counted. A good first input delay takes only 100ms or less.

If your page consists largely of a blog post from a specific topic, first input delay shouldn’t be your concern in terms of the core web vital but it should be if your page is made of media (images, video etc) then watch out for it.

3. CLS (Cumulative Layout Shift)

-Cumulative layout shift is the measurement of how often users experience unexpected layout changes while waiting for the page load. For example, a user wants to click on a video on the web page, but suddenly the video and the entire page moves downwards and the user ends up clicking on the text above it – this is known as unexpected layout shifts. With new User Interface elements, the cumulative layout shift might change as well.

A good cumulative layout shift score is 0.1 or less. When you are aware of the cumulative layout shift, the user’s browser will be updated on exactly how much space the elements will be used up on the page. Tell you what, here’s a small tip from us, to minimize cumulative layout shift, try using a set size attribute dimensions for all your available media which stabilizes the page elements.

How To Calculate LCP, FID, CLS?

Calculating these signals will lead to improving core web vitals on your page but do they use a calculator?

To calculate yours, don’t resort to traditional calculators but instead employ tools to improve the user’s browser provided by Google which includes:

  • Google Search Console– Use Google Search Console to optimize the visibility of your website and to check your indexing status as well
  • Chrome DevTools– Built directly into the Google Chrome browser, use these web developer tools to view and change your page’s CSS.
  • Lighthouse– Lighthouse Performance Metrics is used to improve the quality of your web page.
  • PageSpeed Insights– Using cookies from Google, Google PageSpeed Insights improves your page speed on all devices based on Chrome browser data.

If you’re looking for a third-party tool, try WebPage Test which runs a free website speed test from around the globe using real browsers at the speeds of which the consumers are using. All these tools mentioned provide you with suggestions on how to improve your site performance and optimise for better user experience.

Some suggestions you could receive include image optimization or even to eliminate render blocking resources. You should remember that the performances for different pages will vary and if there are too many pages, you should focus on those elements that are important first.

In conclusion, now that Google has fully rolled out the Page Experience Update, all websites need to start optimizing their Google Core Web Vitals and monitor their website performance. As site owners, a great page experience score including page speed and visual stability with how a user interacts with your page should be your priority. 

Of course, all websites will have to make sure that their website is mobile-friendly using HTTPS security and has no intrusive interstitials as they are all ranking factors included in this update. Get your core web vitals report today and transform how your users interact with your website.