Under The Microscope

Usability Nightmare: Web Forms

Dear Lazyass Web Developers,
Stop trading my cycles for your own. Your time is not more valuable than mine, and it’s certainly not more valuable than that of all your users put together. You’re ruining the world.

Signed,
The World

How many times have you been on a web site, filled out a form and hit Submit, only to be bumped back to enter additional information? The thing is, you did enter the requested information, the site just didn’t like the way you entered it.

This is most commonly seen with phone numbers and credit cards. Some sites demand that you enter your phone number or credit card with no non-numerical characters, such as dashes. That is, if you enter “123-456-7890”, you’ll be bumped back and forced to enter “1234567890”. Others do just the opposite, demanding dashes. I took the above two screenshots on the very same day, from two different sites1. Holy hell! Computers can handle this.

You might be thinking “What’s the big deal? With global warming threatening the planet, a financial crisis threatening society, and of course the popularity of the Snuggie, aren’t there more important things in the world to worry about?”. And if you are, you’re not entirely wrong. This is a small thing, and it takes perhaps 30 seconds to find the issue, correct it, and re-submit the form.

The real problem shows up in the aggregate. It’s 30 seconds extra for me, and 30 seconds extra for you, and 30 seconds extra for every other visitor who doesn’t get things exactly right. Since the invention of the web, hundreds of thousands of man hours have been wasted adjusting the input for credit cards and phone numbers on web forms. Those lost hours could be used to solve some of the aforementioned world problems. Lazy web developers, you’re killing the future. Stop it. Right now.

Worst of all, it’s the easiest thing in the world to fix this. In PHP, ASP, JavaScript, or any other web language, stripping characters takes about five minutes to get right. When you get phone number or credit card input, just strip out dashes (and dots) if you don’t want them in there. Here’s how to do it in PHP in one line:

$var=str_replace('-','', $var);

If you can’t manage that, you need to get off the web.

Inserting dashes into phone numbers is a bit trickier (due to international number formats), but can still be accomplished easily for 10-digit American numbers and any others where the exact format is known.

This isn’t hard. You can spend the 5 minutes needed to make it right. You should spend the 5 minutes needed to make it right. Save those thousands of hours, and do your part to save the world.

Addendum

As bad as it is, it could always be worse:

Footnotes:
1. Better still, the same site (the Massachusetts’ RMV) which demanded dashes in my phone number also commanded me to leave slashes out of my credit card’s expiration date, as well as punctuation and spaces out of my credit card number.

Our Software