WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Datepicker questions - are they useful?

for

From: Kevin Prince
Date: Nov 10, 2015 2:42PM

Thanks Whitney - that's really useful

Kev
Access1in5
0212220638
039290692
Independent Accessibility and IT Consultancy.



> On 8/11/2015, at 04:57, Whitney Quesenbery < <EMAIL REMOVED> > wrote:
>
> Dropping back a bit from the technical questions, there is not one simple
> rule for how to collect dates in a form or interface.
>
> The UK GDS has done some excellent work untangling this, thinking about
> differences in how we might want to edit dates based on context -- and most
> importantly, what we know about the date in question.
>
> Their Design Pattern for Dates
> <https://www.gov.uk/service-manual/user-centred-design/resources/patterns/dates.html>
> discusses
>
> - Memorable dates
> - Copied dates
> - Approximate dates
> - Relative dates
> - Calendar controls
> - Formatting dates
> - Validating dates
>
> There is also a good article on asking for a date of birth (common need in
> many govt forms). I value it for the reports of usability work on this
> topic and how it shaped the design they now recommend.
> https://designnotes.blog.gov.uk/2013/12/05/asking-for-a-date-of-birth/
>
> One usability/accessibility problem in the article has been corrected in
> the article, with the labels now outside of the form, where they belong.
>
> It also points out that the reading (and visual) order should put any
> instructions BEFORE they are needed, not AFTER - no matter how tempting it
> might be.
>
>
> On Fri, Nov 6, 2015 at 1:50 PM Bryan Garaventa < <EMAIL REMOVED> >
> wrote:
>
>> Thanks, those are all helpful. Luckily these are fairly simple to
>> implement within any web UI.
>>
>> Regarding the format, mm/dd/yyy or dd/mm/yyy, I agree it is confusing at
>> times. This can be helped using supplementary description text or a
>> placeholder at times.
>>
>> Also, this can be addressed programmatically for some sites that span
>> multiple countries. For example, the date format string for the WhatSock
>> date picker simply uses a callback function when a date is selected, then
>> the developer can use whatever parsing logic and string format they wish to
>> populate the field, or even control the values of three individual select
>> elements such as Day, Month, and Year, so this flexibility is easily
>> achieved.
>>
>> Typically I recommend both, the ability to manually enter the desired
>> date, and an accessible date picker, because having both will ensure the
>> greatest value for all user types.
>>
>>> If you do the datepicker don't forget to style it so I can see it (one
>> of the examples had a visual focus indicator of
>>> dark grey on black seemingly)
>>
>> Probably my fault, I'm blind so this can slip past me at times. The source
>> code is easily changed however for anybody who wishes to employ different
>> styling and content.
>>
>> All the best,
>> Bryan
>>
>>