Live example

Accessible Testimonial Carousel

The carousel below is the module itself. Drive it with the arrows, then put the mouse down and use Tab and Enter.

Site pages, landing pages, blog Setup guide

Try this

Tab to the previous or next control and press Enter. The slide changes, focus stays on the control, and a screen reader hears which slide it landed on. The wording below is illustrative, not a real customer quote.

Sample quote, one of three

Replace with a customer name and role

Each slide is announced as a group with its position, so someone using a screen reader hears "1 of 3" rather than all three quotes at once.
Sample quote, two of three

Replace with a customer name and role

The previous and next controls are real buttons. Tab reaches them, Enter and Space operate them, and the focus outline stays visible instead of being styled away.
Sample quote, three of three

Replace with a customer name and role

Autoplay is off unless you switch it on, and when it is on there is a pause control. Content that moves on its own has to be pausable to meet WCAG at level A.

What the module does that a plain carousel does not

Arrows are buttons, not styled divs, so the keyboard reaches them without extra code.
Each slide carries aria-roledescription="slide" and a position label.
A live region announces the change, so the move is not silent.
Autoplay is opt in, and pausable when it is on.
Arrow, indicator and active indicator colours are separate fields, so the controls can always be made visible against your slide background.

What to do next

Read the setup guide, or tell us what you are building: support@freelopers.com.