Websites sometimes feature content that moves or changes automatically, such as video backgrounds, slideshows, or carousels. These features can be extremely distracting to some users, and a mechanism should be provided that enables users to easily pause the changing content.
Techniques
- Include a prominent pause button for any content that moves or changes automatically. Be sure the pause or stop button is accessible with the keyboard and has a clearly visible focus indicator so keyboard users can easily see when they’re on the button. For additional information about these issues see Keyboard accessibility on websites.
- Consider whether the moving content needs to be moving by default. Alternatively, the same content could be paused by default, and a prominent play button would enable users to play it if they chose to. This provides users with a choice to explore content, rather than forcing them to do so.
In addition to providing a means of pausing moving content, web features such as slideshows or carousels can present a variety of other accessibility challenges and must be properly coded to ensure that keyboard users and assistive technology users have full access to the content and can operate the controls. For additional details on accessibility of slideshow or carousels, see the W3C Web Accessibility Initiative’s Carousels Tutorial, as well as the Carousel design pattern in the WAI-ARIA Authoring Practices. For additional information on ARIA, see ARIA on websites.