Sliders are like fake tits.
Sliders totally suck and no one should ever use it. It’s like fake tits. It looks good from far but the experience is totally horrible. Just avoid it! There are hundreds of other ways to design your site without sliders and get way better conversion!
That was my response to one of my clients who runs a legal firm who wanted a slider on his homepage.
” Why do you like sliders?,” I asked him.
“The transition animation looked cool.. I saw them in some of our competitor sites.” He replied.
“Sure, it looks cool. But cool doesn’t mean it’ll make money for you,” I replied with discontentment.
Why sliders are evil?
I think sliders are distracting. It’s a way to put extra crap on a page that’s typically not best for visitors. If it’s important in most cases you should just put it on the page without sliders or extra clicks.Hiten Shah, Co-Founder of Crazyegg and KISSMetrics
Companies use sliders as a compromise between internal departments compared to making the tough decisions that need prioritisation of conversion goals. They merely represent an easy way to deal with internal inter-departmental bickering about who gets to put their banner front and centre on the homepage.
Lets start with some Malaysian(local) websites that use sliders. You will notice that they look good but kill conversion.
Digi’s Homepage (www.digi.com.my)
RHB Group’s Homepage (https://www.rhbgroup.com/)
Domino’s Homepage (www.dominos.com.my)
Nope, this is not me throwing a hissy fit over an UI element that I don’t like.
Lets look at some reasons to why they are bad from UX and SEO perspective:
Sliders are bad for UX
- Very few users interact with sliders. Often the sliders are so fast that people are not even able to finish reading them (even if they want to).
- They look like adverts and causes banner blindness as users tend to skip ahead of them.
- Sliders are bad for accessibility e.g. users with low literacy or international users. Sliders move fast and don’t get recognised by Google Translate. Now, what does it tell about you as a brand when you ignore your own users’ needs?
Sliders are toxic for SEO
- Sliders and carousels actually slow down your site. (Slow sites are bad for SEO).
- Homepage sliders push the rest of the page way down the page. (Pushing your content down will de-rank you in your organic search results).
- Sliders don’t show well on mobile devices. Image sliders tend to load desktop site image which are not optimized for mobile speed. (Google de-ranks sites with non-responsive elements).
“Sliders please the owner of the site, but they deliver little to no value to the customers. The reason is that we are not going to sit there and wait for your ‘movie’ to play out. I’m also not a fan of sliders because for most businesses they provide an excuse not to think about personalization and being good at giving the customer the right answer, right away.Avinash Kaushik, Digital Marketing Evangelist for Google, Author of Web Analytics 2.0 (Also available on Kindle)
Avoid sliders as much as possible. Use the reasons above to convince your clients to not use it.
If your clients are being stubborn about using sliders, use these steps.
1. Convince the client to not use hero sliders (sliders that expand across left to right of the homepage). Instead convince them to use a slider like this:
This type of sliders allow the users to read the words clearly (as its not on an image), with obvious call-to-action. It’s easy for Google bots to read them. On mobile screens, you can move the images to the top, followed by the headings, subheadings and action button with swipe gestures.
Note that with this design, you can use sliders to reduce the length of the homepage and clearly communicate the message within the sliders.
Note: You can download the above design here to edit with Adobe XD.
2. The sequence of the slides is important as the initial slides will get more exposure than later ones. Urge your client to prioritise. I tend to force them to decide to keep the sliders below three and to always use the most important one as the first one.
3. Stop the auto-rotation. Let users click the buttons or the arrow to see the next slides. This allows users to have the control. The slider is not going to switch to the next one while the user is reading or milliseconds before they click it.
4. Do keep in mind that on mobile users are using touch and they are not using mouse hover. Hence, your slider must be touch friendly – hence allow them to swipe. Reduce the size of your image to show on the mobile i.e. Create many sizes for the image. Use lazy load by loading some of the later slides in the background since many users will not get to them.
5. Introduce A/B testing to your site. This allows the clients to optimise their copy and artwork – instead of just compromising. Most of the time when I reach a situation where the departments can’t decide what should be the first slide, I suggest conducting a split test for 2 weeks. This puts the attention back on data and creative execution. Let the data decide instead of the egos in the room (or the loudest).