At the end of August, Google completed it’s rollout of the latest algorithm update. This update is called the “Page Experience Update,” and began to taking effect June 16th. Since then, the page experience update has ramped up. Now that we’re able to see and assess the full effect, what’s new about the August 2021 update?
Well, to put it simply: nothing.
Yes, You read that right – this update does not introduce too many new rules. Rather, it fleshes out and specifies new metrics for previous updates.
Google has previously made mention that it wants to see mobile-supportive sites, triggering many SEO websites and agencies to showcase their “responsive design” ability at every opportunity. Fast load times have always mattered.
However, SEO specifics tend to remain something of a ‘black box’ when it comes to the Google algorithm. Tests are routinely conducted by even the most senior blogs to determine what’s going on behind the company’s algorithms. These tests turn hunches into hypothesis, and vague conclusions are drawn based on the repeatability of these metrics. It’s akin to the scientific method – except the end results are murky, and mostly developed by consensus (rather than hard data).
With the Page Experience Update, Google has attempted to shed some more light on the key factors and how webmasters may optimize for them. They have designated these new metrics “Core Web Vitals.”
What are Core Web Vitals?
Core Web Vitals are key components designated in Google’s most recent algorithm update, the Page Experience Update, taking place from June to August 2021.
What’s different about core web vitals as opposed to the usual ranking signals analyzed by SEO’s, is that Core Web vitals have definitive values.
The 3 metrics Google has chosen to be:
- Core Web Vitals are LCP (largest contentful paint)
- CMS (cumulative layout shift)
- FID (first input delay)
That may sound frighteningly technical – especially if you’re reading from the perspective of a business owner, rather than a SEO evangelist.
When broken down, these are simply key ways any website user experience is graded:
Core Vital 1: LCP (Largest Contentful Paint)
This is a fancy, technical way of describing the load time of your webpage’s visual components. In particular, LCP refers to the largest block of visual content on a page to load.
That fancy slider, your company logo, and any other image content all affect the time it takes your website to load.
When relaunching the Target Points brand from it’s earlier 2017 predecessor, one of our first improvements was dramatically reducing the LCP and overall page-load speed.
We achieved this mainly through image compression.
Knowing that the LCP is tied to your images, it should make sense that making the image smaller (image compression) would reduce your LCP, and give you higher standing in the eyes of Google.
The simple reality is that users don’t want to wait. This is why slow web sites have such a high bounce rate (percentage of people quickly leaving). Users know what they want, and they want it now. Every second wasted on page load time, is a second where the user is tempted to jump off your page and find their answer somewhere else.
Have you ever opened up multiple tabs from a google search result at once? This is a fairly common practice for the user, to ensure they get what they’re looking for as quickly as possible.
For example, if I search for “best deli in Mineola,” I might open up 2-3 nearby deli’s at once. Then, I would quickly look through the menus, the images, and come to a conclusion on where I’d like to order from.
Put yourself in my shoes for a moment. I’m hungry. It doesn’t matter if you’ve uploaded a photo of the best Reuben Nassau County has ever seen, if it takes too long to load. I’m going to see a blank page, or a page with slow-loading images, and quickly jump between the tabs where I have my other options. The one that loads the fastest may not necessarily win my business, but it satisfies the user experience the most.
That’s exactly why LCP matters.
Improving Your LCP
By reducing the size of your largest image, you also reduce the time it takes to render that image. Keeping your images under 1 MB is a useful rule of thumb. Most images can be resized inside Photoshop, InDesign, or whatever image editing suite you prefer.
If you’re a WordPress user, Smush or Tiny PNG will allow you to quickly bulk compress images – decreasing the time it takes t load them as well. Each of these plugins has a free version. The free versions do have some limitations, but they play well together in tandem (despite what any confusing WordPress admin panel messages would like you to believe)!
Core Vital 2: CLS (Cumulative Layout Shift)
The CLS is a measure of page stability, and is considered a Core Web Vital by Google’s most recent algorithm update. Layout shifts are funky things that happen for a variety of reasons, but they manifest the same way – the website does something ‘annoying.’
Usually, that’s losing your place in an article, or clicking a button with a delayed response – but we’ll get to that later one in a moment.
If you’re scrolling through an article, but the website ‘jumps’ you somewhere else, and you have to scroll back to your place… you’ve just experienced a page layout shift. This routinely plays out with the user clicking on ads instead of the article they wanted to read.
Cumulative Layout Shift is the overall layout shift on a webpage’s layout, as it goes through the loading process.
If you’re older, you may remember experiencing multiple layout shifts as large, half-blurred images loaded on older websites. That’s an example of what we do not want to be happening with our website, as it’s a great example of too much CLS.
Ideally, you want the page to shift as little as possible as things load. The reason for this is so that readers can quickly see and begin absorbing information, without any interference or needing to refocus after the page has shifted.
Again, humans are fickle creatures. Just as they might be quickly rifling through mineola deli’s to select a lunch order, it’s also possible they’re looking for recent updates on lime disease in their area. If they begin reading an article, but the website ‘messes up’ and forces them to start over, they can become frustrated and look elsewhere for their information needs.
We see why Google has selected CLS as a Core Vital. Don’t you?
Google has been keeping an eye on cumulative layout shift for a while now. Core Web Vitals were announced in May 2020, but the methods Google uses to calculate CLS have changed over time. As with any algorithmic update, the goal is to improve accuracy.
The CLS scores as analyzed by Google are:
• 0.1 or Lower = Good
• 0.1-0.25 = Needs Improvement
• 0.25 or Above = Poor
The recommendation is to keep your cumulative layout shift score under 0.1.
Remember, the general reaction or assessment of a user dealing with CLS is that their user experience is ‘annoying.’ We want to avoid annoying our users, and provide a seamless experience whenever possible.
Improving Your CLS
This is a bit tricker to assess the culprit of when compared to LCP. The most common causes of cumulative layout shift are:
• Web fonts which cause fleshes of invisible or unstyled
• Ads, Embedded Items, and iFrames without dimensions
• Images without dimensions
• Dynamically injected content
If you have ever embedded via the ‘share’ function on sites like Youtube, you’ve used a snippet of iFrame code before. However, sometimes the quick “cut and paste” leaves out the dimensions (or has dimensions which don’t quite fit your site). These can be easy to catch culprits affecting your CLS.
As far as the issues with fonts are concerned, this can primarily be caused by using fonts hosted online. Sometimes changing the font to something more uniform, or hosting the font yourself, becomes the quickest workaround.
On images, using the actual size of the image source (called ‘intrinsic size’) can get the job done.
Finally, if your CLS is in the ‘poor’ range of 0.25 or higher, it may be easiest to simply change the layout of the website. If you’ve downloaded a template, or built a bulky custom layout, it may be more trouble than it’s worth to try and reduce the CLS. In this circumstance, finding a layout with less CLS to begin with might be your best bet.
Many templates have test pages, or ‘live demo’ areas, where you can click around to get a feel for the features. These live demo pages can also be plugged into a tool like GTMetrix, which we showed you earlier. If you’re going this route, be sure to check! The last thing you want to do is pay for a new template, sight unseen, and run into the same problem.
Core Vital 3: First Input Delay (FID)
The first input delay measures how long a website takes to become responsive. Remember that button that “doesn’t do anything,” or takes too long to do something we alluded to earlier? That’s a sign of poor FID.
The reason this is important is poor FID can result in users becoming frustrated (yet again considering your site ‘annoying,’ and damaging the overall user experience).
Studies show that users are unlikely to continue engaging with a page if their first attempt to interact is disrupted or unsuccessful. That’s exactly why this metric is for the first input and it’s corresponding delay.
One of the great things about these Core Vitals is that Google has specified goal values for all of them. We’re not doing any guesswork which can plague SEOs, such as trying to determine the number of backlinks needed to rank for a given keyword. Instead, we know what a ‘good’ and a ‘great’ result are out of the gate.
For FID, the goal is to have less than 100 milliseconds of delay for 75% of all page loads. So, if a user clicks a button, we would like the intended effect of the click to occur within 100 milliseconds. Anything beyond this is perceived as lag, or a “slow” response.
In fact, Paul Buchheit, the creator of gmail, felt 100 milliseconds is “the threshold where interactions feel instantaneous.” There is an estimated 20% drop in traffic for every half second delay, and a projected four million dollars in lost revenue for every full millisecond.
Like we said, humans are impatient creatures. The want results now. To not be able to deliver on the internet when the user comes across you, immediately, is a costly blunder.
Improving Your FID
As a general rule of thumb, reducing the amount of requests your code makes to pull something from the database will help reduce latency (lag).
Combining and minifying your HTML, CSS, and JS files can help on this front. There are many helpful plugins that will offer to do this for you! Being minimal in your use of site images, and using inline SVG code instead of images for icons and logos, will also contribute. Removing unused or redundant code will significantly optimize your CSS.
If you’re a coder, look into the “idle until urgent” approach for you Javascript. This will minimize the main thread blocking time, by only triggering your javascript when necessary.
Google’s Page Experience Update – Experience vs. Content
The ttile of this article is “Content is King (Again),” and there’s a reason why. While it’s easy to get lost in the jargon of technical SEO and metrics, the end goal is the same: the satisfaction of the users.
Your website’s goal should be to serve the user as best as it can. More often than not, this singular goal will outmaneuver all of the technical scoreboard-keeping and maneuvering you can muster.
Google has already confirmed it will still prioritize sites with the best information, even if that site’s page experience is slightly worse than the next. As a result, we would consider these new Core Vitals ‘lightweight’ metrics – they’re useful to implement, and important to keep an eye on. However, they are not the “be all end all” of SEO. Do not turn them into the latest shiny thing to chase, derailing your team on a half-pointless quest to be the #1 at these Core Vitals!
They are simply one more way Google is using to help the user get to the best information, in the shortest amount o time.
Of course, if your Core Vitals are seriously out of whack, it may be time to update your website or change your theme. Otherwise, some image compression and minding of your code should ensure a solid performance.
