Keyboard-A11y Plugin demo: Screen Reader experience problems

Joseph Scheuhammer clown.idi at gmail.com
Mon Nov 29 18:00:22 UTC 2010


Anastasia,

This is discouraging.  After thinking about it, I have my doubts that 
any dhtml/aria slider works with a screen reader.  I suspect the browser 
is not updating a11y api properly.

You wrote:

> Semantically, it is a slider, but the markup I'm using (five images inside a div) does not conform to the markup that the ARIA slider role and attributes work with (a single "thumb" element that gets moved).

Yes, typically sliders have a thumb for users to interact with to change 
the slider's value.  They either move the thumb using a mouse, or put 
keyboard focus on it and reposition it with arrow keys.  Since it is the 
thumb that is associated with the events (mouse, focus, keyboard), 
that's the element that is appropriate for the aria markup, and for the 
a11y information.

Based on that, I would assume that even if one doesn't have a thumb, 
then the situation requires some other element that emits the events; 
and that the aria information would be associated with that element.  I 
had hopes for the mindtrove slider example [1] since it doesn't have a 
thumb, but it handles the events appropriately in that, for example, it 
keeps focus on the slider container even as one clicks on a star, or 
uses arrow keys to increase or decrease the slider value.  It also puts 
the aria slider markup on that container, and updates it appropriately 
(e.g., aria-valuenow).

I take it that you tried it, but it doesn't work with a screen reader.  
Oddly, that leads me to conclude that a slider with a thumb doesn't work 
either, because at an abstract level, they have the same aria 
properties.  The browser can't tell that there is a thumb present or 
absent -- it doesn't have eyes.  All it knows is there is an element 
with the role slider that is emitting various events, and it should 
publish that information accordingly the the a11y API.

Howver, if a thumb-based aria slider does in fact work, but the 
thumb-less doesn't, what's the difference?  Something for me to look into.

[1] http://mindtrove.info/html/rating-tutorial.html

-- 
;;;;joseph

'Clown control to Mao Tse Tung.'
  - D. Bowie (misheard lyric) -




More information about the fluid-work mailing list