CLS (Cumulative Layout Shift) is one of the measures of Core Web Vitals, which are important for positioning of a website in search engines. In this article, I will introduce what CLS is and how to measure it and improve user experience based on it.
Would you rather I take care of your site’s SEO to A to Z, instead of doing it “piece by piece”? Contact me!
What is CLS?
Cumulative Layout Shift (CLS) is an indicator that determines how much a page’s layout changes as it loads. The larger the CLS, the greater the chance that page elements, such as buttons or forms, will shift during browsing, which can negatively affect the user experience.
CLS measures changes in the page layout, not in the content itself. This means that even if your site’s content is well optimized, a large CLS can have a negative impact on your site’s rating.
Stay up to date with SEO news!
Sign up for the newsletter
How to measure the CLS?
CLS is an indicator that is measured as the page loads. To measure CLS, you can use site performance analysis tools such as Google PageSpeed Insights, Lighthouse or WebPageTest.
In Google PageSpeed Insights, you can find CLS in the Core Web Vitals tab along with recommended values for the site. In the Lighthouse tool, you will find CLS in the Performance tab along with graphs and detailed information. On the other hand, in the WebPageTest tool, CLS can be found in the Summary tab along with information on other page performance indicators.
Ready to grow?
How to improve the SEO of CLS?
To improve the CLS, it is worth paying attention to several factors. First, it’s a good idea to take care of the right dimensions, such as images, videos or advertisements. It is important that these elements do not move while the page is loading and do not change the layout.
Secondly, you should make sure to follow responsive web design principles to avoid sliding elements on mobile devices.
Third, it is worthwhile to take care of optimizing the loading speed of the content, so that the page loads quickly and stably.
CLS is an indicator of how the layout of a page changes as it loads. If it’s high, it’s worth working on lowering it, as shifting elements have a negative impact on the user experience and your site’s search engine position.
