29/03/21 Beu Smith

Core Web Vitals: A complete guide to page speed and how this will impact SEO

Google has announced that page speed will be used as a ranking factor which is estimated to be released in May 2021.

The way Google will measure a site’s speed is through ‘Core Web Vitals’. These are metrics that benchmark what Google define as ‘good’ when looking at how fast your website renders content and becomes interactive for the user.

Google looks at a multitude of factors and signals that have varying weights of importance and, when these factors are combined, it creates a score that reflects how Google will rank your site. So far it has been confirmed that the following contribute to signals for page experience:

  • Mobile First - Ensures user experience is optimised for mobile
  • Secure Connections - Provides safety for users while using your site, for example, from cyber-attacks, hackers, viruses, or spam ads
  • Intrusive Pop-Ups - Pop-ups must follow guidelines and best practice
  • HTTPS - There should be secure encryption end-to-end

In the Core Web Vitals update that was announced in May 2020, Google did something it does not normally do. Google gave specific detail on what they value and see as ‘core’ to providing the best possible page experience for the user. These elements included:

  • Loading: Largest Contentful Paint (LCP)
  • Interactivity: First Input Delay (FID)
  • Visual Stability: Cumulative Layout Shift (CLS)
Google Web Vitals Update

Page speed has been speculated as a ranking factor for years. Now that Google has finally confirmed it will be a ranking factor along with giving specific benchmarks on good page experience, what does this mean for SEO?

How Is Page Speed as a Ranking Factor Going To Impact Performance?

Honestly, no one knows for sure how page speed will affect performance. Recently, we have seen Google move away from specific updates of SEO-old like RankBrain, Panda, and Penguin that address a singular factor. Rather, we see them focus on a more holistic approach getting webmasters to look at multiple angles. It seems that instead of ticking boxes, Google wants us to think more about the page purpose and what would be best for the user.  

For Google to announce that speed will be a ranking factor with a 12-month advanced warning, provide specific detail on what metrics they value as important, and give us access to page speed testing tool where it shows your site’s performance with hints and tips on how to improve, it all suggests that this Core Web Vitals update is going to be important.

We reached out to some industry experts, curious to see what their view on the impact of this update would be on the industry and got this quote from Stuart Melling – Business Development Director at 34SP.

 “What to look out for? The very fact that Google are signposting this so prominently means everyone should sit up and take notice.  Google rarely give website owners a heads up on a change that will impact how they rank their site in the search; when they do make a statement like this, you’d be unwise to not pay attention. 

The last big moment (similar to this) was when Google announced SSL would become part of search ranking, and vast swathes of the web finally made the leap from http to https.”

Does that mean in May 2021 this update will tip the internet on its head?

Probably not. In 2015, Google announced it was going to prioritise mobile-friendly websites and began its transition from desktop being the priority to mobile-first, as we know it today. This was widely speculated by many in the community as something that would radically unhinge search as we know it and cause a digital apocalypse, which landed the update name ‘Mobilegeddon’.

In truth, nothing extreme happened. As the update rolled out there was Search Engine Results Page (SERP) volatility, which is very common, but this settled down after a few weeks and, given its expected impact, it was rather uneventful. Gradually, however, non-mobile-friendly results did start to drop out of the search results or see noticeable ranking declines, which made the industry prioritise mobile.

We think it will be a similar story with Core Web Vitals. It is unlikely Google will roll out the update with a dial set to 11, as this could cause too much backlash for them and negatively impact their own user experience. It is more likely that they will release the update and then increase the importance of it over time.

This is good news for any of you out there who still score ‘poor’ or ‘needs improvement’ but do not put it off any longer! You need to look at what to prioritise to improve your speed score.

What should I be looking out for?

Core web vitals update

It is important to make sure that you have your bases covered. Every site is going to require specific recommendations, from auditing page speed performance to analysing the data, however, over the last 10 months, we have noticed a lot of websites have the same opportunities for improvement.

We want to share these with you as quick-win opportunities, especially given that the update is due to roll out in May 2021!

The common opportunities we find across many sites are:

  • Removing unused JavaScript or CSS
  • Using next-gen images (such as JPEG2000, JPEG XR, or WebP)
  • Removing or deferring render-blocking resources
  • Stopping too many asynchronous JavaScript requests
  • Minifying HTML and resource compression
  • Deferring offscreen images

Here is the best bit: these tasks all improve the speed score on Core Web Vitals and improving them might be easier than you think. Let’s have a look:

Loading: Largest Contentful Paint (LCP)

Largest Contentful Paint (LCP)

In short, LCP is the time it takes for the main bulk of the page content to be rendered. This is a key metric because it is a subconscious visual marker for the user that the page being requested is responding and working as expected, so the quicker this shows on the screen, the better.

Improving LCP is always unique to each website but some general quick wins to help improve the loading time include:

  • Removing unused JavaScript or CSS 
  • Removing or defer render-blocking resources
  • Using next-gen images

Optimising or removing unused JavaScript reduces the time spent requesting, transferring, and executing resources that are not critical to the pages loading. In turn, this frees up server speed and response time.

