“Sliders are cool, they’re modern, trendy and give a dynamic edge to your website” – says a lot of designers, including ourselves once upon a time. But they can have a negative impact on your website’s loading speeds and even confuse your visitors.
In this blog post, we look at why you should be avoiding sliders, especially on the homepage.
I feel the need, the need for speed
Sliders zap site speed.
Their JavaScript and CSS files are render-blocking when placed above “the fold” (full-screen paint of the website as it loads… think back to newspapers). This means before your website can show the HTML (content) and CSS (styling), it has to load in JavaScript files, which can take time. Ultimately, visitors are then met with a large blank screen for a second or two, or maybe more.
Plus, sliders are often created with large images as they need to fill background spaces, which further take time to download to the user’s machine and render.
In a world with the internet at everyone’s fingertips and demanding information instantly, speed is becoming so important in both user experience and SEO.
Sliders can also lead to user confusion
Having a slider is an easy way to showcase all your company’s products and services in a small space.
Sounds great, but really isn’t.
Studies show only 1% of people actually click on a slider, in which those that did, 89% was the first slide. So you may as well have a good converting static hero section, right?
As Thijs de Valk from Yoast says: “What you’re saying with a slider is basically: ‘I really don’t know which product or picture I should put on display on my homepage, so I’ll just grab 10 of them!’ – We couldn’t put it better ourselves!
Choosing one message to display to a user focuses their attention and focuses your marketing.
The alternatives?
There are lot of alternatives.
Some ideas include a single static image background with a clear message layered over or making use of shape dividers/SVGs and your brands colour scheme.
If you do need to display the content from the slider on the home page, think about breaking it down into some responsive columns further down the page.
If you would like assistance, please contact us for a homepage review or use our free, automated website audit tool to understand your website’s load times and overall score benchmarked using Google’s lighthouse.
