What date is being chosen
As Li (2017) notes, the best form depends on the date. Near dates like next week's check-in suit calendars showing weekdays. Birth dates decades back would need hundreds of arrow taps; typed year, month and day fields are far faster. Material (Google, n.d.) offers calendar and input modes with a switch.
Building it well on mobile
Wheels follow iOS convention (Apple, n.d.) but are slow over large ranges. Calendars in a bottom sheet work one-handed, with thumb-sized day cells (Parhi et al., 2006; touch target size). For ranges, pick start and end in one calendar, grey out unavailable dates with reasons, and distinguish today from the selection.
Format hints and accessibility
For typed input, show the format near the field, raising accuracy (Christian et al., 2007). Accept dots, hyphens and spaces leniently (Seckler et al., 2014) and flag errors with inline validation. WCAG 2.2 (W3C, 2023) 2.5.7 forbids drag-only selection, and 2.5.8 sets minimum target sizes.
FAQ
- Best format for birth dates?
- Typed year, month and day; avoid calendars for distant dates.
- Are wheel pickers accessible?
- Not if drag-only; provide tap or typed alternatives.
Sources reviewed: 2026-10-27
References
- Li, A. (2017, January 22). Date-input form fields: UX design guidelines. Nielsen Norman Group. Choosing calendars, dropdowns or typed dates.
- Google. (n.d.). Date pickers. Material Design 3. Docked, modal and input date pickers.
- Apple. (n.d.). Pickers. Human Interface Guidelines. iOS wheel and compact date pickers.
- Christian, L. M., Dillman, D. A., & Smyth, J. D. (2007). Helping respondents get it right the first time: The influence of words, symbols, and graphics in web surveys. Public Opinion Quarterly, 71(1), 113–125. Format cues improve date entry accuracy.
- Seckler, M., Heinz, S., Bargas-Avila, J. A., Opwis, K., & Tuch, A. N. (2014). Designing usable web forms: Empirical evaluation of web form improvement guidelines. In Proceedings of the SIGCHI Conference on Human Factors in Computing Systems (pp. 1275–1284). ACM. Flexible formats and clear guidance reduce errors.
- Parhi, P., Karlson, A. K., & Bederson, B. B. (2006). Target size study for one-handed thumb use on small touchscreen devices. In Proceedings of MobileHCI 2006 (pp. 203–210). ACM. Thumb sizes for calendar day cells.
- World Wide Web Consortium. (2023). Web Content Accessibility Guidelines (WCAG) 2.2. Criteria 2.5.7 dragging and 2.5.8 target size.