Cumulative layout shift (CLS) is one of the most frustrating––and common––issues found on websites. Have you ever been online, gone to click a button, and it suddenly shifts, causing you to click on something else? That is CLS, an issue that occurs while the page is loading. And based on the number of dealership websites I have analyzed and found significant CLS issues on, your customers are likely dealing with this user experience issue, potentially causing them to leave your site to find one that functions better.
At Wikimotive, we always look for and find these issues on our client’s websites, but it’s not always something that we can immediately, or ever, fix ourselves. Most CLS issues are at the core of a website or the plugins and tools within it. This means that your website and tool providers are the ones who need to resolve them. They need to be held accountable. But when holding someone accountable, knowledge is power. So here is the knowledge you need, the facts and details behind the most common causes of CLS issues on your website.
#1 Site Providers & Configurations
The number one most common contributor to CLS issues is the site provider itself. Often, the page layout or button structure of a site is configured poorly, leading to problems when the page loads. In fact, buttons specifically are an issue on almost every site we analyze. In many cases, this occurs because the buttons are dynamically loaded or resized, causing unexpected layout shifts. For instance, if a button is initially rendered with a default size for a desktop and then resizes to fit a mobile device screen, everything on the page will shift. This may cause users to inadvertently click on the wrong button or lose their place on the page, which leads to both frustration and confusion.
The fact of the matter here, though, is that if one page on your website has an issue with its buttons, it’s likely that all of them do; this issue is at the core of how these were created by the site provider. The same goes for notations such as “wrapper,” which indicates that the page’s entire content is shifting during the loading process, making it impossible for a customer to visually process. If you take a look at the CLS issues on your homepage and come across issues like these, ones that are rooted in the site provider, you can get a good idea of what is happening site-wide. Once you get a good understanding, you can present these to your site provider; the good ones will make changes to help improve your performance.
#2 Chat Tools
Chat tools. Some people love them, some people hate them, but almost everyone deals with their frequent CLS issues. On nearly every single dealership website I have examined, the chat tool has at least one or two marks against it. This specific tool causing user experience issues is quite ironic, though, considering it is supposed to be contributing to the usability and convenience on a given website. In order to load properly, chat tools require additional scripts to be loaded from servers outside the website. If they aren’t managed properly or well optimized, there will be delays and errors in loading on the screen, which will cause the tool to move around the page and resize during the process.
Imagine this: You’re not finding the answer to your question on the website itself; you go to a new page and realize it’s not there. The page is still loading, and you try to click on the chat bubble in a last-ditch attempt to get your answer, but the bubble moves, and you accidentally click on something else, starting a loading process again. Sounds frustrating? That’s what happens when your chat tool isn’t configured properly. And even worse? If it’s happening on one page of your website, it’s probably happening on all of them.
Similar to CLS issues with the site provider, those with the chat tool are going to appear site-wide. This is because it is configured the same on every page it exists on and is a tool that you likely have on most––if not all––pages of your website. It’s possible that your chat tool is impacting your user experience and rankability on every single page of your website; that’s pretty serious.
#3 Pop-Ups, Pop-Ups, and… Pop-ups
Pop-ups. I can’t say that I recommend using them in general. While they can sometimes be useful, in many cases, they are actually causing more harm than good. It can certainly be exciting when you have a deal that could save your customers a lot of money, but there are other ways to display these promotions, such as banners at the top of the page. Pop-ups contribute to a poor CLS score and can be extremely frustrating to those trying to navigate through your site, especially when they reoccur after each and every page loads.
This is something that almost every single one of us can relate to. You are trying to shop for something online, and each time you navigate to a new page, a pop-up appears telling you that the store is offering 15% off when you provide your email address or the dealership is giving you $500 off purchase price when you make a deal today. Then, you go to click on the little “x” in the corner, and the entire page shifts, but you miss. You try again; it shifts a second time. At this point, you’re likely so frustrated that you will leave the site. If not, you likely will not return in the future.
The takeaway from this is that nine times out of ten, you should avoid using pop-ups on your website. Not only are they frequent CLS offenders, but they’re just flat-out frustrating for the customer.
Addressing CLS With Your Vendors
All of these problems, whether they stem from your site provider, your chat tool, or a marketing vendor who is insistent on including pop-ups on every page, need to be addressed. Poor CLS scores lead to poor user experience, which, in turn, contributes to fewer customers, leads, and conversions. If your partners are a part of your website’s functionality, they need to be told and held accountable. Using the information provided above, you can.
Plus, by catching up on our recent accountability video series collaboration with Angus Fox, an advocate from ThinkBetter, you can learn more about how to approach the subject with your vendors and use the knowledge you have gained in this article to assist in the advocacy process. Of course, you can also always reach out to us at Wikimotive for more information or for a quick and free audit that can help you best understand the performance of your website.
Whether you are concerned about a specific CLS issue or simply want to learn more about the services we have to offer, we are ready to start a conversation and help you crush your competition. Contact us today to get started.