Skip to Main Content

Are Carousels Sabotaging the User Experience?

They are everywhere: on the home pages of large online stores, in agency portfolios and on campaign microsites. Carousels - i.e. automatically or manually changing content sliders - have a dynamic effect, save space and attract visual attention. So it's no wonder that they are often requested in customer briefings.

But what appears modern and interactive at first glance often turns out to be a UX problem on closer inspection. Because what looks good doesn't always work well.

In this article, we take a differentiated look at the carousel phenomenon: Where they make sense, where they cause problems and how they can be solved better or even completely differently.

What is a Carousel?

Comparison of two UI elements: A carousel/slider for content navigation (left) and a material design slider for value selection (right, as a volume control).

On the left, a carousel/slider for navigating through different content, on the right a material design slider for precise selection of a value, shown here as a volume control with corresponding icons.

The terms “slider” and “carousel” are often used interchangeably in the UI context, which can lead to misunderstandings. Depending on the framework or design system, a “slider” refers to either a content changer or an input field (e.g. for a numerical value). The following definitions apply to this article:

Carousel:
A UI element for displaying multiple contents (slides), which become visible one after the other by swiping, clicking or autoplay.

Slider:
Sometimes used as a synonym for carousel, but in frameworks such as Material Design it explicitly refers to input fields with sliders (range input). Technically, carousels are usually based on JavaScript or CSS logic that displays content in a horizontally scrollable container. Libraries such as Swiper.js or components from frameworks such as Bootstrap or shadcn/ui take over the control.

The UX Problems of Carousels

Despite their popularity, UX experts consider carousels to be one of the most overrated interface elements. In practice, the same weaknesses are seen time and time again, both in terms of use and effect.

Content is overlooked

Studies show that users usually only consciously notice the first slide. Everything that follows often remains unseen, especially when the slide changes automatically. Carousels tempt users to spread important information over several slides, which is then simply ignored.

Autoplay disrupts the reading flow

An automatic slide change can cause visual disruption and takes control away from the user. Texts disappear before they have been read to the end and orientation suffers. This is a clear UX negative, especially for accessible or inclusive interfaces.

Accessibility & SEO disadvantages

Many carousels are poorly optimized for screen readers, cannot be operated using a keyboard or are not fully indexed by search engines if implemented incorrectly. Page speed also suffers when many high-resolution images are loaded in a carousel, which can have a negative impact on SEO and user experience.

Mobile use: Reduced space

Added to this is the severely limited display space in the mobile view. Content that is easy to read or sensibly structured on a desktop often becomes confusing or illegible on small displays. Text or more complex layouts in particular can hardly be presented in a meaningful way within the slides, unless it is purely visual content such as images or icons.

Mobile use: swipe or tap?

The problem is exacerbated on mobile devices: users often do not know whether a swipe leads to the next slide or whether it is static content. Without clear visual cues or interaction prompts (“Swipe me”), the carousel simply goes unnoticed or is misunderstood.

Interactive areas in the slide

Another problem arises when clickable elements such as buttons or links are integrated within the slides. These not only compete with the swipe gesture for navigation, but also with the rest of the interface, such as navigation bars or other interactive elements. This increases the risk of operating errors and further reduces usability.

Studies & Data

Carousels are one of the most discussed UI elements - and not without good reason: Numerous studies, tests and usage analyses have shown for years that they often perform significantly worse in practice than their visually appealing impression would suggest.

Low click rates & missed content

An often-cited study by the University of Notre Dame (2013) shows how rarely carousel slides are actually used:
Only 1% of visitors:inside clicked on a slide at all and of those, 84% of clicks were on the first one. The remaining slides were barely noticed or ignored. Source: erikrunyon.com - Carousel Interaction Stats

Attention ≠ Interaction

The Nielsen Norman Group has been warning about so-called “banner blindness” for years: Carousels are noticed, but often ignored as advertising or irrelevant content. The visual presence therefore does not automatically lead to interaction or understanding. Source: nngroup.com – Banner Blindness

Autoplay Leads to Loss of Information

Automatic switching is particularly critical: Usability tests show that content disappears too early due to autoplay, which disrupts the reading flow and leads to missed information. Users lose context - and are more likely to click on things they haven't fully understood. Source: nngroup.com – Auto-Forwarding

UX Tools Show: Carousels are hardly used

Heatmaps, session recordings and scrolling behavior also prove:
Carousels attract less attention, fewer interactions and lower conversion rates than static hero areas or structured content sections.
In practice, user behavior clearly speaks against carousels - even if they often appear to be a “modern” solution in the design process.

Bad Practice

Carousels are quick to install, but often poorly implemented. Many of the common carousel problems do not result from the element itself, but from its design. Here are the most common mistakes to avoid:

Autoplay without user control

An automatically changing carousel without the option of pausing or manual navigation massively disrupts the reading flow, especially with longer texts or on mobile devices. Autoplay also makes accessibility more difficult and can lead to cognitive overload.

Missing navigation elements

A carousel without arrows, swipe hints or pagination causes disorientation. Users often do not realize that additional content is available or do not know how to reach it.

Too many slides with too much content

If a carousel contains ten slides with long texts or several CTAs, it becomes a test of patience. Instead of clarity, it becomes overwhelming. Less is more here: a maximum of 3-5 slides with clear messages is a good guideline.

Insufficient accessibility

Many carousels are not accessible for screen readers, cannot be operated with the keyboard or do not provide feedback on position and change. This makes them simply unusable for many users and violates the WCAG accessibility guidelines.

