Kill the Carousel

 Grant Little

Rotating slideshow carousels on a site’s homepage are a popular feature that's been around for a long time. Here’s why you shouldn’t use them.

Carousels on home pages first appeared a long time ago and gained prominence on news sites. When they were created, they gained rapid adoption because they allowed for multiple messages to be displayed “above the fold.” For businesses, they allowed for a mix of messages and promotions but most of the time, they are a way to placate internal stakeholders who demanded a presence on the homepage.

The idea behind the effectiveness of the carousel is that the user will stick around on the homepage long enough to see what’s on all the slides before deciding on their course of action. But carousels don’t work because this idea is flawed. And carousels are already on their way out of favor on home pages. News organizations - which were early adopters of the carousel - have since dumped them, and here’s why you should too.

People aren’t clicking on the messages.

Only 1% of users actually click on a carousel image, and of that 1%, 89 times out of 100, it’s only on that first image. Users don’t click on the other slides, meaning that the biggest, highest profile target on the homepage is being ignored by your users.

Let’s say you have a carousel of 5 messages. Each message is on screen for 5 seconds. That’s 25 seconds for your site’s visitor to watch all the messages. Users won’t - and don’t - hang out long enough to do that. For the majority of visitors, the length of their visit to a homepage is under 10 seconds. They’ll either move on to their destination or abandon the site altogether. The probability that users will spot the item they want is drastically reduced when only one thing is displayed at any given time; in the above example, any given message is visible only 20% of the time.

“Banner Blindness” is a phenomenon in web usability where visitors to a website either consciously or subconsciously ignore banner-like information. And they’ll apply this to a carousel as well. Because carousels move, users automatically assume that they might be an advertisement for something that they don’t want, which makes them more likely to ignore it.

Conversion

No one goes to a hotel because of the lobby, they go because of the rooms. The rooms are where they spend most of their time at the hotels. The purpose of the hotel lobby is simply to welcome the visitor and help them get to their ultimate destination - their room.

Your website is no different, and your homepage is the hotel lobby. No one goes to a website for the homepage. They go to a website to either find specific information, or buy a service or product. It’s the job of the homepage to provide them with the information they need and to help them get to their destination. To that point, your home page should convey the following three pieces of information to your visitor in under 5 seconds:

  • Who you are

  • What product/service you provide

  • Why the visitor should care or How can you help your visitor?

Carousels fail at this because while some messages might be on topic for a percentage of the audience, the user also ends up being asked to sit through messages that aren’t on topic or relevant to them. Rotating messages are actually a poor way of presenting home page content since they distract the visitor from why they came to your site in the first place.

They don’t translate well to mobile.

More than half of all online Black Friday shopping in 2015 was done on mobile, and that number is only going to go higher. Mobile isn’t a trend, it’s not something that’s in the future, it’s the present.

But carousels don’t translate well to a mobile environment. Their navigation interfaces don’t scale well, the content doesn’t display the best and depending on the user’s network, their animation can slow down a site’s loading time.

Wow, that’s pretty harsh. So you're saying that they’re totally worthless?

Not at all. The problem with carousels is that they’re used for the wrong reasons.

As with any other tool, it’s usefulness depends on how it’s being used.  Remember, ”If all you have is a hammer, everything looks like a nail.”

That said, a carousel can offer value when it’s used in a very specific, targeted context.

Let’s say that you’re a hospital and you’re building a new children’s wing. You create a website that’s solely focused on this new project; everything on that site is devoted to promoting and informing patients - both current and potential - that this specific location is being offered. In this case, yes, a carousel can be a useful communications tool because anything being placed within it is directly relevant to the site’s messaging.

A second good example would be on a product page. For example, a kayak manufacturer’s site would have a carousel of photos of a specific boat on that boat’s product page within their site. This allows for a lot of content that’s relevant to the user to be displayed without taking up a lot of room.

In either of the aforementioned cases, carousels shouldn’t automatically run. They should show a new panel only when users ask for it. Otherwise, it should stand still and let users read the information in peace.

So what’s the solution?

To identify the solution, first, you have to identify the challenge.

Often, people will resort to using a carousel because they don’t know or can’t focus their messaging. Sometimes they may not be clear as to what their business, marketing or website goals might be. Other times, organizational or inter-department politics compete for promotion. Carousels do a fantastic job when it comes to appeasing internal desires or informing people in the marketing department or senior management that the content that they want on the site is on the home page. But such internal conflicts aren’t customer-oriented and it’s not up to your visitors to prioritize your messaging for you.

Webster’s defines prioritization as, “to organize (things) so that the most important thing is done or dealt with first.” Your site’s content must be prioritized based on their value for your users and customers. What is the first, second, and third most important messages that are important to your customers. Remember, when everything is a priority, then nothing is a priority.

Prioritizing your content and your messaging paves the way for better user experience overall. The end goal is to facilitate the user’s decision making process.

Here's a wireframe for an alternate to the homepage carousel:

carousel-alternate.jpg

It displays five pieces of content, all at the same time. The highest priority message (1) gets the top billing, with subsequent messages (2-5) falling below it. The user can scan over the entirety of the container for anything that might be relevant to them. 

It also satisfies the internal struggle for placement on the page while allowing the user to decide for themselves what's important. As new messages are generated, they cycle into the container, pushing down the older messages, keeping only the most up-to-date messaging present. 

And last, but not least, this solutions translates much more easily to a mobile environment.

Depending on your situation, this or another solution might be a better alternative. Maycreate can help ensure your website not only communicates with your customers and users, but it compliant with best practices as well. Contact us today to discuss how we can build you a better website.