search

brainhubeu / react-carousel

A pure extendable React carousel, powered by Brainhub (craftsmen who ❤️ JS)
https://brainhub.eu/
MIT License
1.07k stars 164 forks source link

WCAG Compliance #535

Open frkgrall opened 4 years ago

frkgrall commented 4 years ago

Hi there ! Just found out that there is some things to do to make this library fully compliant with WCAG for accessibility. I just want to know if this is something already planned or not ;) For the moment I'm creating this behaviour with controlled element, but I think that some of these features must be available any time (for example, using the keyboard arrows)

Here is the extract of w3 doc : https://www.w3.org/WAI/tutorials/carousels/

What makes a carousel accessible? Users must be able to pause carousel movement because it can be too fast or distracting, making text hard to read. All functionality, including navigating between carousel items, must be operable by keyboard. Changes to carousel items must be communicated to all users, including screen reader users. The keyboard position (“focus”) is managed in a reasonable and comprehensible fashion. Note: Carousels are disputed from a usability perspective because their content can be hard to discover. Ensuring accessibility can also improve usability.

piotr-s-brainhub commented 4 years ago

@fhourdin

Thanks for this suggestion.

Some of these features are already proposed:

Regarding the speed, it's configurable with the animationSpeed param.

If you see any other features to implement, I invite you to open issues for that.

piotr-s-brainhub commented 4 years ago

@fhourdin

I invite you to also like (👍) issues which you'd like to be fixed/ implemented so more 👍 an issue has, it's more likely to be implemented by us.

frkgrall commented 4 years ago

Didn't saw the keys option ! My mistake ! Thank you for your answer

piotr-s-brainhub commented 4 years ago

You're welcome.