Carousels as an “above-the-fold replacement”

Hiding important information or primary CTAs in a carousel is risky, as many users often only see the first slide. Content that is crucial for conversion should not appear on the third slide.

Examples

Even Apple: An automatic carousel that cannot be paused and has no clear navigation elements. It is not obvious which element the pagination belongs to.

apple.com

The navigation elements of the Carousel are difficult to recognize and move with the vertical scrolling. The videos in the Carousel cannot be paused.

zara.com

Best Practice

Despite all the criticism, there are scenarios in which a well-designed carousel can be useful - provided it is implemented carefully and in line with modern UX principles. Here are the most important best practices:

Enable manual control

Give the user control: a carousel should always be manually clickable - via arrows, swipe gesture or keyboard. If autoplay is used, it must be pausable and visually controllable (e.g. with a stop icon or on hover). In addition, the position of the control elements should not jump so that it is possible to navigate smoothly through several slides.

Clear, focused content per slide

Each slide should contain exactly one central message. A strong visual focus (image or icon) plus a short text and a clear call-to-action work better than cluttered content. The carousel is no substitute for an entire landing page.

Limited number of slides

A Carousel should not be endless. Studies recommend a maximum of 3-5 slides. Experience has shown that anything more is hardly used and only increases the loading time. A grid or tab system is more suitable for multiple content.

Clear indicators & visual navigation

Users need to recognize that they are in a carousel and how many slides there are. Dots, progress bars or a slide count display (“1/4”) provide orientation. Arrows should be large enough and clickable without barriers. For mobile implementation, it is advisable to display the arrows in addition to the swipe gesture in order to create an alternative input option.

Mobile & performance optimization

Carousels must be responsive, with functioning swipe navigation and touch-friendly controls. Images should be loaded adaptively (lazy loading, suitable resolutions) to minimize loading times and data consumption.

Ensure accessibility

A good carousel is also accessible for screen readers and keyboard users. ARIA roles, focus indicators, descriptive labels and alternative texts are essential. Visual changes should also not be too abrupt or unpredictable. A pause button must be available for automatically changing carousels.

Examples

A carousel displayed as a stack of cards. Google uses clear text labels such as “Next Card” and “Show Me” in this demo and offers an alternative to the carousel in the form of a grid display (right side of the image)

Google - The Web Can Do What!?

The Carousel module from Zeit.de displays three elements side by side. It offers clear navigation arrows for manual switching and a pause/play button to control the automatic slide change.

Zeit - Plan D

Al­tern­at­iven zum Carousel

If a carousel is not convincing in terms of UX or the content is hardly shown to its best advantage, it is worth taking a look at other UI patterns. Many of these alternatives offer better clarity, greater interaction and are easier to access - especially on mobile devices.

Grid layouts with simultaneous visibility

Instead of switching through content one after the other, it can also be displayed side by side, for example as a tile or card system. This means that several options are visible at a glance and users can compare or select directly.

[Translate to English:] Anstatt sich hinter Slides zu verstecken, lassen sich ähnliche Inhalte auch sehr gut als Grid darstellen.

Accenture - Startseite

[Translate to English:] Anstatt sich hinter Slides zu verstecken, lassen sich ähnliche Inhalte auch sehr gut als Grid darstellen.

Google - The Web Can Do What!?

Tabs or Accordions

Tabs or accordions help to make content accessible in a compact yet complete way without having to click through slides, especially for topics that belong together.

An accordion module that expands on interaction to reveal additional information and, if applicable, images.
An image with four linked tabs below it, allowing additional images to be displayed when selected.
An image with five linked tabs next to it, allowing additional images to be displayed when selected.

Accordions

They are similar to carousels, but provide additional information about the content / slides that are not currently visible.

Figma - Homepage

Horizontal Tabs

They are similar to carousels, but provide additional information about the content / slides that are not currently visible.

OpenAI - Sora

Vertical Tabs

They are similar to carousels, but provide additional information about the content / slides that are not currently visible.

OpenAI - Sora

“Let them scroll”

Sometimes the simplest solution is also the most effective: instead of hiding content in interactive elements such as carousels, they can be displayed one below the other in a linear list. Scrolling is an intuitive movement, especially on mobile devices, and users are used to it and won't miss any content. In addition, scrolling is a much lower hurdle than clicking on tabs, sliders or buttons: It requires less decision-making effort and no targeted interaction, but often happens quite automatically.

A frequent objection: “But then not everything is above the fold!” But this idea dates back to the days of classic desktop websites. Today, users scroll as a matter of course, often even excessively, as the phenomenon of doom scrolling shows: The endless scrolling through of content, driven by curiosity, FOMO or simply good UX. This behavior (used responsibly) can be an argument for displaying content openly instead of hiding it behind sliders or tabs.

A clear visual structure, targeted anchor points and relevant content ensure that even longer pages are not overwhelming, on the contrary: they can captivate users, guide them and invite them to linger.

Conclusion: When are carousels useful and when are they not?

Carousels can work if they are deliberately used as a stylistic device, not as a carrier of information.

Here is a decision aid:

Useful for…Unsuitable for…

Presentation of visual content (e.g. logos)

Storytelling or chronological sequences

Optional additional content (e.g. testimonials)

Purely visual campaign elements

Conveying important messages or CTAs

Information that needs to be fully captured

Navigation or conversion-relevant content

Mobile-first strategies without clear swipe hints

Keypoint

If the content is decisive for the user and not the effect of the visual presentation, then a carousel is rarely the best choice.