WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Sliders and their expected behavior


From: Bryan Garaventa
Date: Feb 20, 2015 11:01AM

One thing to note, which isn't mentioned in the ARIA Authoring Practices Guide, is that aria-orientation should be set to indicate
the vertical/horizontal orientation of a slider.

There are still some screen reader bugs associated with this attribute, which can be seen by comparing feedback at
Horizontal: http://whatsock.com/tsg/Coding%20Arena/ARIA%20Sliders/Horizontal/demo.htm
Vertical: http://whatsock.com/tsg/Coding%20Arena/ARIA%20Sliders/Vertical/demo.htm

In JAWS16 for example, in IE11 and FF, if you set focus to the slider in Forms Mode then tab out then into the slider, it will
announce the literal opposite of what it should be doing for the proper orientation, saying that a horizontal slider is a "Up Down
Slider", and the vertical slider is a "Left Right Slider". This is a bug in JAWS however.

-----Original Message-----
From: <EMAIL REMOVED> [mailto: <EMAIL REMOVED> ] On Behalf Of Mary Elizabeth Sullivan
Sent: Friday, February 20, 2015 6:24 AM
To: WebAIM Discussion List
Subject: Re: [WebAIM] Sliders and their expected behaviour

Thank you Steve! I think this will give me what I need.

All the best,

Sent from my iPhone

> On Feb 20, 2015, at 09:04, Steve Faulkner < <EMAIL REMOVED> > wrote:
> this may help
> Slider (widget) design pattern
> http://www.w3.org/WAI/PF/aria-practices/#slider
> --
> Regards
> SteveF
> HTML 5.1 <http://www.w3.org/html/wg/drafts/html/master/>;
> On 20 February 2015 at 14:01, MEJ - Beth Sullivan <
> <EMAIL REMOVED> > wrote:
>> Hello,
>> For horizontal sliders visually using the left and right arrow keys
>> makes sense for a keyboard user to change the values.
>> For screen reader users, is the expectation that the left and right
>> or up and down keys would work the same way?
>> Screen reader users wouldn't necessarily know what the orientation of
>> the slider is, it could be a volume slider like on Windows that
>> visually displays vertically, or it could be to identify a range and
>> marked up horizontally.
>> What are AT users and testers experiences with these slider components?
>> Thank you,
>> Beth
>> >> >> list messages to <EMAIL REMOVED>
> > > list messages to <EMAIL REMOVED>