Accessibility Best Practice: ARIA role should be appropriate for the element
Closed this issue · 5 comments
I have been doing automated accessibility testing on an Omeka S site using the Item Carousel Block. The accessibility tool I am using for the testing is Axe Dev Tools, a free browser extension created by Deque. https://www.deque.com/axe/devtools/
The link to the item was flagged for using the ARIA Role tabpanel, which is more often used when creating a multitab display as below:
Description from Mozilla: https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/tabpanel_role
Example cited by Mozilla as proper use of tab panel (URL to screenshot above): https://codepen.io/heydon/pen/veeaEa/
I suggest removing that ARIA label
I have an update on this issue here.
I was trying to investigate this further, and I read that this carousel is an implementation of SlickJS, and that by inspecting that project, it seems as though the accessibility errors are coming from that upstream.
Going through the open tickets on SlickJS Github, there was an interesting comment from Accessible360. While they had reported several accessibility bugs to the repo, those were not getting closed.
They maintain a fork of SlickJS that they claim is a drop-in replacement for the library:
On Github: https://github.com/Accessible360/accessible-slick
Project Homepage and Demo: https://accessible360.github.io/accessible-slick/
I can confirm that when I use Axe Dev Tools (my preferred accessibility checking tool) I do not get the same ARIA errors from the Accessible360 fork that I do from the SlickJS project.
Thanks for your accessibility testing and the heads up on accessible-slick! It isn't quite drop-in due to some of the customizations we've made in our carousel's appearance, but we're working on integrating and testing now and should hopefully have something working soon.
Excellent! Thanks for sharing!
accessible-slick library is integrated as of the latest release, which will update later tonight.
Curious, does this fix also address the other ARIA-based issues you've created? (i.e. can I close?)
Just upgraded and tested. All of the ARIA errors and Link Errors were resolved by the upgrade to Accessible Slick.
The only issue that remains is #12
I think you could close the other three, and I will follow up on that issue there.