Webbuildingnow.com

Blog

What are the Google Core Web Vitals

Google Core Web Vitals

When you are optimizing your website for search engines, you probably will come across the Google Core Web Vitals. The Google Core Web Vitals consists of a view metrics, which help Google rank your website in their search engine. It therefore gives a specific ranking for the technical site of your website. The goal of the Core Web Vitals is to increase the user experience for searching users. As Google likes to put it:

“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 Vitals

Google is in essence giving everybody the same guidance to create a website with good user experience. Websites which are not mobile ready, take a long to load and have a bad user experience will generally rank lower than websites which do comply with the Web Vitals.

Why the Google Core Web Vitals are important for search engines

The Google Core Web Vitals basically test your website before an user visits it. Therefore it has a big impact on your Search Engine Optimization (SEO). It does this by measuring a few metrics and testing them live on your website. By comparing these metrics to set standards by Google, the search engine knows if your website is delivering a good user experience.

It is important to deliver a good user experience with your website. Search engines want to help users find the information they need. If you have a website about a topic which has a lot of competition, the search engine could choose to rank a website higher based on the Web Vitals. It therefore is part of the technical part of Search Engine Optimization (SEO).

Google Core Web Vitals

What are the Google Core Web Vitals

The Google Core Web Vitals focus on three aspects which impact the user experience. Do mind that the Core Web Vitals could change in the future, because the internet is always in development. The three aspects where the Core Web Vitals focus on are:

  • Largest Contentful Paint (LCP) (Loading of your site)
  • First Input Delay (FID) (How fast can users interact with your site)
  • Cumulative Layout Shift (CLS) (When does the layout stop shifting)


These three aspects together create the Google Core Web Vitals and are important for creating a good website. There are multiple tools which can help you measure the Web Vitals, such as PageSpeed Insights and Google Search Console. These tools will measure the Core Web Vitals and give advice on which part of your website you need to improve.

The Largest Contentful Paint (LCP)

The Largest Contentful Paint (LCP) measures how long it takes for the biggest image or text block to load on the top of your website (above the fold). This metric is useful, because it shows how long a user has to wait before seeing the main content on your webpage. When your website takes long to load the Largest Contentful Paint (LCP), it can negatively impact the user experience on your site.

A good LCP should load within 2.5 seconds. This means when a visitor visits your website and loads a page, the main image or text block should load within that timeframe. When the LCP is between 2.5 and 4.0 seconds, you will need to improve the LCP. More than 4 seconds is considered poor by the Google Core Web Vitals.

Largest Contentful Paint LCP Web Vitals

How to optimize your Largest Contentful Paint (LCP)

There are multiple ways you can optimize the Largest Contentful Paint on your website. The simplified explanation is making things smaller on your website. Bigger pictures take longer to load than smaller pictures. Therefore it is important to think about the size of your webpage. To optimize the LCP you can try the following optimizations:

  • Compress pictures on your website (With tinypng.com for example)
  • Remove, minify and compress unused CSS (WordPress plug-in WP Rocket)
  • Make use of a Content Delivery Network (CDN)
  • Load LCP resources first (with the preload function in the style sheet)


Your webhosting provider could play an important role in optimizing your LCP. A Content Delivery Network (CDN) could be integrated in your hosting plan, so you only have to active it. The webhosting provider you choose also influences the general speed of your website, which has an impact on the Google Core Web Vitals.

Compressing pictures is easy with online tools. You can easily shave off 50% of the picture size using picture compressing websites. Remove, minify and compress unused CSS can be an annoying task. If you are using a WordPress website you can use WP Rocket to do this for you. This way you can easily improve your websites Largest Contentful Paint. You can find a more in-depth guide on optimizing the LCP here.

The First Input Delay (FID)

The First Input Delay (FID) is measuring the reaction time of your website. When someone for example pushes a button, you want your website to react as fast as possible. The First Input Delay (FID) focusses on the time it takes for your website to interact on the users input. These interactions can be a press on a link, button or any other event which triggers something on your website.

A good FID score should be 100 millisecond or less. When your FID score is 300 milliseconds it is considered poor by the Google Core Web Vitals standard. The First Input Delay (FID) is considered important, because it can annoy users when it takes a long time to interact with your website.

First Input Delay FID Web Vitals

How to optimize your First Input Delay (FID)

There are multiple ways you can improve the First Input Delay. In basic terms you have to make your website as light as possible. Loading excessive JavaScript’s can increase your First Input Delay, because your website has to load and execute all those scripts. The following optimizations can help to improve the First Input Delay:

  • Reduce third-party code (JavaScript and other extensions)
  • Reduce JavaScript execution time (WP Rocket can be helpful for WordPress sites)
  • Reduce the work your website has to do when loading a page
  • Do not make too many requests and transfers when loading a page


A lot of JavaScript on your website will impact the First Input Delay. Reducing the amount of JavaScript or loading it later on will help in improving the FID. For WordPress websites you can use a caching plug-in called WP Rocket, which makes it easier to improve your First Input Delay.

Caching plug-ins can make your website a lot faster. Do note that a few options could brake a part of your website. When implementing a caching plug-in, always check incognito with your web browser if your website is behaving as expected. For more information about improving the FID you can read this article.

Cumulative Layout Shift (CLS)

The Cumulative Layout Shift (CLS) is making sure your website does not have annoying layout shifts. There is nothing more annoying when you interact with a site and the layout starts to shift. It has a negative impact on the user, because it can make them click on things they do not want.

A good Cumulative Layout Shift (CLS) score should be 0.1 or lower. When it is 0.25 it is considered poor by the Google Core Web Vitals. The layout shift score gets calculated the following way:

layout shift score = impact fraction * distance fraction (Core Web Vitals)

You can find more information about the CLS here.

Cumulative Layout Shift CLS Web Vitals

How to optimize your Cumulative Layout Shift (CLS)

The layout of your website can shift if you have to load in resources which are bigger than what the web browser expects. Therefore it is important to give the web browser some guidelines to how big your content is actually going to be. A few options to improve your CLS score are:

  • Include the image and video pixel sizes or reserve the required space. This way the web browser knows how much space to allocate to your content
  • Do not insert new content above existing content when the user interacts with your website. This will push the existing content down, which has a negative impact on the user experience.
  • Limit the amount of animations and/ or make them transition. This will give the user a better user experience on your website.


For more information about optimizing the Cumulative Layout Shift you can take a look here.

Summary

The Google Core Web Vitals focus on improving the user experience on websites. It consists of three aspects which can help you optimize your website better. The Google Core Web Vitals play an important role for your Search Engine Optimization (SEO), because a good score helps your website rank better. Improving the Core Web Vitals is therefore an important part of creating your website.