If your date picker for birth dates defaults to <current year> when I click on it, you are not a serious company, and 9 other UX form breakages that drive me nuts.

Key points:

• Date pickers suck. Ideally, don’t use them, though if you do…
• I’m in Australia. I’m neither paying in Afghani, nor do I suspect you even ship to the DPRK.
• UX form design is hard. Balancing getting standardised data from a form, versus any data at all means putting the business or the customer first.

Conclusion: For almost 30 years, we’ve struggled with optimal form design. We’ve come a long way, though lordy, if you’re unnecessarily dragging the chain, you’re losing revenue.
‍

Bad form UX is an own goal.

Bad UX is both avoidable and an own goal.

Every millisecond users spend on your form sees a decrease in users.

Every additional form field is a bunch of users gonskies.

Here are some of my top UX gripes, which can easily be solved.
‍

There are two reasons you are collecting my birth date.

And neither of them should give you any pause to set the default year to 2024:

1. You are collecting my date of birth. Unless I am on the Paw Patrol website, not only assume I am an adult but assume that toddlers do not complete date pickers.
2. You are verifying that I am over 18 to proceed, meaning nobody born after 2006 is getting through. Safely assume two things here: firstly, every legitimate adult is going to have a birth year before 2006, and secondly, any non-adult (like my 13-year-old) is going to work that out pretty quickly and game the system anyway.
   ‍

Better still, ask if I am 18? Y/N.

The median age of all humans on Earth is 30 years. Starting my birth year as <current date> is just rubbing in my age.

Set your date picker to 18 years before the <current date>.* Be serious. I already have Carpal Tunnel.

And don’t make me click BY MONTH to go back 30 years.

And cripes, maybe don’t go back to 1900 unless you believe in vampires.

(I am happy to debate the efficacy of date pickers for collecting my age because I agree that a plain field where I type in my date of birth is a much better experience, especially on mobile and a web app. Just use <input type=”date”> and be super serious. Graphical pickers are inherently exclusionary.)

Even better, follow Google's lead:

‍

If you are collecting my postcode, you know my State.

If you’re collecting my address, you should probably use address autocomplete.

• Improved conversion rates.
• Improved data quality.
• Reduced user frustration.

If you’re not using autocomplete or only need an approximation of my location (i.e. postcode), you don’t also need my State.

Because you know my State by virtue that my postcode can only exist in one State.

Every reduced field is improved conversion and revenue. That State field is costing you money.
‍

My credit card number tells you the issuer. Please don’t ask me.

MasterCard starts with a 5.

Every Visa starts with 4, irrespective of what follows.

And if you have an AMEX, you’ll know they all start with 3.

Asking me to select my issuer AND my credit card number is so 1999.

You work it out.
‍

If you format a payment amount as $4.6, you go straight to jail.

I have never understood why, but I get so many of these.

Why?

Straight to jail.
‍

I am in Australia. I am not paying in Afghani.

You know - or should know - that I am in Australia.

If you default to the ISO country list and present me with Afghanistan as the first currency type, your UX team should be let go.
‍

I know what my credit card looks like, but it doesn’t look like that.

Users have always been anxious about putting credit cards into websites and so we have done plenty of things to make it both easier to do so, and to reduce the anxiety in doing so:

• We add payment types such as PayPal and ApplePay.
• We litter the logos of Visa and MasterCard next to a lock icon.
• We explain the details of CVV/CVC next to a question mark.

About 20 years ago, we started the trend of visualising credit cards on screen. Sometimes, we just showed you what the card would look like with your credit card numbers entered, and sometimes, we even put the fields over the fake card itself!

But in 2024?

1. That Chase Bank credit card is not mine.
2. Why am I giving Chase Bank my credit card number?
3. Why are you slowing this process down and making me question everything?
4. Why do you hate me?

Sure, the visualised credit card trick is used less and less, though I encountered it today paying for school photos and look, as the father of an 11-month-old at childcare, give me some credit that I wasn’t born in 1900.
‍

Don’t reject my mobile number because it isn’t in the format (###) ###-####.

I wrote about Postel’s Law in a recent article on the Laws of UX:

1. Be flexible in accepting user data.
2. Limit the data you collect (at least in any given transaction).

Rejecting my phone number because it doesn’t meet your format is user-hostile.

We both lose.

And of course, if you’re doing these things, you’re just trolling**:

And don’t set your mobile number input to type=”text”.

You’re killing me here.

Statistically, I am on a mobile, which means the default keyboard for number entry is about the size of a long Lego piece.

If you want my number, the input is <input type=”tel”>.

Set up all your input types correctly. I can’t autofill with Chrome and you’ve lost me.
‍

Form labels that disappear onclick? Get in the bin.

In the good ol’ group buying days, buying was all about spontaneity.

And I still do my best online shopping after half a bottle of red.

If I click on your labelled field and the label disappears, we are in a game of chicken.

What was the data they wanted again? Gift recipient name?

AirBNB is a masterclass of how to do this right and any front-end developer should get this right.

CAPTCHAs

CAPTCHAs are my first pick when it comes to avoidable UX breakages.

CAPTCHAs can reduce form conversion rates by as much as 40% (Inc.).

Though I’m writing a whole article shortly about CAPTCHAs and how to navigate the world of robots and spam and so in the effort of sticking to my top #10 form UX gripes, you’ll have to stay tuned.

*

* I also appreciate that defaulting to a valid, though incorrect, date has downsides. Balance getting the correct date through a date picker with getting any data at all. (Of course, AI will fix all of this eventually!😂)

** These are not real telephone number inputs. Years ago, it was part of a competition to imagine the worst possible telephone input field. Still amusing.

‍