Blog Insights
Carousels: Good or Bad?
Carousels come up often as a design solution for displaying content in a variety of situations, such as wanting to keep important content near the top of the page; wanting to feature content from different teams in the same place; and not wanting to place a burden on the user to have to scroll down the page. I’m here to walk you through what you should consider when deciding if a carousel is the right option for your content and to answer the question—carousels: good or bad?
So, what’s wrong with a carousel?
There are a few reasons why we’re cautious about recommending carousels to solve the situations described above.
1. Users don’t see the items in a carousel.
What usability testing and data shows us is that users tend to scroll down the page, rather than click through the carousel. This would mean that the other items in the carousel will likely not be seen by users; probably not okay!
Furthermore, if the carousel is at the top of the page and looks like a banner, then it can suffer from banner blindness—meaning users see the style and assume it’s an advertisement. This creates a scenario where users just scroll past it and don’t look at it.
In this 2013 study, researchers studied how many people actually clicked to the other items in the carousel on ND.edu. The content in the first position in the carousel only received 1% of users clicking on it, which is very low. Beyond that, when compared among users who did click on something in the carousel, content in the first position in the carousel received 89.1% of clicks in the carousel, the content in the second, third, fourth, and fifth positions in the carousel, only received between 2.4% and 3.1% of clicks. Some other sites they studied did slightly better, they still had vast differences between content in the first position in the carousel versus content in other positions.
2. Carousels don’t get at the root of the problem: content prioritization.
There are two reasons that we hear from people who want a carousel:
They want all the content on the top of the page because it is all important content. However, as described above, putting content in a carousel vastly deprioritizes content, so it appears as unimportant.
They don’t want to burden users by making them scroll. Countless studies have shown that users scroll (see here as an example). If you want users to see all the content, they’re more likely to scroll than to click through a carousel.
3. Carousels increase cognitive load for users.
Another reason is that a carousel either has an automatic rotation (which is problematic because it can be difficult for people who read slower, need more time to process, need more time to click through, or are easily distracted) or requires a user to click through or pause it, which puts more unnecessary burden on the user.
Also, we’re putting the burden on the users if they have to find the controls to click through the carousel. This is putting the onus on them to discover the content, rather than presenting it to them.
If you’re still not convinced, check out this website.
It’s still important to prioritize content
If you decide that carousels aren’t the right choice, there are other excellent options to help you organize important content that you want people to access. It can be difficult to prioritize content, so ask yourself the following questions to help you do that:
- What are your strategic goals? How does the content map to these strategic content?
- Is there a specific current campaign that you’d like to promote?
- Are there other places to feature content on the site?
- Who are the audiences on your website?
- What kind of content do these audiences want?
- What do you want these audiences to do?
Here are a couple options to consider instead of a carousel. However, please consider goals, audiences, and intended actions so you can ensure you’re creating the right solution.
1. Show all content
The most obvious solution is to take the content you would have included in a carousel and just include it right on the page. The right solution here depends on how much information you want to display and the type of content (i.e., is the content text or image heavy).
Example: Bustle does a good job of displaying lots of content on their homepage.
2. Feature content and link to a dedicated page
Another solution is to take one to three of the items you would have displayed in the carousel and display those on the page itself and include a link to a page to see all of that type of content.
Example: Similar to Bustle, National Geographic features a significant amount of content on their homepage, and also provides links to see all of a certain type of content. (Note: You’ll also see a couple of examples of carousels on this page! Consider why this specific content might work better in a carousel).
3. Feature the content across the site
Consider where else on the site this content could be relevant for your audiences and feature it on multiple pages. This will help ensure that no matter how a user enters your website, they still see the content.
Example: The Walters Art Museum features a particular exhibition both prominently on the homepage as well as prominently on the Exhibitions and Installations page.
When a carousel makes sense
A carousel works well for an image gallery, where users can toggle through a slideshow of photos, for example, of different angles of a museum collection object. This is expected behavior and simply adds to the current content experience.
A carousel can also work for other content, but it often requires spending extra time to ensure it’s accessible, user-friendly, and effective. We’ve seen effective carousels on the web, but it takes extra time and care. A few things to consider:
- Make the controls to move through the content very clear.
- Don’t make the carousel move automatically.
- Make it clear how much content and what type of content the users should expect to see. For example, add the number of items in the carousel; expose the titles of the content in the carousel as a preview; and have a clear header that describes the content.
- Consider how to make it enticing for users to scroll through. For example, favor big imagery rather than lots of text.
- Conduct usability testing or A/B testing to compare the effectiveness of the carousel versus another solution.
- Read through accessibility guidance and usability guidance on the topic of carousels.
Example: The CFR homepage does a nice job incorporating a carousel. There are several factors that help, including a clear header, using one type of content, clear numbering, clear way to toggle, and a link to see all of that type of content.
Additional resources
Here are few other resources on the topic of carousels that could help you decide if they are right for you: