Overview
The Carousel is somewhat complicated accessibility-wise because it has images, motion (revolving images), text, and links.
The article details the necessary steps to assure the Carousel Module accessibility as per Americans with Disability Act (ADA) and Section 508 of the Rehabilitation Act.
Information
To assure the Carousel Module accessibility as per Americans with Disability Act (ADA) and Section 508 of the Rehabilitation Act, Implement the steps listed below:
Motion
Unless your carousel only has one image, you need to include at least one of the two options for navigation: arrows and dots.
Images
Images are the essential part of the Carousel Module, thus following accessibility rules for images should be applied when using the Carousel Module:
-
You should add alternative text to images in the carousel by first clicking the thumbnail in the carousel and then clicking the image itself.
-
For each selected image, use the Alt Text field in the toolbar to enter the alternative text.
-
If the image includes content not entered into the banner (see the section below), then you must use alternative text. Otherwise, leave the alternative text field blank.
-
If in doubt, better to use alternative text than not.
Banner
The banner includes text and an optional button that contains a link.
This arrangement allows you to use ambiguous text for the button (e.g., learn more), which would typically not be acceptable.
However, it is a good practice to always use non-ambiguous text on links and buttons as pictured in the example below.