I know exactly what date UI you are talking about and it’s a firm agree. Whoever decided that a date UI needed to have the inability to select a year without hitting back 3 times, then ontop of that decided to make it so it undid your month and day selection when you did so, did the world a massive disfavor designing it.
What is wrong with the simple type=“datetime-local” or type=“date” UI’s that every mainstream browser has native. It’s 3 clicks, you can specify the year at the top, and then month & date in the main body. Why even introduce layers to it. Have everything on the same layer.
What is wrong with the simple type=“datetime-local”
The problem with that is that it doesn’t exist.
Nitpicking aside, the problem with native browser widgets, in my opinion, are:
tiny hit areas for desktop users
no way to highlight certain dates (e.g., holidays) or mark dates ineligible for selection (e.g., future dates)
no way to indicate the week of year (not an issue for most use cases)
users don’t know how to un-select a date (you’d think the ‘clear’ button would give that away and you’d be wrong)
the widget lets you enter invalid dates without telling the user (or the programmer, for that matter), e.g., 31 Sep.
Widgets where you need to click 3 times for a simple selection, as you mentioned, have one of two origin stories:
They were designed ‘mobile first’ with screen sizes of 320×200px in mind and therefore put a premium on screen real estate.
The “seeing many things is confusing” camp of designers got hold of them. The fact that my users fail to recognize the ‘clear’ button in the datepicker widget seems to agree with them, but it’s still annoying for people without ADHD.
can you elaborate on type=“datetime-local” not existing? It’s been supported in almost every mainstream browser since basically 2012. The last mainstream to adopt it was Safari in 2021. There is argument that FF didn’t have proper support till 2021 as well but, that’s because it was lacking the “time” part of the element. So they modified how it worked for awhile to work like the type=“date” element, that has since been resolved.
being said, I do agree with you on a lot of those. it would be nice to have some form of UI validation. That is one of it’s flaws that could be expanded on. a disabled dates or invalid days tag on the input would be a lot easier (like allowedDays being a comma separated list of daynames or numbers like how the time standard is), but also add a lot of complexity to it for something that should be being validated via scripts both server and client side. Not all browsers have the clear button as well which is a problem because it’s an extra step when you do make a mistake on it. They do offer a valid range tag though to allocate valid ranges for dates, but it’s so primitive that for a scheduler it can’t really be used unless its on a week by week basis
I know exactly what date UI you are talking about and it’s a firm agree. Whoever decided that a date UI needed to have the inability to select a year without hitting back 3 times, then ontop of that decided to make it so it undid your month and day selection when you did so, did the world a massive disfavor designing it.
What is wrong with the simple type=“datetime-local” or type=“date” UI’s that every mainstream browser has native. It’s 3 clicks, you can specify the year at the top, and then month & date in the main body. Why even introduce layers to it. Have everything on the same layer.
The problem with that is that it doesn’t exist.
Nitpicking aside, the problem with native browser widgets, in my opinion, are:
or mark dates ineligible for selection (e.g., future dates)Widgets where you need to click 3 times for a simple selection, as you mentioned, have one of two origin stories:
can you elaborate on type=“datetime-local” not existing? It’s been supported in almost every mainstream browser since basically 2012. The last mainstream to adopt it was Safari in 2021. There is argument that FF didn’t have proper support till 2021 as well but, that’s because it was lacking the “time” part of the element. So they modified how it worked for awhile to work like the type=“date” element, that has since been resolved.
being said, I do agree with you on a lot of those. it would be nice to have some form of UI validation. That is one of it’s flaws that could be expanded on. a disabled dates or invalid days tag on the input would be a lot easier (like allowedDays being a comma separated list of daynames or numbers like how the time standard is), but also add a lot of complexity to it for something that should be being validated via scripts both server and client side. Not all browsers have the clear button as well which is a problem because it’s an extra step when you do make a mistake on it. They do offer a valid range tag though to allocate valid ranges for dates, but it’s so primitive that for a scheduler it can’t really be used unless its on a week by week basis
Oh goddamn, I hate web standards sometimes.
There used to be a proposal for datetime-local, but it was dropped, even though some browsers already supported it. That’s what I meant.
However, some years later the W3C added it to the standard again.
More info: https://webmasters.stackexchange.com/a/59541 https://stackoverflow.com/a/22654498/
Thank you for expanding on it. That was a pretty interesting read, gotta love indecisiveness in your standards