Live data from Hacker News

Why the Gov.uk Design System team changed the input type for numbers

technology.blog.gov.uk

151–160 of 177 posts

Re: Why the Gov.uk Design System team changed the input type for numbers

#151
post #134
post #123

Earlier quoted context omitted.

It gets promoted to a fractional type.

Ok, what would happen if one then multiplies by Math.PI?

In sane languages like Common Lisp this works since 90's if not earlier:

* (/ 1 3)

1/3 ; result is a fraction

* PI

3.141592653589793d0

* (* 1/3 pi)

1.0471975511965976d0 ; fraction * fp -> fp

* 9999999999999999999999

9999999999999999999999 ;transparent support for bigints

Re: Why the Gov.uk Design System team changed the input type for numbers

#152
post #4

In summary the main issue is that, according to the spec, ` ` is only for numbers that are going to be parsed into a Javascript number. It has to make sense to increment, decrement or do other numerical operations on it. It's not to be used for strings or identifiers that just so happen to be numbers, e.g. credit card numbers. I'll admit this is slightly surprising to me but it does make a certain amount of sense. Th…

I didn't knew you had an inputmode and pattern tag on the html input balise

Re: Why the Gov.uk Design System team changed the input type for numbers

#153
post #45
post #4

In summary the main issue is that, according to the spec, ` ` is only for numbers that are going to be parsed into a Javascript number. It has to make sense to increment, decrement or do other numerical operations on it. It's not to be used for strings or identifiers that just so happen to be numbers, e.g. credit card numbers. I'll admit this is slightly surprising to me but it does make a certain amount of sense. Th…

inputmode=”numeric” and inputmode=”decimal” have different quirks between Android and iOS. inputmode also acts differently on iPad and iPhone, and the keyboard shown varies from that for pattern=, and support for inputmode is missing from iOS11 (or iOS12?). Tread carefully! Note that type="number" is particularly horrible on iOS because it allows typing non-numeric values and then input.value just returns zero. Inste…

Those iOS issues with type="number" are really interesting – thanks for sharing.

Support for inputmode was added in iOS 12.2, but initially it used the 'numeric keypad with punctuation' – is that what you mean by 'the keyboard shown varies from that for pattern='? iOS 13 updated this behaviour, so it now uses the 'correct' numeric keypad, without the punctuation keys.

The pattern attribute is still provided in order to trigger the numeric keypad on older versions of iOS. Once traffic from older iOS devices drops off we'll likely remove it.

There's a little more info here: https://github.com/alphagov/govuk-frontend/issues/1449

(I work on the team)

Re: Why the Gov.uk Design System team changed the input type for numbers

#154
post #5

> However the inputmode attribute is now supported by all the mobile browsers we test in. This isn't extensive, which might be a tad misleading if you don't double check. They test on Chrome & Samsung for Android, and iOS is only the one engine. And those three browsers seem to be the only mobile browsers that have implemented it. (Well, Opera Mobile as well). [0] Desktop support is also extremely spotty. This seems…

Yes. The lack of support for this in Firefox for Android makes using many forms disappointing.

Interestingly I see that https://vehicletax.service.gov.uk/ uses type="tel", so I am getting a numeric keyboard in Firefox.

Re: Why the Gov.uk Design System team changed the input type for numbers

#155
post #78
post #48

Earlier quoted context omitted.

That's one of the reasons I love Stripe's checkout being used everywhere and designers elsewhere basically copying them. The internet is constantly getting better and I don't think we give that progress we've made in web design over the last few decades enough credit. Just imagine how bad it used to be to just purchase a simple thing on an ecommerce site in the mid 2000s. Or remember what car websites used to look li…

> Or remember what car websites used to look like vs what they look like now. lingscars.com ?

Brilliant. I almost wish I needed to lease a car just so I could put some business her way.

Re: Why the Gov.uk Design System team changed the input type for numbers

#156
post #75

