Accessibility ( a11y )

Slider a11y

Overview
Elements
Slider a11y
Elements
Video a11y
No items found.
Published
September 26, 2023
Updated
September 26, 2023
in lightbox

Sliders are relatively complex elements for accessibility.

They will often be flagged in accessibility audits, and will become a sticking point for a fair bit of your a11y compliance work.

Webflow Slider

Fortunately, Webflow's slider has updated to add some features in this area, which may help.

https://discourse.webflow.com/t/how-to-build-an-accessible-dropdown-in-webflow-with-custom-code/85931

Swiper.js

Often a popular solutions for this is swiper.js which has a wide range of a11y capabilities.

https://swiperjs.com/swiper-api

aria-hidden=true

One limitation of swiper.js may be the aria-hidden attribute when is meant to be applied to all hidden slides.

Here are some notes and possible solutions;

https://codepen.io/ademcifcioglu/pen/mBgazz

https://github.com/nolimits4web/swiper/issues/2169

https://github.com/nolimits4web/swiper/issues/2929

Videos
No items found.
Table of Contents
Comments
Did we just make your life better?
Passion drives our long hours and late nights supporting the Webflow community. Click the button to show your love.