HomeSEO

Core Web Vitals: What They Are and How to Improve Them

Like Tweet Pin it Share Share Email

Core Web Vitals are essential factors that Google takes into consideration when it evaluates your website’s user experience. There are three separate page speed and user interaction measurements that go into Core Web Vitals.

Source

These are:

  • Largest Contentful Paint [LCP]
  • Cumulative Layout Shift [CLS]
  • First Input Delay [FID]

Core Web Vitals are part of Google’s overall evaluation of ‘page experience’. In essence, they are how Google’s algorithm comes to terms with your UX.

If you’re wondering about the performance of your Core Web Vitals, then you can check them out in the ‘enhancements’ part of your Google Search Console profile. There you can see what Google thinks of your Core Web Vitals.

What Makes Core Web Vitals Important?

Machine learning is being utilized to streamline business processes more and more each day. The mother of all machine learning services is Google – which as of June 2021 uses page experience as an official ranking factor. This factor is a combination of your site’s Core Web Vitals with a few more factors added on top.

Page experience includes a variety of factors Google regards as crucial to your users’ experience, like:

  • Your site’s Https
  • How mobile-friendly your site is
  • If your site is safe to browse and doesn’t contain malware

Naturally, Core Web Vitals make up a solid chunk of this score. In fact, it’s quite likely that they are the biggest factor considered in Google’s page experience evaluation.

Simply scoring well in terms of page experience isn’t a magical way to get to the top of Google’s rankings. Page experience is just one of around 200 factors Google uses to rank your site.

If you’re looking to get ahead of the pack and enhance your customer value management, then improving your Core Web Vitals now is a good idea.

In this article, we’ll go over all of the Core Web Vitals, as well as consider what you can do to improve them.

Largest Contentful Paint [LCP]

The largest contentful paint describes the amount of time it takes for your page to load from a user’s point of view.

Put simply, it’s the time that passes between a user clicking a link and seeing the content on-screen.

Now it’s important to consider that LCP is quite different from most other measurements of page speed. Most of them, like first contentful paint, aren’t accurate representations of a user opening your page. Plus, factors that are out of your control may affect your visitors’ internet speed, like if it’s faster due to their using a VPN or slower due to viruses or spyware.

Barring any interference by those factors, LCP is essentially a measure of the time it takes for your user to be able to see and interact with your page’s content.

You can use Google PageSpeed Insights to see your LCP. This is the simplest way to do it, and it edges out tools like WebPageTest by giving you factual performance data.

With that being said, the best way to see LCP is through the Google Search Console. The data in the GSC is the same as the data provided by PageSpeed Insights; however, the GSC gives you a breakdown of your LCP on the entirety of your website, rather than each page individually. It’ll give you a list of URLs on your site that are good, bad, or middling.

This is because Google categorizes LCP into three different boxes:

  • A ‘Good’ rating requires that you hit LCP at around 2.5 seconds
  • If LCP take up to four seconds, it ‘Needs Improvement’
  • Anything longer than four seconds is categorized as ‘Poor’ LCP

Now, this factor can be quite difficult to change, especially for those pages with an abundance of features, or simply those that are very large in magnitude.

The first steps you should take when improving LCP is to clean up the webpage’s code, as well as take a look at the media presented. If you have a page with several high-res images, you should consider removing a couple to get a faster LCP. Simply setting up a content delivery network [CDN] or similar is generally not enough to improve LCP.

So, what else can you do to get your website’s LCP as low as possible? Here are a few tips:

  • Minimize running third-party scripts – Studies have shown that every third-party script running on a page slows it down by around 34ms. 
  • Get better web hosting The better your hosting, the quicker your load times [including LCP] will be.
  • Take advantage of lazy loading Lazy loading, or asynchronous loading, is when your images load only as users scroll down your page. This means you can ensure a much faster LCP.
  • Get rid of some elements You can use Google PageSpeed Insights or GSC data to determine if a single element is having a significant effect on your LCP.
  • Minimize CSS Having a lot of bulky CSS on your webpage can lead to a large LCP increase.

First Input Delay [FID]

The second Core Web Vital is FID or first input delay. Once your page has hit LCP, Google will look at how well your users can interact with your page.

Much like LCP, FID is a rather simple measurement. It is simply the time it takes for a user to interact with the page.

Now, these interactions can be almost anything. They range from picking options from a menu or putting in their email into your registration field, to initiating cloud calling with customer support or a sales rep. Although it is such a wide metric, FID is still extremely important to your Core Web Vital performance.

The reason Google values FID so much is that it’s an excellent metric to see how actual users will interact with your site.

Much like LCP, Google has a variety of different criteria for determining whether your FID is up to par:

  • 0-100ms is a ‘Good’ FID
  • 100-300ms is a ‘Needs Improvement’ FID
  • Over 300ms is a ‘Poor’ FID

Although FID is a measure of how long it takes for something to happen on the page, making it technically a page speed score, it also measures how long it takes your users to interact with your page in a meaningful way.

Now, pages that have basically no room for interaction, like blog posts or something similar, won’t need to pay much attention to FID. After all, the only interaction available is scrolling up and down, and zooming in or out.

For some websites that are heavily rooted in content, you might find that the Google Search Console might not even give you a measure of your FID. 

On the other hand, for pages that are almost completely made of interactable elements like login, sign up, or similar pages where you want your users to click on something quickly, FID is one of their most important Core Web Vitals.

For example, a login page doesn’t really care about how long it takes for all its content to load [LCP], but it cares a lot about when the user can start typing in their details [FID].

So, what can you do to ensure a good FID score? You can try implementing the following changes:

  • Minimize JavaScript While JavaScript is loading, it’s nigh-impossible for a user to properly interact with your page. Hence, by minimizing the JS on your page, you can get a better FID.
  • Minimize third-party scripts Much like LCP, third-party scripts harm FID as well.
  • Take advantage of a browser cache Having a browser cache will help all of the content on your page to load quickly, helping you get through loading JS much quicker.

Cumulative Layout Shift [CLS]

The CLS is essentially a measure of your page’s visual stability while it’s loading. If page elements are moving around a lot while loading, that means you have a high CLS.

Low CLS lets your users remember where links, images, and fields are before your page has fully loaded, and it minimizes the chances of them clicking something like an ad for vape juice by accident.

  • A CLS of 0.1 or less is ‘Good’
  • Up to 0.25 ‘Needs Improvement’
  • Anything past that is ‘Poor’

In order to minimize your CLS score, you can:

  • Use set size attribute dimensions Doing this will let your user’s browser be aware of how much space a given element will take on-page. This will prevent it from changing this on the fly while the page is loading.
  • Reserve ad space If you don’t have allocated space for ads, ads might pop up on the page, pushing the actual content to a different location on-screen.
  • Add elements under the fold By inserting UI elements under the fold, content that the user expects to stick in place won’t go down.

The Bottom Line

Core Web Vitals is now very important for your Google ranking. Given that the top three Google searches get 75.1% of traffic, enhancing your Core Web Vitals is an important part of a good sales methodology. It’s a great idea to take action now to improve your Core Web Vitals. Reports are already available, so you can take measures to ensure an excellent user experience.