A Simple Introduction To Google’s Core Web Vitals!

September 30, 2021

8 minutes Read

In the online world, setting up a website for success takes work. There are various aspects to creating the perfect website, and one of the most critical parts is taking care of Google’s core web vitals. So what are Google’s core Web Vitals? Well, that’s what we will talk about here. At Freelancers Hub, we pride ourselves on our ability to provide comprehensive digital solutions, and one of our specialties is optimizing Google’s core Web vitals. 

From checking the core web vitals to creating reports that showcase where you can improve. Due to our experience, we know all there is to know about core web vitals and believe you should know all there is to know about it. 

Google’s core Web Vitals are a set of specific factors that the tech giant considers vital in a webpage’s overall user experience. It’s made up of three main factors page speed and user interaction measurements. The factors are largest contentful paint, first input delay, and cumulative layout shift. 

In short, Google’s core web vitals are factors that it considers when evaluating “page experience” scores. You can find the core web vitals in the “enhancements” section of your Google Search Console account. In the following passages, we will dive deep into factors and help you understand why it’s crucial. So without further delay, let’s check them out!

The Importance Of Core Web Vitals

Google has made page experience an official Google ranking factor. Page experience considers a wide array of elements for user experience. The factors include:

  • HTTP
  • Mobile-friendliness
  • Lack of interstitial pop-ups
  • “Safe-browsing”

Core web vitals are an essential part of that score, and from what we’ve seen, Core web vitals are considered the most significant chunk of your page experience score. Now, you have to keep in mind that having a perfect page score won’t automatically catapult you into ranking no. 1 on Google. Google has been evident that page experience is one of several factors. 

From our experience, it is one of 200 or so individual factors that they use to rank sites in search. Now, don’t worry about your ranking. You can start fixing your web vitals right now to help your ranking, and that’s why we decided to create this guide. So let’s check out the three factors that will help you optimize the core web vitals for your web pages!

Largest Contentful Paint (LCP)

LCP is the time taken to load the page from the point of view of an actual user. What it means is that it’s the time taken from clicking on a link to seeing the content on-screen. This page speed factor is different from others like TTFB and First Contextual Paint. It doesn’t necessarily tell what it’s like for a user to open up a webpage. 

Now, LCP deals with something much more critical when it comes to page speed, and that’s being able to see and interact with your page. You will find all about your page’s LCP on Google’s Page Insights. It’s conducive to finding the areas where you can improve. It’s better than most other tools because it allows you to see how your page has performed in the real world based on Google Chrome browser data. 

Largest Contentful Paint (LCP) - core web vitals report - Freelancers HUB

It would be best to look up your LCP in Search Console because, like Page Insights, it comes from the Chrome User Experience Report. Unlike Page Insights, however, Chrome User Experience Report shows you LCP data on your entire site. So you don’t have to analyze random pages one by one. Instead, you get a complete list of good, bad, and somewhere in between URLs. Now, if you don’t know how to improve your LCP, don’t worry. 

Google has an LCP guideline that breaks down LCP speed into three sections, Good, Needs Improvement, and Poor. Overall, the average for every page on your site is to hit LCP within 2.5 seconds. And that means it can be a challenge for large sites that have plenty of different features. 

Keep in mind that improving LCP isn’t as simple as installing a CDN. Sometimes you may have to remove some images and clean up the page’s code. It may seem hard work, but trust us, it is worth the trouble. Here are some things you can do to improve your LCP score:

  • Remove unnecessary third-party scripts. One Backlinko study found that third-party scripts slowed the page down by 34ms.
  • Upgrade your web host. Remember, better hosting always means faster load time and an overall better LCP score. 
  • Make sure to set up lazy loading. It’s a feature where the images only load when scrolling down the page. That means you have a faster LCP. 
  • Make sure to remove large page elements. You can check out Google PageSpeed Insights to determine which page elements are slowing down your site load time. 
  • Make sure to minify your site’s CSS. Bulky CSS will slow down your LCP

First Input Delay (FID)

Now that the first part is done, let’s check out the second part of Google’s core web vitals, and that’s first input delay or FID. By now, your website has achieved FCP, but the question is can users interact with your page? What FID measures are the time it takes for a user actually to interact with your page. Here are some examples of interactions include:

  • Choosing an option from the menu.
  • Clicking on a link in the site’s navigation.
  • Entering email into a field.
  • Opening up “accordion text” on mobile devices.

FID is important because Google takes into account how people interact with the site in real-life scenarios. Like LCP and FCP, there are specific criteria that constitute good FID. Now, since FID measures how long it takes something to happen on a page so basically, it’s a page speed score. But it goes deeper than this as it also measures the time it takes for users to do something on the page. 

Now, for a 100% content page like a blog post or news article, FID isn’t a big deal. The only real interaction in these pages is scrolling down the page and pinching to zoom in and out. Google Search Console often doesn’t even showcase FID reports for these sites. That’s mainly because these sites don’t really have any login pages or other pages that someone needs to input right away. 

If you check login pages, sign-up pages, or other pages where users need to click on something quickly, you’ll see they have huge FID. For pages like this, load time isn’t as important. What matters most is how fast people are typing in login details. Here are some ways you can improve your site’s FID:

  • Minimize or Defer JavaScript. Remember that users can’t interact with a page while the browser is loading up JS. That’s why minimizing or deferring JS on pages is the best way to get your FID scores up.
  • Remove all non-critical third-party scripts. Third-party scripts can negatively impact FID as it does with FCD.
  • Use browser cache. It helps load content on pages faster. That means the user’s browser blast through JS loading tasks even quicker.

Cumulative Layout Shift (CLS)

Cumulative Layout Shift or CLS is used to determine how stable a web page is. Stability here means visual stability. Now, if the webpage has elements that move around as the page loads, you’ve got a high CLS which is bad for the site. So please make sure the pages are relatively stable as it loads up. 

It’s essential because users then don’t have to re-learn where links, images, and fields are located once the page is fully loaded or click on something by mistake. Here are some simple things that you can do to minimize CLS:

  • Make sure to use set size attribute dimensions for media assets like video, images, GIFs, infographics, etc. It’s important because that way, the user’s browser knows precisely how much space that element will take up on that page so that it won’t change it on the fly as the page fully loads. 
  • Always ensure that there is reserved space for ads elements. That way, ads won’t appear on the page, pushing content down, up, or to the side.
  • Make sure to add new UI elements below the fold constantly. It would be best to do that, so they don’t push content down that the user expects to stay where it is.

Optimizing Your Site’s User Experience

So there you go, that’s about it for the Google core Web Vitals. The basic intention of Google’s “page-experience” metric is to try and quantify the user experience. That’s why user experience is vital. So the better your UX, the better your page experience scores will be. 

You can check out Google’s Basics of UX to better inform your optimization efforts. However, if you aren’t that tech-savvy or if you are already running at full steam and don’t have any bandwidth to tackle these problems, then Freelancers Hub can help you out. 
So if you need a helping hand to check and improve your Google core web vitals reports, then contact us, and our UX/UI experts will help you out. Also, if you have any questions regarding core web vitals or any other queries regarding digital solutions, drop them in the comments below, and we will answer them all. And with that being said, that’s about all we have for you today. We will come back with something new for you soon. Until then, see ya!

Share On Socials

Book a Consultation

Schedule a consultation with our experts to discuss your business goals and get started on the path to success.