May 27, 2021

How Google's Core Web Vitals Update Impacts HubSpot Users

As web users, we’ve increasingly come to expect the best possible experience when browsing content online. This is the result of a subtle, back-end revolution: Over the years, search engine algorithms have evolved to take user experience into account at increasingly higher levels. It’s now critical that recommended content goes beyond basic algorithm requirements to intelligently anticipate and satisfy any user’s needs. The most recent step in that process is Google’s core web vitals update.

Core web vitals are a set of metrics that give a good indication of page performance. Starting in June 2021, these experience metrics will be weighted more by Google’s algorithm in an effort to ensure organic search results don’t just provide users with the content they’re looking for, but also an overall positive experience.

While performance metrics aren’t everything —after all, content is still critical — they could be your competitive edge. If you and a competitor have similar domain authority and equally helpful content, your core web vitals could end up determining which business comes out on top on the SERP, and in your industry. 

What Are Core Web Vitals?

Ideas about page performance for end-users have changed over the years, so these metrics have evolved and will continue to do so. The 2021 algorithm update is focused on three factors: loading, interactivity and visual stability. The KPIs Google is using for those factors are LCP, FID and CLS respectively. 

LCP (largest contentful paint): How long does it take for the largest asset above the fold to load? Typically that asset is an image, and this metric measures how snappy page load feels for the user. The goal is for this asset to load within 2.5 seconds and if it takes 4 seconds or more, Google will read that as a bad experience. 

To improve your LCP, you’d need to make the asset smaller so it can load faster.

LCP example in website performance overview

If you’re unsure of what element on a page is the LCP, you can use the performance feature of Google Chrome’s Developer tools. Google has also updated multiple of their other web analytics tools to call out core web vitals.

FID (first input delay): How long does it take for a page to become interactive? At what point in the page loading process can the user start clicking around and scrolling? Google wants this speed to be 100 milliseconds or less and considers anything over 300 milliseconds to be a poor experience.

The main factor that can delay this is the amount of Javascript you have built into the page and your site. You’ll want your code to be as lean as possible because users expect web pages to be interactive immediately.

CLS (cumulative layout shift): How much does a page move around once it initially loads? Will the page jerk around due to big elements loading at a slower rate than the rest of the content? The goal is to keep your layout shift score at less than .1, and anything above .25 is considered a poor experience.

Large images or interactive elements are typically the cause of shift, but you can prevent that from happening by setting a fixed width and height in the tags for those elements, that way the space they’ll take up will be accounted for even before they fully load.

Optimizing Core Web Vitals on HubSpot Sites

It is possible for HubSpot pages to pass all three core vitals, but historically HubSpot sites don’t have the fastest load times. To achieve a “good” score on all vitals, you generally need to have a pretty lean page.

The main things that can slow HubSpot sites down are forms and CTAs because they each have their own Javascript. So, if you’re trying to have a strong FID, you need to limit how many of those you have on a page. In some cases, it might be better to use a regular hyperlink instead of a CTA.

HubSpot’s file management defaults for images can be beneficial for load speed, though. Whenever you upload an image to file manager, the system will automatically create an optimized webP file, which will help with FID and LCP. Additionally, as long as you set image width and size in the image tags, HubSpot will automatically generate the image at the size and will dynamically load the correct version based on the user’s device and browser, which minimizes CLS.

Also, you should follow general load speed optimization best practices, such as using web-optimized images that are the smallest size possible, lazy loading images and loading Javascript asynchronously through Google Tag Manager.

The Takeaway

Measuring and optimizing your core web vitals will be important going forward in order to perform as best as possible in organic search. However, you also need to keep in mind why these metrics are being used by Google in the first place: user experience

Core web vitals just measure one aspect of the user experience your website provides, and if you neglect the quality of your website content in an effort to optimize for load speed, you also won’t rank well. 

Your web pages still need to accomplish the purpose they were created for, so if they need CTAs and forms, include them. If a large image above the fold is important for your brand, include it. 

You can weigh the pros and cons of those larger elements on specific pages that are intended to rank for highly competitive keywords, but core web vitals shouldn’t be prioritized about content in your website strategy.

Download your SEO checklist

Christopher Mathieu

Christopher Mathieu is the Chief Services Officer at New Breed, an Elite HubSpot Partner based in Burlington, VT, which helps customers implement the right technology and strategies to unlock meaningful growth. With a background in design, technology, and demand generation, his over two decades of experience allow...

cta-pat

Ready to jumpstart your acquisition, retention and expansion efforts?

Request Assessment