WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Carousel with multiple items - recommended keyboard operation when activating Next-button

for

From: glen walker
Date: May 9, 2023 12:06PM

If you're asking solely about where the keyboard focus should be after
selecting "next" (or "prev"), my general rule of thumb is to never force
the focus off what the user just clicked on. There are only a few
situations where I programmatically move the focus. One is if the element
that was just clicked on is no longer available. Perhaps you clicked on
"close" from a dialog so now the dialog is no longer available, then the
focus has to be moved somewhere. Or if you open a dialog, the focus should
be moved into the dialog.

But on a carousel (if you choose to use one), clicking on next should leave
the focus on next. As a keyboard user, I might want to scroll through all
the carousel items. If you keep moving my focus back to a slide, I have to
keep tabbing back to "next" in order to advance.

So if you leave the focus where it is, the next question might be, "how
does a screen reader user know that new content was added?". If the
carousel container is labelled properly and the user understands the
purpose of the carousel, then clicking "next" will already be understood
that new content will be added. The user might not know if totally new
content is added (6 new slides) or if some of the previous content was
removed but some of it is still there and some new content was added. This
is where UX testing comes into play. You could announce that 3 new slides
were added or you could say nothing. Let users try it out and decide which
one makes more sense to them.