Carousel
A horizontally scrolling row of items that the user pages through, often with dots or arrows to navigate.
Carousels show a sequence of items in a fixed slot, with the user advancing one at a time. They became infamous on marketing sites in the 2010s after research showed users mostly ignored auto-advancing hero carousels. Today they're more common in mobile UI: image galleries, story rings, app onboarding. Modern carousels often rely on CSS scroll-snap rather than custom JS, which gives free keyboard and touch support. The W3C ARIA pattern is called 'Carousel'.
Also called
sliderimage sliderswiperslideshow
When to use
- Image galleries where each image is worth seeing
- Story rings or short content reels on mobile
- Onboarding screens the user pages through manually
When not to use
- Auto-rotating hero banners on a homepage (users tune them out)
- Critical content that must be seen (only the first slide is reliably viewed)
- Long lists where scrolling is more natural
Related
Source
W3C ARIA Authoring Practices Guide ('Carousel'). Nielsen Norman Group has well-known research warning against auto-rotating hero carousels.