9 Reasons Homepage Sliders Suck

Like many website designers, I have a negative opinion about website sliders. At least half of my web design clients come to me with detailed ideas about all the slides they want on their homepage, and most of the time, I can talk them out of it. It’s not that sliders are hard to create; any web designer knows how to add a slider in a WordPress homepage.

The problem is that on your website homepage, sliders are just a bad idea.

Here are 9 reasons homepage sliders suck:

1. Website sliders slow down your website.

A website slider is a hefty piece of code. Unlike a text box with an image, a slider is a fancy section that can replace its own content with an animated transition. That transition takes some time to load, and your browser has to do it.

Each slide is a big image, and that takes some time to load, too. In a typical slider, the browser has to load multiple images, animated transitions, and the controls for navigating the slider – all above the fold.

2. A slider above the fold is not a lazy load.

‘Above the fold’ is a newspaper term, defining the content that is above the fold bisecting the first page of the newspaper. This is where you put your most important content, because it is the first thing that someone sees when they are deciding if they want to read further.

On a website, ‘above the fold’ content is what is in the browser window, without scrolling, when the page first loads. Ideally, this should be your fastest content, because you want to give your user something to see right away.

Many websites use ‘lazy load,’ or asynchronous loading, so they do not download (or display) images from further down the page until the user scrolls to that section. This is good for website usability, because if you have to wait for the entire long web page to download before you read what is on the top, you are sitting and twiddling your thumbs, waiting for the entire page to be delivered to your browser, instead of reading the top and waiting for the bottom at the same time. Sliders that are at the top of the homepage (above the fold) have to load first, and your user has to wait as soon as they arrive.

Pro tip: Put your website URL in GTmetrix.com to measure how fast your website loads, and see how big it is. You should aim for under 1MB and 5 seconds.

3. Your first page load looks bad.

At this point (maybe now is good) you may be heading over to your website in a new tab to take a look at your own website slider, to see if it’s doing some of the things I’ve mentioned. Keep in mind, you have seen your website slider before. This means that that your slider images are cached.

Your browser has already downloaded the big images in your slider before, and your browser, helpful servant that it is, has stored those images in the browser cache. This is great for you, as the user, because it means you don’t have to re-download the images every time you visit your website.

But that’s just you.

New visitors to your website will have to load your slider images from scratch, because they have never downloaded these images before. What they see may be different than what you see.

Pro tip: Clear your browser’s cache, and visit your website homepage. How long does it take the slider to load?

“Every second it takes to load a page past two seconds hurts the user experience, and has an impact on search performance.” – Harrison Jones

4. Slider images are big and take time to load.

Your slider images should be big, anyway. If you’re using a 300px wide image in a full-width slider, it’s going to be pixellated and look really fuzzy.

While I do love the look of full-width images in web browsers, they need to be optimised for the web. If your image is 1.4MB, you are already way beyond the recommended 1MB threshold for total page size that you want to aim for, with just one image.

Using a tool like optimizilla.com, you can easily and quickly optimize your images, reducing their filesize dramatically. As a practice, I always run my images through optimizilla before uploading them to the WordPress media library. Watch me do it here:

Pro tip: Replace some of your biggest homepage images by running them through optimizilla. This free tool reduces the filesize of your image without sacrificing quality. Re-run GTMetrix after this, and you can measure precisely how much your images have been slowing your sitespeed down.

5. Website sliders are vulnerable to hackers.

The popular Revolution Slider, which has some amazing animation features, is often a target for hackers, precisely because it is so popular. Unlike the WordPress core, this slider plugin is not nearly as secure, and not updated as frequently.

This makes it a tempting target for hackers, because if they can exploit a vulnerability in a popular slider plugin, they can gain access to many websites quickly, before a repair patch is issued and installed.

Pro tip: Install the free WordFence plugin to check your site for malware and clean up after attacks.

6. Website visitors scroll down for more information, they do not wait for a slideshow.

How often do you land on a new homepage, and wait for the pretty slideshow to finish its carousel?

Do you find yourself hovering over the navigation dropdowns, obscuring the slideshow?

Or do you scroll down to search for information, ignoring the slides entirely?

“The primary purpose of your home page should be to create a high-level map of the world for your visitors so they can understand the range of available products that you carry. The giant banner will take up all of the prime real estate on the home page and push this navigation off the visible top of the page – sabotaging the page’s primary purpose.”   – Tim Ash

7. Multiple Slider CTAs split the user’s attention

One of the golden rules of landing pages is: give the user one option.

If you are sending a user to a landing page, through paid traffic (like a Facebook ad), you want this new user to do one thing, and only one thing. That is your Call-to-Action. Distracting them with other options (like your navigation bar or footer menu) will decrease conversions. In most cases, your homepage is not a landing page, but the same principle still holds true:

If you give your user too many options, they will select none of them.

[clicktotweet]

On your homepage, you’ve already got your entire navigation menu, maybe a sidebar, and (hopefully) a Call-to-Action to subscribe to your newsletter.

If you distribute some of these CTAs through your slider buttons, you are diluting the effectiveness of ALL of your Calls-to-Action. According to KissMetrics, “of users’ first three eye-fixations on a page, only about 22% are on graphics; 78% are on text (headlines, article summaries, captions). In fact, people often ignore images entirely until the second or third visit to a page. So taking up the majority of your page’s real estate with images is ass-backwards.”

8. Information in sliders looks better in columns.

Most times, if you are expressing separate ideas in separate slides, they would be easier for the user to view all at once, in columns. Take a look at these two options below, and ask yourself which is more effective for you, as a user:

Here is a Slider:

Here is the same information, in columns:

Which do you like better, when you are scrolling down a webpage? I’m guessing the columns were easier for you to scan and digest.

If you don’t have a website theme that makes columns super easy, then consider a simple Hero Image. As the Altos Agency suggests, “A well-executed hero image serves as the very first glimpse of your site most visitors encounter, and should combine everything from your unique personality to a laser-focused look at just what you offer and why users might want to learn more. Pair that with a powerful CTA and you’ve got a static header image that actually attracts more clicks than any slider.”

9. Sliders are not that important.

If there was really something you wanted your user to see, as soon as they land on your homepage, you would show them that one thing. (Identifying that one thing is extremely difficult – that’s why it’s so important to work on your Customer Avatars.)

As Michiel Hiejman says on Yoast, “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!’ In that case, you really need to add focus. If you don’t know what to choose, how would your visitors or clients?”

With every lukewarm offering you have sprayed across your slider, your website visitor gets more distracted.

“Unless the image slider is the only thing on your website (bad idea!), it’s not a good thing. It means it takes away attention from everything else – the stuff that actually matters. Like your value proposition. Products. Content.”

– Peep Laja 

About The Author

Caelan Huntress is the father of 3 kids, and in his spare time serves as creative director of Stellar Platforms. He is also a writer, digital marketer, multimedia producer, and a retired superhero. He blogs about his adventures on https://caelanhuntress.com.