Better Alternatives to Carousels: How YaleSites Prioritizes User Experience

Overview

Carousel image blocks (also called sliders or rotating banners) are a common website feature that allow multiple pieces of content to occupy a single space on a webpage. While they’re popular and frequently requested—with research from the Baymard Institute showing that “52% of the top US e-commerce sites have a carousel on their desktop homepage” (UX Planet, “The Usability of Carousel Design”)—YaleSites has intentionally chosen not to implement carousel functionality as a Content Block. This decision is based on extensive user experience research, accessibility concerns, and our commitment to creating websites that effectively communicate Yale’s content to all users.

The Research on Carousel Effectiveness

The greatest benefit of carousels is that they enable multiple pieces of content to occupy the same prime real estate on a homepage, which can help diffuse internal disagreements about whose content deserves priority placement. However, this organizational convenience comes with significant drawbacks for the actual website users.

Research from UX experts including Nielsen Norman Group (Carousel Usability: Designing an Effective UI for Websites with Content Overload) has consistently demonstrated that carousels are problematic from a user experience perspective:

  • Low visibility: Users often immediately scroll past large carousel images, missing all or most of the content within them. Even in studies where carousels received attention, users typically only saw the first slide.
  • Banner blindness: Many carousels are ignored because they resemble advertisements that users have been conditioned to overlook.
  • Limited effectiveness: Studies have repeatedly shown content delivered via carousels is often missed by users with few people interacting with them.
  • Mixed signals: A designer may think of the carousel as a collection of images that collectively convey a message, but users typically only see one image and may get the wrong impression about an organization’s purpose.

Accessibility Concerns

Carousels present several accessibility challenges that are difficult to fully resolve:

  • Keyboard navigation issues: Many carousel implementations are difficult or impossible for keyboard-only users to navigate effectively.
  • Screen reader compatibility: Carousels often create barriers for screen reader users who can struggle to locate and interact with carousel content.
  • Auto-rotation problems: Auto-advancing carousels can prevent users from reading content before it rotates away, leading to frustration and missed information.
  • Mobile usability challenges: On mobile devices, carousels suffer from low discoverability, and swipe gestures used for carousel navigation can conflict with system gestures on iOS devices.

Better Alternatives

Rather than implementing an interactive element with known usability and accessibility problems, YaleSites recommends these more effective alternatives:

  • Static hero images with clear messaging that communicate a single, strong priority
  • Content prioritization through thoughtful placement in the page hierarchy
  • Engaging, scannable layouts that allow users to quickly find the content that matters to them
  • A grid of feature blocks that display multiple content pieces at once rather than hiding them behind navigation

But What If We Really Need Multiple Featured Images?

We understand that some sites genuinely need to highlight multiple important pieces of content. In these cases, we recommend:

  1. Use a grid layout of feature blocks to display multiple pieces of image content simultaneously
    1. This can be done with the Image Grid or the Interactive Grid blocks.
  2. Prioritize your content and present the most important item first
  3. Develop a content strategy that relies on user-initiated navigation rather than automatic rotation
  4. Consider using a single, strong hero image that links to a collection page
    1. This can be done with the Grand Hero, Action, or Image Banner blocks.

Looking Forward

As we continue to develop the YaleSites platform, we want to emphasize that our decisions are guided by evidence-based research and a commitment to creating the best possible experience for all users. While carousels remain a popular design trend, our primary goal is to ensure that Yale websites effectively communicate content in the most accessible and user-friendly way possible.

We understand that design preferences evolve, and we regularly reassess our platform features based on emerging research and community feedback. Should future studies demonstrate that carousel implementations can overcome their current limitations, we would be open to reconsidering our approach.

Have feedback about the YaleSites Platform?

Help us improve YaleSites! Share your feedback for a better experience.

Provide Feedback