Unfortunately, several shiny HTML5 features (such as the video element), ended up implemented to different levels by browsers, without good accessibility, and without an interface that satisfied designers (a nearly impossible task). This includes the date input.
Recently on Twitter, there was some discussion about accessible date picker widgets. Jason Kiss (@JKiss) did some analysis and gave feedback.
— Jason Kiss (@jkiss) April 14, 2016
I felt compelled to list the examples of accessible date pickers mentioned in the Twitter thread, so here they are. Know any other good ones?
- Date Picker dialog by W3C WAI (recommended)
- AccDc date picker by Bryan Garaventa
- Accessible date picker by Deque Systems
- Athena date picker
- jQuery UI datepicker by Hans Hillen
- Datepicker widget by Assets.cms.gov
- OpenAjax date picker
- Added Jan 2017: Accessible date picker by Adina Halter
- Added Jun 2020: Tommy’s inclusive datepicker by Tommy Feldt
PS: In the tweet thread, props to @handcoding, @pauljadam, and @backflip.
- Can I Use – Date and time input types
- About Datepickers on W3C Wiki
- Input element on MDN
- Added Sep. 2017: Accessible Datepickers by Axess Lab
- Added Sep. 2017: Considerations around the accessibility of a calendar control by Microsoft
- Added Jul. 2018: We need to talk about the accessibility of date pickers by Alda Vigdís
- Highly recommended: Mar. 2019: Collecting dates in an accessible way by Graham Armfield via Hassell Inclusion
- Highly recommended: Jul. 2019: Maybe You Don’t Need a Date Picker by Adrian Roselli