Earlier quoted context omitted.

Fantastically straight forward? I strongly disagree. I've done the SA many times, and trying to find out your balance or payments list or anything useful is now a kafka-esque nightmare. Last time I knew they must owe me money but they didn't say at the end, and it took me about 15 minutes to find out how much, with no indication of when it would arrive. At the end of the SA they even had some sort of message saying m…

I’m biased, I used to work at GDS. The lack of a ‘login’ button is a huge issue IMHO, but the main blocker to it isn’t the tech teams, its at the ministerial/senior civil service level. The problem isn’t the button itself but the infrastructure behind it. I.e. it requires a single database of users (i.e. a national register of citizens). This needs doing, but politicians come out in hives because it involves setting…

> it involves setting up a system similar to national ID cards

No it doesn't. We have a register of everyone resident or tax paying here in Norway and no ID cards. The government keeps on trying to make ID cards happen but the relevant departments always seem to be dragging their feet.

You already have a national register in the UK: National Insurance numbers. The difficulty is that it is simply not properly joined up with taxes, banking, etc.

I very much doubt that there is any serious political objection to joining these databases amongst the general public; as you say the civil service departments feathering their own nests is the biggest problem.

Re: Why the Gov.uk Design System team changed the input type for numbers

#157
post #94

Earlier quoted context omitted.

This might be the best website ever. It is over the top, but the theme is consistent. It reminds me of a myspace page, but if someone just wanted to be ridiculous, not unsightly. Side note: anyone remember "I knows me some ugly myspace" from Ze Frank?

Ze Frank. Now there’s a name I haven’t heard in quite some time. What an early internet vlog pioneer. I wondered what happened to him and looked him up a while back. Turns out he’s some bigwig at BuzzFeed so I guess he made out okay, but part of me misses that early enthusiasm and wonder of early internet 2.0.

He's recently restarted posting to his YouTube channel and they're definitely worth a watch.

Re: Why the Gov.uk Design System team changed the input type for numbers

#158
post #70

FYI, there's a few features available with the number input type that don't work with this method. Things like min, max and step attributes.

I'm just being cheeky, but you can abuse the pattern field to enforce minimums ans maximums

Re: Why the Gov.uk Design System team changed the input type for numbers

#159
post #62

Earlier quoted context omitted.

Part of the problem is that inputs don't necessarily reflect the specific intent behind the use of certain symbols. For 99% of people using US keyboards when they input a dash in a credit card number they are using the exact same key as one would use for the minus when inputting a negative number. If you asked them to verbalize their inputs they would probably use different words for the same symbol, signifying that…

> when they input a dash in a credit card number they are using the exact same key as one would use for the minus when inputting a negative number So what? I can't imagine any possible way it would be unclear whether someone entered a credit card number or a negative number. They have different numbers of "-" in completely different places. Am I missing something? > I'd argue that it would also be worthwhile to reque…

Note that my post isn't limited to credit card inputs, nor do I say that the request for clarity is mandatory in all fields.

What I'm advocating is a focus on ensuring the user's explicit intent rather than attempting to infer intent or making hidden assumptions that either could be wrong or exist to make things easier for the developer.

Too many times I've had to deal with data that someone optimistically sanitized or filtered client-side and then stored, only to discover the sanitizing/filtering rules were wrong and the original data provided by the user was lost because the only thing stored was the result of those rules.

Re: Why the Gov.uk Design System team changed the input type for numbers

#160
Really interesting article, and as with everyone else I also really admire their commitment to accessible design.

One interesting this I noticed in this piece was the text (not quoted for reasons that will soon become clear):

Using allows for a degree of separation between how the user enters data (“input mode”), what the browser expects the user input to contain (type equals number), and potentially how it tries to validate it.

Which has incorrectly used closing quotes and correctly used straight quotes in the same code section, and then proper opening and closing quotes in the text section. I wonder how that happened.

Post reply on HN