Hi @mdmamunkhan
Glad you reached out to us about this.
Uses ARIA roles on incompatible elements
This pertains to the slide’s aria-label. The notice is showing because:
- The
role="tabpanel" was used on a slide in a carousel.
- But
tabpanel is meant for tabbed content, not slides.
- This can confuse screen readers because they expect tabs, not slides.
We have an internal task to fix this, but there isn’t a temporary workaround that I could give as of the moment. I’ll make sure to send a follow up here once the labels are corrected.
[aria-hidden=”true”] elements contain focusable descendents
I can confirm this. One way to remove that warning from Google PageSpeed Insights is to not add a link to the image:
- Go to Customize > Posts/Pages Layout > Archive Layout.
- Scroll down to the Post Item Elements and expand “Feature”.
- Turn off the “Image is link to post” option: https://share.zight.com/9ZupZqeZ
I hope this helps, and let me know if you have any other concerns!
Hi @mdmamunkhan !
I want to give some updates about this topic.
We use the Splide.js library for our carousels. Splide v4 follows the W3C Carousel Design Pattern and includes a built-in Live Region so screen readers can announce changes as slides move. You can read more about Splide’s accessibility approach here: Accessibility – Splide.
Splide also makes some intentional enhancements beyond the base W3C pattern. For example, when pagination dots are enabled, Splide switches the carousel’s role to tabpanel to improve navigation for assistive technologies. If the dots are removed, the component will instead present a group role, which may match what you’re expecting to see.
These behaviors are part of Splide’s deliberate design decisions to improve accessibility, and everything is currently working as intended. For that reason, we won’t be making changes on our side at this time.
If you have any other questions or need further clarification, feel free to let us know! Otherwise, I’ll mark this ticket as resolved after a few days.
