WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: [EXTERNAL]Accessible Carousel Working

for

From: Radhika Soni
Date: Jan 5, 2021 3:15PM

Thank you so much for your response and examples. My question here is- If
we have a carousel with pagination dots and a next and previous button. If
the user hits the next or previous button, should the focus move on to the
slide which is shown on the screen or should it stay on the previous or
next button. Will it cause any kind of violation if we move the focus on
the slide?

Also, the example you have referred-
https://www.w3.org/WAI/tutorials/carousels/working-example/ if user moves
to the next slide the screen reader has to come back to the slide to read
what is on that slide. Is that ok. Should we not force the focus on the
slide when the user hits the next slide. Let me know, what are your
thoughts on it

Thank you in advance!

Regards,
-Radhika


On Tue, Jan 5, 2021 at 11:43 AM Mark Magennis < <EMAIL REMOVED> >
wrote:

> Radhika,
>
> There are different types of carousels. The W3C tutorial that Jerra linked
> to concerns the 'scrolling banner' type carousel that was very popular for
> a while a few years ago but less so now. That type of carousel displays a
> constantly changing sequence of items, typically some site feature or
> product offering, one at a time. Items may be clickable links taking you to
> a page for that item of may include a number of links. These carousels
> usually auto-scroll.
>
> Another typical 'carousel' type that is very popular now is the Netflix
> style carousel which contains a strip of 'cards' representing media items
> such as movies. The carousel shows maybe 5-12 cards at a time but does not
> auto-scroll. It has 'Previous' and 'Next' buttons for displaying the
> previous or next strip. Individual cards are usually clickable and may also
> contain other clickable items such as an "Add to Favourites" button.
>
> There are similarities and differences and the appropriate keyboard
> interaction patterns may be different in each case. What kind of carousel
> are you taking about?
>
> Mark
>
>