Removing render-blocking resources allows the main content which controls the page to be executed earlier. This means that it has a direct correlation with LCP.

Using next-gen images allows for higher compression which means the image file size is smaller but, when rendered, it still retains high image quality. The smaller file size makes it easier for mobiles with 3G connections to quickly load the content.

Interactivity: First Input Delay (FID)

First Input Delay (FID)

FID is a metric Google has created to measure the time it takes from when a user interacts with a page (such as through clicks, scrolls, or using an action button) to the action happening. This is an important metric as it signals to the user that the page is responsive. Quick wins for improving this are:

  • Removing too many asynchronous JavaScript requests
  • Minifying HTML and resource compression

JavaScript is used by so many sites to improve user experience due to its functionality and customisation, however, it demands a lot from the servers. This then leads to delays in other files being requested and executed. Ultimately, this means that everything else is put on hold until the JavaScript is finished being fetched and rendered. To improve this, review which JavaScript files are being prioritised and, where possible, remove or defer these until critical above-the-fold content has loaded.

Content compression is a great way to create more bite sizes deliveries that are transferred and loaded faster. This has a knock-on effect in improving the page’s time until it is active and reducing the time rendering main thread tasks. We recommend using .gzip compression for dynamic files (for example, JavaScript) and .br compression for static resources (such as HTML).

For more detail, see Google’s Dev article on how FID works.

Visual Stability: Cumulative Layout Shift (CLS)

Cumulative Layout Shift

CLS is when the page layout unexpectedly changes at a point where the user is interacting with the page, however, this can cause frustration due to accidental clicking on action buttons for the user. CLS usually happens when third-party resources or DOM are injected dynamically, like videos, images, CTAs, or Ads.

Your browser does not support the video tag.

The best tip to reduce CLS is to reduce the guesswork from the browser. Dynamic content is great for adapting to different screens or devices, but this means the content is loaded on the page and then a second action is required to make it fit (causing movement).

To reduce this, include size attributes on image and video elements. This allows the browser to allocate space for the content on the page, reducing layout shifts later in the rendering process. Another great tip is not to insert content above existing content unless it is intentional to the user’s action.

File execution and resource optimisation is often overlooked because its fiddly and not the easiest to allocate time to work on as the results can be trial and error to get right. If you can control the rendering process correctly, it will improve your metric score with Google’s Core Web Vitals and ultimately provide a better experience for the user - which is what Google rewards with a higher ranking.

Below is a table giving an overview of each Core Web Vital metric and the markers for performance:

Overview of each Core Web Vital metric

How to be prepared for the Core Web Vitals roll out and measure performance

You need to be prepared through testing, straight and simple. Google has done everything they can to prepare us for this update: they announced the update 12 months prior allowing us time to make changes, gave us Google’s page speed insights which helped highlight areas that need improvement, and provided loads of insightful data around how to optimise and improve these areas.

Google’s Data Studio has a top-level view of the selected property’s Core Web Vitals, this allows you to see how the pages score and drill down into the device type for a more detailed report on individual URLs. This is a great tool to help understand the percentage of effected pages and allow testing on URLs which have a ‘poor’ score.

Data Studio Core Web Vitals

There is even a custom dashboard you can create in Data Studio that gives a detailed report of your site's performance, allowing you to drill down into devices, months and even page experience metrics outside of the core update.

Here is a screenshot from one we made for a client. If you want this insight yourself, try making your own page speed dashboard. You will need a validated Data Studio account access to connect to the data source.

Google Page Speed Dashboard

Final Thoughts

Google normally likes to keep updates and factors that influence them close to their chest. This is an attempt to stop people from abusing their ranking factors and cheating their scoring system to rank above a result that provides a better answer and experience.

Here we have Google doing the opposite; giving us a 12-month heads up, tools to test our sites, and resources on how to optimise performance and get a better score. This all points to it being an important update and one of the big milestones in the Google update roadmap.

It is unlikely the update will roll out and flip the search landscape on its head as we think it will be more of a gradual rollout that increased with time, but it still could happen.

Regardless of our performance impact best guesses, if Google thinks page speed is important and that it is something we should focus on to provide a good page experience, then we have to act on it. Google will not prioritise your content no matter how fully formed and factually rich it is if the page takes ages to load and has a poor user experience. It will show the result that is optimised for mobile 3G and meets as many of their best practices.

Tao Digital Marketing's Founder, Matt Tomkin, shares a similar view saying.

“We don’t know the specifics of the impact that the Core Web Vitals update will have yet, but one thing is for certain - this is going to act as a differentiating factor in Google’s eyes. This is something we saw with SSL certificates.

For example, if you have two equal pages, the factor which would determine whether or not the page was higher on the SERP was if they had the SSL certificate. We imagine this will be the same with Core Web Vitals in that sites will ‘pass’ the test and will therefore be preferred, potentially leading to better rankings.”

Therefore, if you want to rank in traffic driving position, this update is very important.

If you have any worries about the update or want us to take a look at your site performance, then drop us a message and see how we can help you. 

Beu Smith

SEO Lead specialising in techical SEO across eCommerce, B2B and B2C. Passionate about delivering organic growth.