WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Accessible Datepicker & NVDA Support

for

From: Mike Barlow
Date: May 22, 2016 2:55PM

Bryan - Although, after my previous posting on this topic, I notice that
there is an "aria-practices" document that has the "recommended(?)"
keyboard interaction for a Date Picker Widget that was put up by the W3C -
https://www.w3.org/WAI/PF/aria-practices/#datepicker (though I still
maintain that Alt-Y and Alt-M could be used to allow a user to edit the
month/year of a date)

*Mike Barlow*
Web Application Developer
Web Accessibility/Section 508 SME

Lancaster, Pa 17601
Office: 732.835-7557
Cell: 732.682.8226
e-mail: <EMAIL REMOVED>

On Sun, May 22, 2016 at 4:41 PM, Mike Barlow < <EMAIL REMOVED> > wrote:

> Bryan, nice looking Date Picker but one thing I would probably do would be
> to add a couple of other keyboard shortcuts and enhancements:
> Alt-Y - Puts you into a "Year" field where the year is displayed and allow
> you to enter a specific year (for example if I have to "Alt-PageDown" from
> 2016 to 1950 that's a lot of keystrokes
> Alt-M - Same for a "Month" field.
>
> And is there any "standard" way (other than simply putting the
> instructions on the page) to inform a user what the keyboard shortcuts are
> for a particular custom widget like this?
>
> *Mike Barlow*
> Web Application Developer
> Web Accessibility/Section 508 SME
>
> Lancaster, Pa 17601
> Office: 732.835-7557
> Cell: 732.682.8226
> e-mail: <EMAIL REMOVED>
>
> On Sun, May 22, 2016 at 3:51 PM, Bryan Garaventa <
> <EMAIL REMOVED> > wrote:
>
>> Thanks, that does help.
>>
>> I see what you mean about the date format, though this is challenging
>> because this is totally customizable in the setup, where a developer can
>> literally do whatever they wish, such as "Saturday March 15, 2018",
>> "2017-03-15", "03/15/2017", or anything else, and this can be tied to
>> individual select elements for Month Day and Year, or to an edit field such
>> as this. So writing an algorithm to predict anything a developer wants to
>> do is impossible. That being said though, it is possible to manually set a
>> date within the datepicker JavaScript object, so I can write instructions
>> for doing this with a test page. Also putting a placeholder with the date
>> string format would probably help, so I'll change this later this week.
>>
>> Regarding the keystrokes, it is true there are a lot, yet this difficulty
>> will be the same for all date pickers out there. I'll look into adding a
>> help icon that can be used to pop these open, which should help.
>>
>> I'll look into the other observations too, there is likely a way at
>> present to control the datepicker from the edit field now, though I will
>> need to build this from scratch. Even if I do this though, users still
>> will not automatically know what all of the keystrokes are accept through
>> trial and error, the same as all such datepickers out there.
>>
>> FYI, you can scan through the years by holding down Alt+PageUp or
>> Alt+PageDown.
>>
>>
>> Bryan Garaventa
>> Accessibility Fellow
>> SSB BART Group, Inc.
>> <EMAIL REMOVED>
>> 415.624.2709 (o)
>> www.SSBBartGroup.com
>>
>> -----Original Message-----
>> From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On
>> Behalf Of Chaals McCathie Nevile
>> Sent: Sunday, May 22, 2016 1:43 AM
>> To: WebAIM Discussion List < <EMAIL REMOVED> >
>> Subject: Re: [WebAIM] Accessible Datepicker & NVDA Support
>>
>> Hi Bryan,
>>
>> On Sat, 21 May 2016 08:52:36 -0000, Bryan Garaventa <
>> <EMAIL REMOVED> > wrote:
>>
>> > Hi Chaals,
>> >
>> > " Figuring out what makes an accessible date picker, and finding a
>> > *really* good one, gives us insight into quite a lot of complex
>> > problems."
>> >
>> > Please test the following when you have a chance, it would be good to
>> > get your opinion on this one.
>> > http://whatsock.com/tsg/Coding%20Arena/ARIA%20Date%20Pickers/ARIA%20Da
>> > te%20Picker%20(Basic)/demo.htm
>>
>> There's a lot to like, obviously. But some things are still really quite
>> hard.
>>
>> As an example, I tried to select my birthday - if you want to send me a
>> card, please ask…. It seemed likely that I could put in a date, by hand,
>> and although there was no clue about the format I had hoped I would get
>> something in the right year when I popped up the date picker widget.
>> Instead it takes dozens of keystrokes, most with a 3-finger combination,
>> and I have to know the keyboard shortcut - which is unannounced except in
>> this example page.
>>
>> The way I first tried to do it, tabbing around and hitting return on the
>> arrow that shifts years, which is easier than the dance for me to genereate
>> modified pageDn, shifted my focus from the button I was on - previous year
>> - back to the date. So that path was going to be hundreds of keystrokes.
>>
>> I tried it because I couldn't remember if the shortcut you had for
>> skipping years was one that already did something else in my normal set up.
>>
>> Some things that could be improved.
>>
>> 1. Look at the value when you open the picker and see if you can parse it
>> 2. Don't jump focus when the picker is open 3. Use a focusable dropdown
>> that recognises typing for the year, so if I start typing 156 it offers me
>> the decade of the 1560s to select from.
>> 4. Ditto for month, I guess.
>>
>> I'd be interested to hear others' thoughts about this. It's really not a
>> simple topic about a couple of bugs in a piece of code. There are some
>> really hard issues in here.
>>
>> cheers
>>
>> > Best wishes,
>> > Bryan
>> >
>> >
>> > Bryan Garaventa
>> > Accessibility Fellow
>> > SSB BART Group, Inc.
>> > <EMAIL REMOVED>
>> > 415.624.2709 (o)
>> > www.SSBBartGroup.com
>> >
>> > -----Original Message-----
>> > From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On
>> > Behalf Of Chaals McCathie Nevile
>> > Sent: Saturday, May 21, 2016 3:41 AM
>> > To: WebAIM Discussion List < <EMAIL REMOVED> >
>> > Subject: Re: [WebAIM] Accessible Datepicker & NVDA Support
>> >
>> > On Thu, 19 May 2016 17:08:20 -0000, Meacham, Steve - FSA, Kansas City,
>> > MO < <EMAIL REMOVED> > wrote:
>> >
>> >> In my organization, I consider date pickers to be a "progressive
>> >> enhancement" and don't even assess them for accessibility, so long as
>> >> the user has the option to use them or ignore them and still specify
>> >> a date.
>> >
>> > For precisely the reasons Jonathan suggested, such as knowing what day
>> > of the week some date three months in the future will be, or more
>> > generally being able to annotate dates with more information, I
>> > suggest that it is very helpful to consider the accessibility of date
>> pickers.
>> >
>> > I also recognise that they are a very common thing that it is very
>> > difficult to make very accessible.
>> >
>> > And since I am offline, I can't look at the specific example for
>> > another day or so, but I'd be interested to see.
>> >
>> > I'm really hoping that Web Components will help us fix the problem
>> > that input typeÚte failed to solve in HTML5. Figuring out what makes
>> > an accessible date picker, and finding a *really* good one, gives us
>> > insight into quite a lot of complex problems.
>> >
>> > Challenges for the truly geeky - but which become really important
>> > when talking about how to deal with dates.
>> >
>> > 1. I was at the world finals of ICPC, a programming competition, for
>> > the last week. There was a big poster outside with a mascot-type
>> > figure, and text that amounted, for me who doesn't read the local
>> > language's alphabet, to
>> >
>> > 17-20 *something* 2559
>> >
>> > What does it mean, and how is it relevant to the current discussion?
>> >
>> > 2. We have fairly reliable information - Shakespeare ;) - that Julius
>> > Caesar was killed on the Ides of March, in 44 BC.
>> >
>> > When was that exactly?
>> >
>> > 3. Why was the anniversary of the October Revolution celebreated in
>> > November?
>> >
>> > 4. When does the month of Ramadan start and end this year?
>> >
>> > cheers
>> >
>> > Chaals
>> >
>> >> -----Original Message-----
>> >> From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On
>> >> Behalf Of Jonathan Avila
>> >> Sent: Thursday, May 19, 2016 11:15 AM
>> >> To: WebAIM Discussion List < <EMAIL REMOVED> >
>> >> Subject: Re: [WebAIM] Accessible Datepicker & NVDA Support
>> >>
>> >>> (Not sure why they exist). Just type MM/DD/YYY in the label.
>> >>
>> >> Date pickers are sometimes necessary because they can indicate dates
>> >> that are unavailable/available/holiday and they provide additional
>> >> information in tabular form such as the week a date falls on or for
>> >> example whether a date is the first, two, third, etc. Thursday in the
>> >> month.
>> >>
>> >> Jonathan
>> >>
>> >> Jonathan Avila
>> >> Chief Accessibility Officer
>> >> SSB BART Group
>> >> <EMAIL REMOVED>
>> >> 703.637.8957 (Office)
>> >> Visit us online: Website | Twitter | Facebook | Linkedin | Blog Check
>> >> out our Digital Accessibility Webinars!
>> >>
>> >>
>> >> -----Original Message-----
>> >> From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On
>> >> Behalf Of Brandon Keith Biggs
>> >> Sent: Thursday, May 19, 2016 12:11 PM
>> >> To: WebAIM Discussion List
>> >> Subject: Re: [WebAIM] Accessible Datepicker & NVDA Support
>> >>
>> >> Hello,
>> >> NVDA users would be crazy if they used a date picker! (Not sure why
>> >> they exist). Just type MM/DD/YYY in the label. But that date picker
>> >> is fine on my end (although I would never use it because I have to go
>> >> through every day in every year!) Thanks,
>> >>
>> >>
>> >> Brandon Keith Biggs <http://brandonkeithbiggs.com/>;
>> >>
>> >> On Thu, May 19, 2016 at 6:52 AM, Nisar A < <EMAIL REMOVED> >
>> >> wrote:
>> >>
>> >>> Hello experts,
>> >>>
>> >>> I built up a datepicker using bits and pieces from other datepickers.
>> >>> Is there a way I can verify if that datepicker is compliant with
>> >>> USDOT-508 / meets the WCAG 2.1.1 guidelines?
>> >>>
>> >>> Here is the working example for reference:
>> >>> https://jsfiddle.net/j49gz3g3/4/
>> >>>
>> >>> Some people in the testing team say that it is not compliant since
>> >>> NVDA screen reader reads out the date along with the column/row
>> >>> number. They claim it should read only the date and not extra
>> >>> information.
>> >>>
>> >>> Is that true?
>> >>>
>> >>> Thanks,
>> >>> Nisar
>> >>> >> >>> >> >>> archives at http://webaim.org/discussion/archives
>> >>> >> >>>
>> >> >> >> >> >> archives at http://webaim.org/discussion/archives
>> >> >> >> >> >> >> >> archives at http://webaim.org/discussion/archives
>> >> >> >>
>> >>
>> >>
>> >>
>> >> This electronic message contains information generated by the USDA
>> >> solely for the intended recipients. Any unauthorized interception of
>> >> this message or the use or disclosure of the information it contains
>> >> may violate the law and subject the violator to civil or criminal
>> >> penalties.
>> >> If you believe you have received this message in error, please notify
>> >> the sender and delete the email immediately.
>> >> >> >> >> >> archives at http://webaim.org/discussion/archives
>> >> >> >
>> >
>> > --
>> > Charles McCathie Nevile - web standards - CTO Office, Yandex
>> > <EMAIL REMOVED> - - - Find more at http://yandex.com
>> > >> > >> > archives at http://webaim.org/discussion/archives
>> > >> > >> > >> > archives at http://webaim.org/discussion/archives
>> > >>
>>
>> --
>> Charles McCathie Nevile - web standards - CTO Office, Yandex
>> <EMAIL REMOVED> - - - Find more at http://yandex.com
>> >> >> at http://webaim.org/discussion/archives
>> >> >> >> >> >>
>
>