elements icon indicating copy to clipboard operation
elements copied to clipboard

[A11y]: InoCrousel & InoCarouselSlide

Open Sl1nd opened this issue 1 year ago • 0 comments

Currently InoCarousel is not accessible at all. Things that must be implemented/missing:

  1. "left" and "right" InoIconButtons do not provide 'aria-labels'
  2. <div "ino-carousel__container" should be refactored to '
    ' Element
  3. <div "ino-carousel__container" should provide a aria-roledescription with value "carousel"
  4. <div "ino-carousel__container" should provide a configurable "aria-label" for expressing meaningful information of the Carousel
  5. "ino-carousel-slide" should have role group with the property aria-roledescription set to slide.
  6. Each slide has an accessible name provided by a configurable 'aria-label"
  7. `<div "ino-carousel__stepper" should implement role="tablist"
  8. Each step dot requires role="tab"
  9. Each step dot needs an accesible name representing the Slide it selects e.g. aria-label="Slide 2"
  10. If the carousel can automatically rotate it requires an explicite button for stopping autmation
  11. Keyboard focus as well as hovering via the mouse stops roation

For Keyboard interaction as well as further details refer to https://www.w3.org/WAI/ARIA/apg/patterns/carousel/

Sl1nd avatar Jan 24 '24 11:01 Sl1nd