Our Guide to Core Web Vitals and the Page Experience Algorithm
It’s taken Google over a decade to create a search algorithm that can take into account a user’s experience on the site, but it’s almost here. It was 2010 when Google revealed their mobile-first strategy, indicating a wider paradigm shift. Users were in a transition from more desktop viewing to mostly mobile. Responsive Web Design began to gain traction sometime between 2011 and 2013. Then in 2016, Google began rolling out their mobile-first index, which meant that they would now look to the mobile versions of a site first, and desktop versions second.
The Page Experience Algorithm
As companies shifted their focus to mobile design, they began to consider the elements that would make the user’s experience better. Tactics like a slightly larger font, more padding between lines, larger navigation buttons, and responsive images have become more and more prevalent. Why? Because data shows that users engage longer with a mobile page when it’s easier for them to see the words and move seamlessly from one page to the next. Google enhanced their Search Console tool to show errors when these elements were not user-friendly in hopes of encouraging webmasters to make changes. Speed has been another large focus in recent years, with Google going so far as to create their own set of code for publishers to use if they couldn’t solve for speed on their own.
All of these things and more led us to Google’s May 2020 announcement that a new ranking signal would be added to the algorithm in May 2021. Just last week, Google updated the timeline for their launch from May, to a more rolled-out approach from mid-June through the end of August.
“We will introduce a new signal that combines Core Web Vitals with our existing signals for page experience to provide a holistic picture of the quality of a user’s experience on a web page.”
What Google seems to say is that there are already signals built into the algorithm to measure for page experience. Those signals are likely reliant on user engagement metrics like how frequent users go back to the search result listings after they click through to a result, pages per session, time on site, and bounce rate.
Core Web Vitals
Prior to the announcement of Web Core Vitals, there wasn’t clear direction on which page speed metrics Google was focusing on most when it came to speed. Using tools like GTMetrix or PageSpeed Insights returns a multitude of technical information that can be a challenge to parse through. Core Web Vitals is the specific set of metrics that Google considers important to user experience.
Here are three of those metrics you should care about when it comes to improving the performance of your website:
1. Largest Contentful Paint – This measures loading performance, specifically how long it takes for the page’s main content to load. Prior to Google releasing the information around WCV, we were using a metric called First Contentful Paint to gauge performance but this measures only the time it takes for the first part of the content to load.
Per Google, sites should aim to have LPC occur in the first 2.5 seconds a site is loading.
2. First Input Delay – This measures the time it takes for a user to be able to engage with a page. Whether this means responsiveness to a link being clicked, a comment box becoming available or a working email subscribe box, it’s measuring the user experience specific to when they’re first trying to interact with the page.
Per Google, sites should aim to have an FID of less than 100 milliseconds.
3. Cumulative Layout Shift – This metric is measuring visual stability. You know when you’re scrolling through an article on your phone and all of a sudden the screen shifts? You lose your place in the text or click on something accidentally? As we all know, this makes for a terrible user experience.
Per Google, sites should strive for a CLS score of less than .1s.
We’ve been using this Web Core Vitals Chrome extension when we work with our publishing partners to optimize their site speed.
There are other web vitals wrapped into Google’s algorithm, such as mobile-friendly, safe browsing, HTTPS, and no popup interstitials.
Google provides data analysis for these metrics now in Google Search Console. There is now a dedicated section under the “enhancements” section where you can see if your site is passing or failing on these speed metrics.
How Does This Change Your SEO Strategy?
Speed is a big part of things, but it’s not the only thing. Google’s search algorithm has over 200 factors, and speed is just one of them. Like many of these factors, their weight in the equation is relative to the quality of the content. An oft-quoted Google statement says, “A good page experience doesn’t override have great, relevant content.”. Your content should always have the majority of your concern. It’s one thing to improve code causing an LCP score of 14 seconds. It’s another to waste too much time concerned with getting a CLS score from .2 to .1.
Unless, and here’s where the attention to detail can be worth it: If there are 10 websites that all have well-written, useful, interesting, usable content, Google may default to ranking the fastest one in the top spot.
When we talk to SHE Media Partners about SEO and content strategy, we remind them that if it comes down to spending hours upon hours obsessing about speed (assuming your site runs at average or above speed), the time would be better spent creating more amazing content or updating top performers. You can do all the speed optimizations, even going as far as to jeopardize your income by reducing or removing ads from your website, but none of it will matter if your content is lacking. Content remains number one, even through Core Web Vitals.
Still, here are some ways to improve those metrics we just talked about:
Largest Contentful Paint (LCP)
This one is related to page load time. LCP measures how long it takes for the majority of content to load on the screen. The main differentiating factor from this metric and other page speed metrics is LCP measures from the user’s perspective vs. other outside influencers that can make it more complicated.
If you have a high LCP time, here are some areas for you to look into.
- If you’re on WordPress, audit your plugins. It’s not uncommon for us to see partners who at one time or another, downloaded plugins for things they never set up, don’t need or overlap with other plugins in purpose. Each time a plugin is downloaded, more scripts are added to the code, all impacting your LCP time.
- Don’t skimp on web hosting. Talk to your blogger friends, look at reviews, ask us! I’ve been hearing great things about Big Scoots and Lyrical Host, specifically that overall site speed has improved since switching to them.
- Remove unnecessary lines in the CSS code. This will reduce the file size and speed up load times.
- Defer loading on images, aka lazy load. This means they load only as someone scrolls down the page. This can be applied to both static images you add to your webpages and also to your ads. Both will contribute to a speedier LCP time.
First Input Delay (FID)
Goal: 100 milliseconds
This metric answers how fast a user can interact with your page. Examples of page interactions would be things like opening up a menu dropdown, logging in, entering your email into a subscription box or clicking on a link. For many publishers, since the majority of the site experience is scrolling through content, FID isn’t much of an issue.
To solve issues with First Input Delay, there are several places to look.
- Use browser caching to tell browsers how long to remember the web files that they have downloaded from your site to avoid the need to retrieve the same file again within a certain time frame. Kind of confusing, I know! The best way I can explain it is that proper browser caching is the reason why when the first time you visit a site, it takes a noticeable few seconds, but when you have to find that page again, 15 minutes later, it loads instantaneously. It’s because this time, the browser had a memory, or a stored copy of the page to retrieve. If you’re using WordPress, recommended plugins include W3 total cache plugin and WP Super Cache.
- Same thing with the plugin audit here as above. Each plugin adds another script, scripts take time to load. Remove the ones you aren’t using and make sure to understand the functionality of each. You may be find multiple plugins performing the same task. Reduce.
Cumulative Layout Shift (CLS)
Goal: .1 seconds
The latest buzzword on every blogger’s mind is the CLS score. This metric measures a page’s visual stability, assessing any shift or bounciness that happens as the user moves through the site. Bounciness on the page causes a poor user experience so the lower the better when it comes to this score. The TLDR; version of why the shift happens is because without clear dimensions set, elements move around as device/screen size changes.
To get a lower CLS score, here are a few things to look at.
- Make sure to specify the size attribute dimensions for videos, images and any other media on your site.
- Ads should be in a fixed space, reserving enough room to eliminate popping in and moving content up and down. SHE Media partners will soon have their ads inside a fixed space, look for our note when this has been implemented.
- Any dynamically injected content should be added below the fold.
Be prepared for the Core Web Vitals update by addressing these three metrics beforehand.
The SHE Media Partner Network helps content creators and entrepreneurs build sustainable businesses with dedicated support for managing ads, brand partnerships, and more. Apply now to join our mission-driven platform.