WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Aria Sliders on Mobile

for

From: Bryan Garaventa
Date: Nov 22, 2019 10:42AM


Hi,
That's correct. This component does use role="slider", but it too has to have a mobile fallback for touch devices.
http://whatsock.com/tsg/Coding%20Arena/ARIA%20Sliders/Horizontal/demo.htm

In my last conversation with Apple about this, it is unlikely that role=slider will ever be adequately supported by VoiceOver within web technologies using standard JavaScript for drag and drop slider functionality. To do this, the accessibility API would need the ability to pass events to and from the browser where gestures like the up/down swipe movement would increment or decrement the slider, and there is no way for the platform API to identify what the intended behavior of the JavaScript is meant to be, and simulating this would end up doing nothing as it currently does. This is why the only accessible solution is to provide increment and decrement buttons in addition to the ARIA Slider widget to ensure accessibility across various platforms. In contrast, the slider widget on native iOS apps does work correctly like this, because within X Code there is an API that allows these events to pass back and forth in a manner that can be reliably processed.

In short though, ARIA Sliders using standard JavaScript for drag and drop will likely never work correctly within touch-based platforms unless a dedicated drag and drop API is created to handle this functionality at the platform level. You can read more about the background for this discussion here.
https://www.linkedin.com/pulse/important-considerations-regarding-accessible-drag-drop-garaventa/

All the best,
Bryan


Bryan Garaventa
Principal Accessibility Architect
Level Access, Inc.
<EMAIL REMOVED>
415.624.2709 (o)
www.LevelAccess.com

-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of Greg Jellin
Sent: Friday, November 22, 2019 7:39 AM
To: <EMAIL REMOVED>
Subject: Re: [WebAIM] Aria Sliders on Mobile

Thanks Detlev,

This component does work with both Talkback and VO by basically allowing the user to double tap the range input min/max buttons to manipulate the slider position. This is a great fallback for AT users on mobile.

That said, it is not a true slider (role=slider). Can we confirm that the role=slider is still not supported by VO/Talkback?

Greg

On 11/22/2019 7:30 AM, Detlev Fischer wrote:
> Sorry, hit ENTER accidentally before finishing mail!
> This is the slider example (Patrick Lauke) you may want to look at:
> https://www.w3.org/WAI/WCAG21/working-examples/providing-single-point-
> control-slider/
>
>
> Am 22.11.2019 um 14:36 schrieb Greg Jellin:
>> Hi All,
>>
>> I'm investigating the use of sliders (role=slider), with the
>> intention of finding a slider that also works with VoiceOver/iOS and
>> Talkback/Android. I've read some old Webaim threads that indicate the
>> slider role is not well supported by VO or Talkback. Does anyone know
>> if anything has changed or can point me to a working slider?
>>
>> I've tested several "accessible" sliders and none function as
>> expected/desired. The following were tested:
>>
>> https://www.w3.org/TR/wai-aria-practices-1.1/examples/slider/slider-1
>> .html
>>
>>
>> https://dequeuniversity.com/library/aria/custom-controls/sf-slider-mu
>> ltirange
>>
>>
>> https://codepen.io/davidchin/full/GpNvqw
>>
>> Thanks,
>>
>> Greg
>>
>> >> >> archives at http://webaim.org/discussion/archives
>> >