Google’s Core Web Vitals are reviewed on a regular basis, and changes are made when necessary. This means a lot of businesses can oftentimes miss out on key ranking factors when it comes to organic search. 

Earlier this year, Google announced a new update. This will factor in Google’s algorithm as of mid-2021. From page speed to interactivity, there are a few changes you should be aware of. 

Core Web Vitals; what are they?

Core Web Vitals are a set of metrics that Google uses to measure user experience on a website. While several other factors also contribute to a good user experience, the Core Web Vitals are the stripped-down basics.

There are three key aspects to Core Web Vitals, including:

Largest Contentful Paint (LCP)

The LCP measures the loading performance of a site. This is how long your homepage takes to load when a person clicks on your link via a SERP (search engine results page).

LCP is a similar metric to First Contentful Paint and Time to First Byte. Although, these both indicate when a page starts to load. LCP, however, is more user-focused and gives insight into when a user can see and interact with your content.

First Input Delay (FID)

FID measures interactivity, such as how long it takes a user to interact with an element on your page. 

Interactions could include a user clicking on a link or inputting some data, for example. This is where FID is important as you want users to be interacting and engaging with elements on your site.

Cumulative Shift Layout (CSL)

CSL measures visual stability and then quantifies movement on the page as it loads. Not to be confused with page speed, CSL instead concerns the shifting elements on a page once the main body had loaded.

This can massively impact usability. We’ve all been there when you’re on a site, particularly on mobile, and you click on something only for it to shift up or down and you end up landing on a different page.

What’s so important about Core Web Vitals?

As we mentioned earlier, changes to the Core Web Vitals being introduced next year mean they will be more important than ever. Google is continuing to improve its algorithm with user experience in mind. So, that’s why these metrics are so important for site performance.

The new updates will paint a better picture of the algorithm so that Google can better understand where the user is, and isn’t, getting a good experience.

By implementing changes and best practice methods now, you will be setting your site up for success when the new updates are rolled out. It’s also worth giving your site an existing health check based on other metrics such as security and mobile-friendliness while you’re at it.

Best tools to use for Core Web Vitals

Google has plenty of tools to help you analyze and improve your website. Google Search Console, for example, enables webmasters to test their live site and understand their subsequent scores.

Similarly, PageSpeed Insights now also displays the Core Web Vitals broken down in a way that is easier to visually understand. Webpagetest.org is another popular tool that also includes these new metrics in reports.

If you’re looking for further assistance, Dev Tools is also a great site. By identifying aspects of your site that need improving, Dev Tools can tell you what you need to do to fix any issues.

Identifying and improving your Largest Contentful Paint

When thinking about improving your LCP, you need to identify what that is on your site. It can be difficult to identify at first. As a page loads, the browser may find a large piece of text first. This might seem like the largest piece of content at first, but it is then replaced with an image, for example.

You can use Dev Tools to help you find which element of your page is considered to be the LCP. You will then be able to see your LCP score. Dev Tools does this by recording the page load through the Performance Report. Within the report, you can see the element used for LCP including the size and the time taken for it to load.

If you’re looking to improve your LCP score, you should first start by using Google PageSpeed Insights. There, you will find your scores and any additional suggestions to improve these.

What is First Input Display and how can you improve it?

There’s nothing worse than an unresponsive website – that’s what FID aims to quantify. As opposed to looking at how quickly the page loads, FID focuses on how long a page takes to respond to user interaction.

FID differs from the other Core Web Vitals as it doesn’t need to be used on every page. Some pages require no action, like a blog post. Users perceive a response time of 100 milliseconds to be instantaneous. So, try to keep that time frame in mind when working on your FID scores.

The reason for a low FID score could be dependent on how much of the browser’s main thread is being used to do something else. The culprit for this tends to be a poorly executed or heavy JavaScript.

By reducing the demand on the main thread, you are allowing the FID to be reduced and the site can respond faster to interactions.

Here are some examples of how to improve FID:

  • Loading less code by splitting it down where possible

  • Deferring parsing of JavaScript

  • Loading CSS only when necessary

  • Loading plug-ins on necessary pages only

Causes and ways of fixing Cumulative Layout Shifts

CLS issues can be incredibly frustrating for users. As mentioned, CLS is a measurement of how much the elements on your page move around while loading. This happens when some pieces of content load faster than others. We’ve all experienced when a page keeps jumping as ads and banners load later than the main body of the text.

CLS scores are measured by identifying all elements of the page that have shifted during load. It then looks at how much they have moved. It then calculates the impact region, areas of the page affected, and the distance of movements.

Main culprits for poor CLS scores include:

  • Images

  • Slow loading font styles

  • Injected content (e.g. pop up’s or banner ads)

  • Flash of no styled content (when CSS is loaded after the main content)

  • Animations

To improve these issues, you could: 

  • Include dimensions for your images

  • Use Font Display Optional or a Fallback Font (telling the browser to use a default font if the load is taking too long)

  •  Ensure CSS is loaded before the content

  • Use transform animations

We expect Google’s new Core Web Vitals to have an impact on the algorithm’s behavior. BOSCO™ analyses your domain and uses trusted third-party data to benchmark your site’s organic search performance and pinpoints which parts require improvement.

If you would like to try BOSCO™ for free or for more information on how you can become a partner, register here. If you are interested in connecting your own data, send us an email at team@askbosco.io