Should I use a carousel?
shouldiuseacarousel.com
shouldiuseacarousel.com
Some people seem to think carousels are some sort of design cheat code, making it possible to include five pieces of content in the space of one. It's almost the front-end equivalent of a TODO comment.
// TODO: decide which of these things actually matters.
// In the meantime, let's just show all five one-by-one
And those fucking carousel pagination "dots"... just when designers had begun to catch on to the fact that numbered pagination links need to be big enough to click easily, along came carousels to preserve the tradition of impossibly small UI elements that are difficult to interact with.
Fuck carousels.
It's a user's nightmare anytime you're presented with a carousels since you never know what functionality, if any you're going to get. I'm thinking this is why so many people simply discard them entirely now.
They've become the most useless web dressing ever.
It's just an aesthetic presentation of non-essential content (random portfolio items).
There's a couple of other issues with your site as well - it seems fixed to a very wide width (possibly due to the carousel?) which is not only quite significantly wider than many laptop displays / non-maximized browsers would reach. And you seem to have some character encoding issues as you're apostrophes are being replaced with �.
On a personal note, some of the fonts are too big as well. Your site reads more comfortable when I've zoomed out twice (which also fixes the width issue as well).
Aside that, the landing page looks well polished enough (I didn't venture further in).
Mozilla/5.0 (X11; Linux x86_64; rv:22.0) Gecko/20100101 Firefox/22.0The width is indeed because of the carousel - I meant for it to go of the page. Is that causing weird scrolling problems? It's supposed to be overflow-x: hidden. Is that causing weird tablet scrolling issues? You're not supposed to be able to scroll horizontally.
I'll have to look into the character encoding issue - thanks for that report.
I realised that was more a showcase than for navigation. What I meant was that if one did catch your eye just as it was falling off the page - you can't bring it back. It can be argued as a pretty miner issue I'll grant you. But that was my immediate thought when I saw stuff drop off the side :)
> The width is indeed because of the carousel - I meant for it to go of the page. Is that causing weird scrolling problems? It's supposed to be overflow-x: hidden. Is that causing weird tablet scrolling issues? You're not supposed to be able to scroll horizontally.
This is was in Firefox on ArchLinux (laptop). I definitely have a scrollbar at the bottom. Sorry mate :(
> I'll have to look into the character encoding issue - thanks for that report.
I notice you don't have any meta tags for encodings. I wonder if that might be causing the issue (I should stress - I'm not an expert on these matters): http://www.w3.org/TR/html5-diff/#character-encoding
Not sure if that's the feedback you were looking for, but there it is ;) As I said, I do dig the overall aesthetics of the site.
I think he might have been better served by putting those portfolio items in the sidebars.
The only thing I would add is a way for the user to interact with the carousel if they needed to. Most people will ignore it, but if a game does catch someone's eye, it's currently impossible to scroll backwards to check it out.
I guess that's the main problem. It wasn't meant to be a navigable thing, just a preview of the portfolio content. I figured once someone clicked on one of them, they would see the other games. I think maybe it looks more important than it's meant to be. It was just a little graphical banner that became fancy.
http://www.reddit.com/r/gamedev/comments/1i1amy/marketing_fo...
<marquee onmouseover="this.setAttribute('scrollamount', 0, 0);" onmouseout="this.setAttribute('scrollamount', 6, 0);">
Well, now that you opened your big mouth... :)
Aside from showing upper management that their latest bullshit idea is on the website, carousels also serve another purpose, which is to make the website look "alive" and "dynamic" and "interactive." And that's just the tip of the buzzword iceberg.
Ultimately it is one of the many symptoms of a very common phenomenon: design decisions made by people who don't know anything about design. In most cases these people are directors and C-level executives.
You may have dreamed this part.
The problem isn't cultural traction among web designers and developers, but among the CEOs and marketing guys and VPs who, for egotistical or political reasons, order the designers to implement the site in a certain way.
They love carousels because, as you said, carousels feel like a design cheat code that let you fit 5 (or more) times the amount of content in the same amount of space. Instead of actually researching your niche and making a choice about what content is most important to solve your customers' problems and your own goals and what content gets priority on a page, they take the lazy way out and order the designer to fit everything on the screen.
Most decent web developers who place a premium on UX will not usually suggest a carousel as the best way to display some content on the screen, and they may fight those decisions as best as they can, but at the end of the day the people who pay the bills will make these decisions.
I've used them and my clients and the customers of those clients were happy with them. I did not through paragraphs of text on them, just pretty images and headlines (featured content).
Happens most often on newspaper and magazine websites. Some sites provide a pause button to kill the distraction, but many don't.
The second terrible mistake is using page indicator dots (which do a good job of indicating the page) for navigation, let alone using them as the only means of navigation!
When you take into account these two things, a carousel can actually become comfortable to use and may no longer enrage its users. But that's still a far cry from being better than showing the content in a regular list:
> I've used them and my clients and the customers of those clients were happy with them. What do you mean with "happy"? Did the customers actually understand how to use the carousel, did they discover its content, did they click on it? Not being annoying does not suffice to qualify as useful.
Even if you did this, your mobile users will still be mad, because they cannot hover.
The question isn't if you or your clients are happy with them. The question is if your users are happy with them, and if they generate better business results (conversion, clickthrough, whatever is relevant to you) than the simpler, less Javascripty, less timing-based, less gotcha-with-the-mouse-hover implementation.
I sincerely hope you A/B tested this.
Though some have a habit of stubbornly ignoring any professional advice against a feature they have an emotional attachment to, raw data can sometimes snap them out of it.
<!--
Hold on now! If you're looking here to figure out how to use this carousel, STOP!
Read this site carefully, then go smell some flowers or do something else instead.
Every time you use a carousel, a kitten dies.
/\_/\
____/ o o \
/~____ =ø= /
(______)__m_m)
Think of the kittens!
--> <title>Should I Use A Carousel?</title>
<!--
SPOILER ALERT: No!
-->Unlike other flawed design patterns, such as horizontal scrolling or a reliance on mouseover popups, it's hard to assert, without referring to "studies", why the carousel is just bad in a way that doesn't sound like I'm only stating my hoity-toity developer preferences.
They specifically recommend against using your logo as a splash page, but most people do it anyway.
For more complex apps, especially apps that maintain state, this becomes impossible. You can make your splash image your "home" view controller, but if the app is launched from a URL (a large use case for many apps) the user will see an "empty UI" that is not what they're looking for, suddenly replaced by UI they are looking for.
Making matters a bit worse is that, at least up until iOS6, switching between apps (not just a cold launch) can also show the splash image briefly - but your app snapshot remains in memory, so you cannot guarantee the "empty UI" is what your user actually ends up looking at.
Splash images suck, but for a lot of apps they are the least of several evils.
It feels like Apple is advocating using a really ugly hack to make it look like app loading times are shorter than they really are.
"Avoid using your launch image as an opportunity to provide:
- An “app entry experience,” such as a splash screen - An About window - Branding elements, unless they are a static part of your app’s first screen
Because users are likely to switch among apps frequently, you should make every effort to cut launch time to a minimum, and you should design a launch image that downplays the experience rather than drawing attention to it.
Generally, design a launch image that is identical to the first screen of the app."
If you do this, as an iOS developer, you should have your developer program revoked...
I'm not sure that's a strong argument in their favor.
People also tend to overstate the negative impacts of carousels because they have not internalized the patterns of search and social traffic. On the websites I manage, 80-90% of visits do not start on the homepage! So only a very small number of visitors are actually seeing the carousel at all.
Most homepages today are really just another landing for a particular subset of your traffic. You'll get people who are totally unfamiliar with you, and need an intro. Or you'll get people who are intimately familiar with you and want to see if their pet thing is important to you--a good fit for a carousel.
Carousels are for promotion, not navigation, so task-oriented usability studies are not really applicable. Online promotions deliberately reduce usability in the interest of capturing attention.
ducks
I'm actually quite surprised they went with this. Maybe it tested well on touch surfaces...
On any of these how the hell am I supposed to navigate to a specific topic? or link any one to a specific point. The mac one does have tiny dots on the side. I think many people wouldn't even notice them.
The entire scroll hack just seems like a gimmicky, non-intuitive, time consuming alternative to using a slider to forward though a animation/video or some kind of navigation buttons with an animated transition. Or just play a regular movie/animation.
To me the big NO meme is the epitome of the hipster dismissal—that is the soulless critique of someone who does not create but rather defines themselves by their impeccable taste cultivated with a constant barrage of acerbic criticism punctuated by eye-rolling and justified by a pervasive nihilistic sense of irony.
Then I got it.
I'm not going to disagree with their assessment, but I'm more annoyed by them.
It's ego stroking.
auto: {
enabled: true,
interval: 3000
// HA HA! I HATE MY USERS!!! Especially the ones that aren't speed readers.
}My reading speed is several times average. I had honestly not noticed that it would be difficult for most people. A good lesson to me on the importance of usability testing.
I'm not contesting that carousels are bad (I'm not a web designer, but as a user I ignore most, except the one on the front page of Steam [2], but that may well be because I'm used to their biggest promotions and releases being there.) I'm just concerned about the quality of the test the Nielsen people did.
EDIT: This sarcastic carousel gets it right.
It is funny, though.
Carousel's do suck, but what other options do I have?
that doesn't mean there is no place for carousels anywhere.
take the new youtube profile pages for example.
the carousels are used to show unpredictable number of videos in specific lines (recent videos, playlist) without littering the screen with videos, not creating empty spaces where video numbers aren't divisible by 4 or 5 (depending on how many elements are supposed to be shown on one line)
this makes it much easier to scan several playlists on one page.
Teehee, a brilliant site.
I think using carousels for content that is non-essential but that the user may want to see more of is fine. For example, photos -- some users are happy with 1 photo, and some want to see them all.
This is a straw man that demonstrates hiding the main content behind a carousel is bad.
(You can use other text of comparable length, but make sure that, if you were to capitalize it like a book title, it would still fit the rule).
"It's kinda weird to quote yourself." -rschmitty
http://weedygarden.net/2013/01/carousel-stats/
Seems head honchos of marketing depts love these things because it satisfies inner politics of putting important stuff on the home page.
While the user experience can be lacking with a carousel sometimes, I've definitely seen it used as an internal solution to deal with competing stakeholder interests that fight over homepage real estate, and would otherwise turn into a huge waste of time.
You can arm-chair argue about fixing the underlying problem instead, but sometimes you have to be pragmatic and just placate and move on..
I work in the nonprofit space and we sometimes need to show that a certain topic is "important" to us, to help deliver on a fundraising or policy goal. Carousels are great for this, even though I know in advance that few people will click through. This success would be measured by directly checking with the desired stakeholders.
Another use for carousels is if you want your homepage to communicate an emotional tone--as opposed to enabling a task. A carousel of big, vibrant images can deliver an emotional message almost as well as a short video, but with a much lighter implementation. This success would have to be measured via user surveys or focus groups.
In our case, the whole homepage is links to games. The real reason we use the carousel has been mentioned in this thread - there is a lot of pressure to put things in a featured position. The fact is, only the first few positions are effective, particularly the first. But everything that goes in is initally in the first position, then gets demoted.
One benefit of that is that if someone comes to the site, plays the first game, then comes back 5 days later, they can expect to find the same game in 3rd or 4th position.
I'm open to other ideas, of course.
Now, FIMFiction.net moved the carousel from the header to the home page, and made it much bigger. I hadn’t really thought about whether I liked that change – I don’t see featured stories as often, but I don’t have to scroll down as much to see the content of each page.
But: that would mean you could probably do without a carousel as well. (Think about just the header picture of your latest article, the most popular one or just a random one)
If you are talking about e-commerce sites and think that a higher density of information will win-out over a pretty site you need to start being more data-driven.
That is gold. Pure gold.
The suits will love the flashy new thing that shows the world their 'genius'. Meanwhile you're just using it to balance a layout, knowing that users will gloss over it 99 times out of 100.
They have there place, but when overused it's a poor use just like the the "Web 2.0 drop shadow on everything icons" and the blink tag before it. People see a element and decide that everything needs that element.
Carousel do work well for displaying a large/unknown number of images. Text and autotimers are almost always a bad idea IMO.
It's not on the landing page, but as part of a test. I have one question presented at a time, and the user is moved on to the next question once a question is answered. The carousel lets them easily see how many questions are in the test, how many they have answered and have left to answer, as well as moving back and forth in the test.
I think like most things it not inherently bad in itself - its how you use it that matters.
http://www.amazon.com/
http://store.apple.com/us/browse/home/shop_mac
http://www.rakuten.com/
http://www.ebay.com/electronics
https://www.youtube.com/
http://www.microsoft.com/en-us/default.aspx
etc..Example: My company tested landing pages using all the best practice rules out there on the web - outcome: lower conversion.
What the lesson should be is that testing is incredibly important - and not prescribing something that may or may not work for a given audience.
Precisely correct. This is why they exist and why they are so useful at resolving disputes.
So I clicked on the link, didn't see a Kodak Carousel to my surprise, and started reading the text. I got annoyed very quickly ("why is this moving so fast? Did I click on anything?"). And just when I was ready to say "screw this" I got that my very behavior had just exactly proven what Jared's point was.
Touché!
I thought we got away from that 10 years ago.
But still if they all vanished in the night I would not complain.
Are "slideshows" considered the same or something different from carousels?
...even the name for these things is a complete fail :)