Cumulative Layout Shift (CLS)
Measures the degree to which content moves or jiggles as other content continues to load, causing a poor user experience.
The Cumulative Layout Shift (CLS) metric measures the visual stability of the webpage. If you have ever visited a webpage and seen content jump around as different parts of the page load, you know this is. This can happen when an image loads and takes up more space than expected. To prevent this, images should have their width and height attributes set correctly. It can also happen when a font loads that is a different size than the default font. Selecting proper fonts and optimizing how they load is important. There are many other causes for layout shifts, so you should inspect your pages and make sure they load without too much shifting.
The scores we use come from a Google Lighthouse report and represent the 28 day average score for the homepage as measured by real users using Chrome. A website should aim for a CLS score of less than 10%. Anything over 25% is considered to be poor.
For more information, please read the documentation on Web.dev.
Ready to validate your website for this test and 100+ others?