Information

Help us improve the Design System by taking our short survey.

New

Carousel

A carousel lets users horizontally scroll through a selection of images. They’re widely used on media and e-commerce platforms.

This component is not included in the Scottish Government Design System or most other government design systems.

We offer a range of other patterns and components to help your users find your content. For example, we offer 3 types of navigational page pattern.

Evidence of usability issues with carousels

Carousels can obscure other content

Users did not scroll below the carousel in testing of the GOV.UK homepage.

This suggests that users miss content below carousels.

Carousel content can get ignored

Most users did not interact with the carousel during tracking on the University of Notre Dame website.

The users who did interact with the carousel mostly engaged with the first image. The other images were ignored or not seen.

This suggests that carousels may not be an effective way to get users to make onward journeys.

Carousels need adaptations to be accessible

Carousels must be:

  • usable with a keyboard
  • pausable
  • clearly communicate content updates to assistive technology

The W3C Web Accessibility Initiative (WAI) has carousel guidance but notes they're disputed from a usability perspective.

For example:

  • carousels force users with screen magnification software to scroll more
  • controlling the movement of a carousel requires keyboard users to make extra tabs
Back to top