RE: ARIA Authoring practices and grid based date picker (link to demos and GitHub repository)

Jon,

some feedback from my side:

https://rawgit.com/jquery/jquery-ui/datepicker/demos/datepicker/date-formats.html



-          The dropdown should open generally ONLY on user request (key) in a field of type date, not directly when focusing the field.

Reason: when this field has also tooltip, error message etc. attached as popup opening on focus we will end in a mess.

-          The keyboard focus is barely visible on the day cells (IE)

https://rawgit.com/jquery/jquery-ui/datepicker/demos/datepicker/icon-trigger.html



-          The trigger should be part of the control, not a separate button after

-          ALT+ARROW down should still workin the field to invoke dropdown

-          Consider also F4 as opener (general pattern)

For a comprehensive concept, check https://experience.sap.com/fiori-design-web/date-picker/

For an implementation, check for instance these  examples<https://sapui5.hana.ondemand.com/explored.html#/sample/sap.m.sample.DatePicker/preview> and SAP UI5 DatePicker<https://openui5.hana.ondemand.com/test-resources/sap/ui/commons/demokit/DatePicker.html#__2>.

Although there is already support for ARIA in the examples (try e.g. with NVDA+FF), we are interested to base the scaffold for date picker on official ARIA references.

Please tell me when a testing round using Jaws/NVDA + IE/FF of the demos should be done.

Regards
Stefan




From: Gunderson, Jon R [mailto:jongund@illinois.edu]
Sent: Donnerstag, 16. Februar 2017 02:22
To: Matt King <notifications@github.com>; James Nurthen <james.nurthen@oracle.com>
Cc: 'ARIA Working Group' <public-aria@w3.org>
Subject: Re: ARIA Authoring practices and grid based date picker (link to demos and GitHub repository)

I forgot to include a link to the current demos of the development version of JQUERY-UI date picker:
https://rawgit.com/jquery/jquery-ui/datepicker/demos/datepicker/index.html


Here is the github repository:
https://github.com/jquery/jquery-ui/tree/datepicker


Jon


From: Jon Gunderson <jongund@illinois.edu<mailto:jongund@illinois.edu>>
Date: Wednesday, February 15, 2017 at 7:19 PM
To: Matt King <notifications@github.com<mailto:notifications@github.com>>, James Nurthen <james.nurthen@oracle.com<mailto:james.nurthen@oracle.com>>
Cc: 'ARIA Working Group' <public-aria@w3.org<mailto:public-aria@w3.org>>
Subject: ARIA Authoring practices and grid based date picker

Matt and James,

Could we send a few minutes on accessible datepicker patterns.

I am working with the JQuery-UI team working on the next generation datepicker and I have some questions to ask the group.

For example each date cell is:

<td role="gridcell" aria-selected="false" aria-label="Monday, 2/13/17" aria-describedby="ui-id-1-month-label" id="ui-id-1-2017-1-13">
  <button class="ui-state-default" tabindex="-1" data-ui-calendar-timestamp="1486965600000">13</button>
</td>

I think they are putting focus on the button and not the grid cell, so it seems the labeling is on the wrong element.

Hope we can talk about this for a few minutes.
Jon



Jon Gunderson, Ph.D.
Coordinator
Accessible IT Group
Disability Resources and Education Services
College of Applied Health Sciences
University of Illinois at Urbana-Champaign

E-mail: jongund@illinois.edu<mailto:jongund@illinois.edu>
WWW: http://disability.illinois.edu/academic-support/aitg