Don’t Use Automatic Image Sliders or Carousels

http://conversionxl.com/dont-use-automatic-image-sliders-or-carousels-ignore-the-fad/

by peeplaja • 14 years ago

110 34 14 years ago

flexxaeon2• 14 years ago

I think the slider has it's place but that place isn't everywhere. When you want to bring exclusives, features, or trending news to the attention of the reader above the most recent stories, it's hard to beat a slider. The problem is, it's really only effective if the image is certain to grab attention to it's headline. A celebrity, a disaster, a 'hero shot'...these things always grab my attention on a slider. A Google logo, a physical product (unless it's like a 'WTF is that?') a picture of some random startup founder I'd only recognize by name, these things fail in the slider.

jaggederest• 14 years ago

As a user, I'd almost always rather see the same content stacked on the page i.e. section 1, section 2, section 3, than in a three-part slider.

peeplaja• 14 years ago

Exactly! If a business puts important information/message behind 2 clicks on a slider, that's stupid.

bbx2• 14 years ago

I guess years of flash animated banner ads have made users blind to any animated content on a web page.

On a side note, if you intend to implement a navigation for your slider (like dots or page numbers), I'd highly recommend triggering it on hover and not on click. It's really painful as a user to have to point precisely at a small 8*8 pixel area, stop moving, and then click, in order to change the slide. Hover triggering is more indulgent in terms of precision (like on Chrome's web store). Of course, making the area bigger is also recommended.

tomjen3• 14 years ago

Don't do this, unless you don't want mobile users to see your site; there is no hover on an Iphone.

sxtxixtxcxh• 14 years ago

don't display it as a carousel to the iphone. on a recent project, i stack the slides vertically for narrow viewports.

bbx2• 14 years ago

You're right. I implicitly meant 'for desktop users'.

Ideally, a slider on mobile should be usable through swiping. It's not hard to setup either.

jamesmcn• 14 years ago

If you use these things, you are a bad person and should feel bad.

Korg is a perfect example of why you shouldn't use them. All of Korg's product images have been on rotating sliders for years. When I want to take a closer look at how the controls or I/O ports are laid out, the last place I look is korg.com because there is no way to make the damn things stay still.

Good design solves problems. It does not draw attention to itself.

anigbrowl• 14 years ago

Not only do I agree with you about these things being bad, but I was having the exact same problem on Korg.com last night. It's very common on music gear websites, and infuriating.

robin_reala• 14 years ago

To be fair, a better carousel will stop all animation when the user interacts with it.

johne20• 14 years ago

They forgot one other important reason, most of the time they thrash the CPU. I have opened sites in a tab, with the intention of coming back later to explore more, only to later hear my mac book fan running loudly. I immediately shut down the tab.

mschaecher• 14 years ago

Why is this post not full of data and heatmaps to support this case? All I see is a "conversion" expert trumpeting anecdotal and gut opinions, without any supporting data one way or the other.

I'm not saying he is necessarily wrong, but this is an extremely broad generalization that is not backed up with any evidence in the post itself.

mmariani• 14 years ago

Exactly my thought. Also another thing, here's a guy preaching not to use carousels when his own web site has those cheesy banners that follow scrolling. For one thing hth OP understands usability as much as the guys who misuse carousels.

unwind• 14 years ago

Also, the site uses images to quote text from other sources. The credibility of the actual content went very close to zero in my eyes, right there.

mratzloff• 14 years ago

The banner that pops up as you near the end of the article? Yeah, on my phone that was impossible to close in landscape and I had to "chase it" in portrait. Instead, I just closed the article.

kingsley_20• 14 years ago

And which is it - "users don't see carousels because of banner-blindness", or "users don't see anything but carousel animation because of lizard brains"?

danso2• 14 years ago

I know it's a different use case but the OP is talking about using a strong static message and having faith in the user to scroll below the fold...all the while as his website uses an animated popup box to fill the bottom right area of my screen...twice (on the iPad). So apparently, there's a case to be made for some kind of obtrusive moving elements...

As someone already said, I'm inclined to agree with the OP. But there needs to be hard data here. People often won't know what to do (I.e. scroll down below the fold) until you flash some hint in front of their eyes. Newspapers used to do usability studies on their print product quite often...and they always found that a huge number of people, no matter how compelling the story, did not turn the page. I can see a case being made that even if there is one big thing you want to get across to the user (such as a bug sale), there are often competing concurrent interests that would be missed below the fold. At least a carousel gives that item/module a fighting chance to be just noticed.

ivanvanderbyl• 14 years ago

"People often won't know what to do" - do you have any data on that?

It is generally assumed in interaction design for web that the most instinctive action is scrolling. The concept of there even being a fold is also somewhat misguided, it like turning a page does not apply to a screen.

danso2• 14 years ago

Sorry, "won't know what to do" is an inaccurate simplification of the problem. A better way to say it is that they may be ignorant of what's possible/happening.

Take a site like the iOS App Store (yes I know it's technically not a webpage, but same concept)...I go there to search for apps I want. I will almost never scroll down to the bottom because my first instinct is to hit up the search box at the top. In the time that it takes me to type a search in, Apple could show me up to two, maybe 3 featured projects that I otherwise did not know I would be interested in.

Could Apple have trained me to, once I hit the ios App Store front page, to scroll down to check out the list of featured apps and then conduct a search? Sure, but I'm at a loss as to how they could do that without encumbering the user (i.e. putting the search box at the bottom of th epage)

michaelwww2• 14 years ago

They make me tense. I look at the TheDailyBeast daily, and hate the carousel daily.

lmm• 14 years ago

Just adblock it. I know it says "ad" in the name, but there's no reason not to block any page element that takes away from your experience.

michaelwww2• 14 years ago

Hey thanks! I assumed adblock would remove the whole element, but it just removes the timer js. The author of the article is right in my case; I'm happier to be in control of my experience.

ericdykstra• 14 years ago

"Don't use Automatic Image Sliders or Carousels" is good advice, but it misses the heart of the problem: don't design user interface without a purpose. If "what is the purpose and goal of this website?" is the first question you ask when designing a site, you should never end up with "carousel banners!"

The image slider is a classic example of user interface being built without being designed around purpose and function. This is a shitty design paradigm that has somehow lasted for years and years, but there will always be trendy things to do that are extended past their original purpose.

Start with purpose, then design a user interface that meshes with those goals, and good things will happen.

decklin• 14 years ago

On the contrary, I think that automatic image carousels are exactly user interface with a purpose. They're what happens when the purpose of the website is to be demonstrated to "stakeholders", the people who sign off on the university budget, the people who don't use the internet and just want to get back to running their restaurant, etc.

Normal users would go to the site to use it for the purpose of finding some bit of information; instead, in this case, another person loads it up on their laptop or projector for the stakeholder and talks about "hey, look what we spent your money on". The stakeholder does not actually touch the computer running the web browser.

(...that's my theory, anyway.)

nsomniact• 14 years ago

My co founders and I had a discussion about this very issue. We all wanted the functionality initially but realized that we hated sliders as users of other sites. No one I know cares to re-read the slide that was missed.

timc3• 14 years ago

I think for some usage they are really good and I haven't been annoyed with them except on sites that have more generic UX problems. Also I do look at them when I visit a site because there is often a lot of information to gather when first reading some pages.

RBerenguel• 14 years ago

I think they work well for product carousels, when you don't want to overload the home with pictures (like in http://www.thefancypuffin.com)

MojoJolo• 14 years ago

the transition between the images is soooo nice!

linker3000• 14 years ago

The company where I used to work a couple of years ago had a big front page photo slider that changed with quite a bit of vigor and it drove me mad because it would take all focus away from other elements on the page. On a large, wide-screen monitor it almost pulled you off your chair as your brain followed it.

Many other staff members (and customers) also hated the slider and I pointed this out to the relevant parties (Marketing and the MD), but they loved it and so it stayed.

PS: I've just checked and the slider has gone - but the article headers are now in Comic Sans. Dear god!

flexxaeon2• 14 years ago

We can't start a crusade against sliders while Comic Sans still draws breath

ericcholis• 14 years ago

While I don't have any metrics that correlate with the claims made in this article, I agree with them. I find that at the very least, the user is missing content.

I'm a fan of this homepage: http://www.curse.com/. It's got slider-like elements, but the content is displayed in a very organized, not distracting fasion. Designing above the fold is nearly irrelevant at this point. If done correctly, the user can easily be encouraged to scroll.

tatsuke95• 14 years ago

The problem I have with Image Sliders is that it is often unclear how you "backtrack" to an offer or ad you like. Then you end up clicking on something you don't want. It's an annoying experience.

tehwebguy• 14 years ago

Agreed, beyond the issues the article points out I'm constantly going through this inane checklist if I think I saw something I liked.

Starts like this: Wait did that just say "..."? Let me go back

Then I look for thumbnails, then BIG next / prev arrows, then small ones, then little squares in the corner, then those microscopic circles, then if I still can't find it I just inspect the page.

Teckla• 14 years ago

My situation is not a common one, but image sliders / carousels really hurt Remote Desktop / VNC / X performance, as well.

There have been a number of web sites I could not interact with because the carousel swamped my bandwidth with the constantly changing images, when I was accessing a machine remotely.

When that happens, I have no choice but to close the tab and not navigate back to the web site...or visit it later, non-remotely, if I bother going back at all.

Don’t Use Automatic Image Sliders or Carousels

Related Stories