WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Regarding an ARIA calendar picker control that supports automatic accessibility for SR and keyboard users

for

From: Bryan Garaventa
Date: Dec 19, 2011 10:54AM

I see what you mean about the unavailable dates, the addition of custom
dates would have to be programmed separetly within the module on a
case-by-case basis however, since everyone's implementation would differ.
This could easily be done by any developer wishing to modify the script for
their purposes.

Regarding the focus issue in NVDA with IE and JAWS with FF, this problem
doesn't actually have anything to do with the scripting within the calendar
module, but rather is a result of NVDA's lack of full ARIA support in IE,
and JAWS' lack of full ARIA support in FF. NVDA is geared to work more
comprehensively with FF, and JAWS is geared to work more comprehensively
with IE. This is a design choice of the screen reader developers, and can't
be controled by any web UI developer.


----- Original Message -----
From: "Sailesh Panchang" < <EMAIL REMOVED> >
To: "WebAIM Discussion List" < <EMAIL REMOVED> >
Sent: Monday, December 19, 2011 9:08 AM
Subject: Re: [WebAIM] Regarding an ARIA calendar picker control that
supports automatic accessibility for SR and keyboard users


> Non selectable dates: Well in your examples, one can select any date
> in the month. But I am referring to a scenario where certain dates are
> not available. e.g. one cannot schedule a bank transaction on a date
> the bank is closed. Or maybe one cannot get an appointment at the
> doctor's office, say on a Sunday ... so these dates would be
> unavailable. No I am not referring to blank spaces in the table before
> /after first / last day of month.
> UA/AT issue: Well as I said up/down arrow key seemed to work as
> expected when using JAWS13 with IE (and not JAWS with Firefox 8) and
> with NVDA and Firefox (and not NVDA and IE). So down arrow from Dec 19
> does not go to Dec 26 as one may expect when using IE with NVDA.
> That's my experience.
> Tab order: Right, I understand. But when dates are exposed as links,
> one is tempted to tab as one does on a page usually.
> Sailesh
>
> On 12/19/11, Bryan Garaventa < <EMAIL REMOVED> > wrote:
>> Thanks :)
>>
>> The reason why I chose not to include all date links in the tab order is
>> that it would take approximately 30 keypresses to navigate passed the
>> control if so, which could get annoying very quickly.
>> Since the arrow keys can be used to quickly jump to a date, one at a
>> time,
>> or by column in 7 day increments, it's more efficient to jump to a date
>> in
>> this manner.
>> Pressing tab is designed to close the control in the same fashion as an
>> ARIA
>> menu for convenience, focusing back on the triggering element.
>>
>> When you say 'non-selectable dates should be navigable to but not
>> selectable', I asume you are refering to the blank cells at the
>> beginning/end of the calendar month. These actually aren't links, but
>> empty
>> TD elements that have no link markup or label associations. Is there a
>> benefit to providing keyboared focus to non-actionable elements such as
>> these when they have no functionality?
>>
>> I don't understand what you mean by
>> 'admittedly, there are UA / At limitations like up/down key allows one
>> to
>> navigate a column (day of week) only with JAWS in IE and with NVDA in
>> FF.'
>> The keyboard functionality for the calendar widget is programmed in the
>> JS
>> file at
>> http://whatsock.com/modules/aria_calendar_module/js/setup.js
>> and is cross-browser compatible, so it will work regardless whether a
>> screen
>> reader is running, on IE, FF, Opera, Safari, and Chrome.
>>
>> The only limitation based on screen reader type and version is whether or
>> not ARIA support is included within the AT/browser combination being
>> used,
>> and this is unfortunately impossible to predict using scripting alone.
>>
>> ----- Original Message -----
>> From: "Sailesh Panchang" < <EMAIL REMOVED> >
>> To: "WebAIM Discussion List" < <EMAIL REMOVED> >
>> Sent: Monday, December 19, 2011 7:44 AM
>> Subject: Re: [WebAIM] Regarding an ARIA calendar picker control that
>> supports automatic accessibility for SR and keyboard users
>>
>>
>>> Bryan,
>>> Yes this works alright but a couple of observations
>>> - all dates are exposed as links but one cannot tab from one date to
>>> the next as one does between links
>>> - non-selectable dates should be navigable to but not selectable
>>> - admittedly, there are UA / At limitations like up/down key allows
>>> one to navigate a column (day of week) only with JAWS in IE and with
>>> NVDA in FF.
>>> Sailesh
>>> On 12/16/11, Bryan Garaventa < <EMAIL REMOVED> > wrote:
>>>> Hi,
>>>> I started working on this one mainly to see if I could get the ARIA
>>>> grid
>>>> type roles working using a practical implementation, such as a calendar
>>>> picker control that supports full accessibility. Unfortunately though,
>>>> it
>>>> appears that role=grid and all associated roles have no impact on
>>>> tabular
>>>> navigation structures. So I switched to plan B and used role=dialog,
>>>> role=button, role=link, aria-selected, aria-label, and tabindex to do
>>>> it
>>>> anyway.
>>>>
>>>> This is what it does, in the standard fashion of calendar pickers, you
>>>> just
>>>> click the Calendar link to open the Calendar picker control.
>>>> Then you can use the arrow keys to navigate each cell of the grid in
>>>> tabular
>>>> fashion using the structure of the underlying table.
>>>> Press Home or End to jump to the beginning or end of a row,
>>>> or PageDown or PageUp to jump to the next calendar month.
>>>> The buttons for moving forward and backward can also be accessed using
>>>> ShiftTab, since focus is automatically set on the current day of the
>>>> month
>>>> by default.
>>>> Press enter on a date to make a selection, or press Escape or Tab to
>>>> cancel
>>>> and close the calendar.
>>>> You can also just click on a date to select it. (Boring and very
>>>> sad...)
>>>>
>>>> If you'd like to give it a spin, the demo is at
>>>> http://whatsock.com/modules/aria_calendar_module/demo.htm
>>>>
>>>> This functionality works best with JAWS12/13 with IE8/9 and FF, and
>>>> NVDA
>>>> with FF.
>>>>
>>>> Best wishes,
>>>> Bryan
>>>>
>>>>
>>>> http://www.linkedin.com/in/bgaraventa
>>>>