Carousels: Usability and Accessibility Issues

Usability

• Visitors often scroll past carousels – both on large and small screens.
• Website users might confuse moving images with advertising.  
• People are unlikely to move on to other slides or wait for the carousel to move through slides. 
• Auto forwarding of images can annoy. 
• People miss information because it wasn’t the first slide or the slides moved on automatically. 
• Slides shouldn’t replace effective navigation. 
• Controls don’t work on all touchscreens.   

Accessibility

Carousels can cause problems for people using assistive technology. Ensuring a carousel is accessible will also improve usability.

• Users must be able to pause carousel movement as it can be too fast or distracting, making text hard to read. 
• All functionality, including navigating between carousel items, must be operable by keyboard. 
• Changes to carousel items must be communicated to all users, including screen reader users. 
• The keyboard position (“focus”) is managed in a reasonable and comprehensible fashion. 
• Text shouldn’t be an image as this makes it inaccessible. The alt tag is to describe the image, not to try to turn image text into HTML.

Design and message 

• Need to ensure that important content isn’t only included on a slide in the carousel as users are likely to miss this. Need to include links to this information in the navigation as well.
• Carousels are sometimes used to fix ineffective navigation by pointing people to important content that is being overlooked. This won’t solve the issue (people unlikely to notice the content and won’t be available from other parts of the site).
• It is easier to find one good quality image than a series of images. Images that are part of a rotating carousel might not seem as important as they only appear on the page for a limited period.
• If using sets of related images to portray an organisation and its activities, only seeing one of these images might not give an accurate idea of the organisation.  Visitors are unlikely to watch/scroll through the entire set of slides.
• Thought about whether people will select a better quality image if they are sourcing a single image for the homepage of website. Finding multiple images might result in a set of lower quality images.
• Animated content can resemble adverts – people are more likely to ignore an animated item that looks like an ad.
• Make sure navigation and links are clear and large enough to use.  

SEO

• Text on images won’t be assessable to search engines.
• Alt tags are not intended/expected to replace the HTML content – Alt tags – this is not intended/expected to replace the HTML content – but to describe the image. 
• Alt tags do not support headings etc making it difficult for search engines (and more importantly visually impaired users) to understand the structure and content of the slide.  

Articles

There are a lot of resources about carousels online. For example:    

• Image Carousels: Getting Control of the Merry-Go-Round
• Carousel Usability: Designing an Effective UI for Websites with Content Overload  
• Auto-Forwarding Carousels and Accordions Annoy Users and Reduce Visibility 
• Carousel Concepts (Accessibility)
• Design debate: are image carousels UX assets or liabilities?
• Rotating Website Carousels: 4 Alternatives That Drive Sales  
• Carousels on mobiles
• 6 Design Alternatives to Avoid Slideshows
• Should I Use a Carousel