Yesterday, on Google’s Search Central YouTube channel, a video was published, titled, How to Improve Cumulative Layout Shift for a Better Page Experience.
Cumulative Layout Shift–or CLS, as I’ll refer to it from now on–is a part of Page Experience, which is an overall metric that underlies the Page Experience Update.
Basically, Google wants each page of your site to convey a good user experience, or Page Experience.
(That said, user experience, as a concept, is broader than Page Experience, meaning that it can include things that are not part of Page Experience. But that’s beyond the scope of this news item.)
What Is CLS?
The best way to describe it, as described in the opening of the video, is to use an experience I’m sure you’ve had:
You go to a web page (usually on a mobile device), and as you start reading (or viewing), elements of the page shift.
This can be a bit jarring, because let’s suppose you were just about to click on something, but then…the link moves.
The layout shifted, and the cumulative shifting of the page’s layout is…yes…CLS.
CLS is a page-level metric, so each page on your site may have a different CLS score.
Now, you may be wondering if the process of improving CLS can be tedious, because you may want to improve the CLS of more than one page.
Yes, that’s true, which is why I would think that the more time-efficient approach to this is to use a platform (like a well-coded, light WordPress theme if you’re using WordPress) that optimizes several technical aspects of your site.
This way, each page’s CLS is as optimized as it can be (given what it has to work with).
This video gives a number of helpful tips and procedures for minimizing (and hopefully, eliminating) CLS.
What’s A Good CLS Score? (0…Or, At Least Aim for 0.1)
Ideally, 0, but, as mentioned in the video, it’s 0.1: “…a great number to aim for is [for] 75% or more of the views a page has, has a CLS of 0.1 or less. If you’re below that, you’re doing great.”
So, in other words, 0.1.
Just aim for a consistent 0.1 or below, and that should (hopefully) be sufficient.
How to Eliminate, or (More Likely, Reduce) CLS
Just to be sure, the video is a more detailed and comprehensive source of information on this, but I do have a bit of a technical understanding of HTML, so I’d like to offer a few tips:
First, Determine Your CLS Score
First, just as when you’re aiming for goals in life, you have to know where you are now if you want to get somewhere.
Likewise, you have to know your current CLS score.
CLS can be measured in the field, and in the lab. Field measurement tools are ones that measure according to a real user’s experience, whereas lab tools measure within a synthetic environment.
The tools listed below were found at this URL: https://web.dev/cls/#how-to-measure-cls
Field Tools
Lab Tools
Second, Consider Your Options
Will you decide to get rid of any interstitial ads, banners, or other elements that may affect the layout of your page(s)? (These may cause the layout to shift, especially if they load after the layout is first loaded.)
Have you thought of the hints given in the video, and made a list of how you (and your team, if you have one) would like to approach this?
Third, Play!
Maybe make a test page (you may want to no-index it, since it’s only a test page), and play around. Try certain things, and see what you find.
Take iterative steps to see how you progress.
Fourth, Take Action, and Decide
You made a list of options, and then did some experiments. Now, it’s time to take action.
Yes, this can seem intimidating, but if you have a site with many pages, just start by improving the ones that are most important.
You can also improve your content creation process, so that, from now on, your new content will have better CLS scores.
I wish you success.
Before you can receive free updates, link building strategies or SEO tips you need to confirm your email right now.
(It’s easy)
Just go to your inbox, open the confirmation email from the SIA, and click the link.
And that’s it!
PS: If you don’t see a confirmation email, please check your spam/junk or promotions folders. Sometimes the confirmation message ends up there by mistake.
Obtenez nos 7 études S.I.A. les plus controversées qui feront trembler la tête même les SEO les plus avancés d’incrédulité.
De plus, nous vous alerterons lorsque nous publierons de nouveaux tests au public.
Obtenga nuestros 7 estudios S.I.A. más controvertidos que harán que incluso el SEO más avanzado sacuda la cabeza con incredulidad.
Además, le avisaremos cuando publiquemos nuevas pruebas al público.
Get Our Most 7 Controversial S.I.A. Studies That Will Make Even the Most Advanced SEO Shake Their Head in Disbelief.
Plus we will alert you when we publish new tests to the public.
