Even if safari had the greatest date picker ever conceived, don't use date pickers for date of births. They will never be better or faster than typing your DOB. Pickers are best for choosing dates that aren't known ahead of time, or where you need to know how a date relates to week days / week numbers etc.
The proposed solution of using number inputs is also not great, since they have a host of accessibility issues [0] You want a regular text input with inputmode="numeric" and a pattern attr. This will give the correct numeric keyboard on mobile, and work just as well in desktop, without any of the associated issues.
I've built several date pickers, I know how hard they can be to get right. But they shouldn't bbw blindly used for any date value, they should be a deliberate choice
> Even if safari had the greatest date picker ever conceived, don't use date pickers for date of births. They will never be better or faster than typing your DOB. Pickers are best for choosing dates that aren't known ahead of time, or where you need to know how a date relates to week days / week numbers etc.
Interestingly the old iOS datepicker was actually pretty good for DOBs: the old picker just gave you three scrollwheels with the year, month, and day (possibly in your locale order), scrolling through the years was a very quick thing: just flick the years wheel and off it goes. A touch finnicky to adjust, and maybe not great for close picks because of the lack of context.
The issue here is the "new" (iOS14) calendar-based pickers, which give you, well, a calendar, and hides the quick month/year direct selection behind a dropdown (and as the essay notes without a day wheel, so now you have to open the year/month selector, jump to the right one, confirm that, then select the actual right day on the calendar view).
Especially given the flat design language as it's really not obvious the month/year and their arrow is an active dropdown.
The proposed solution of using number inputs is also not great, since they have a host of accessibility issues [0] You want a regular text input with inputmode="numeric" and a pattern attr. This will give the correct numeric keyboard on mobile, and work just as well in desktop, without any of the associated issues.
I've built several date pickers, I know how hard they can be to get right. But they shouldn't bbw blindly used for any date value, they should be a deliberate choice
[0] https://technology.blog.gov.uk/2020/02/24/why-the-gov-uk-des...