10 ways to screw up a web form and piss me off

Today I complained (on Google+) about web forms where you have to re-enter your email address. I always feel insulted when sites ask me that. As if I can’t be trusted to know my own email address. It also doesn’t make sense in the era of the browser ‘auto-fill’ which fills out this information for me.

After my complaints I received a bunch of other complaints from readers and decided to share these with you web designers and developers. Hope it helps in designing your next web form. Here is our list of 10 things (+ one bonus) you really should and shouldn’t do in a web form:

1: don’t ask people to re-type email addresses
The one I started my day with. Don’t ever make me re-enter my email address in a web form! My browser auto-fills it for me and I can type just fine. Use javascript to check syntax but don’t act like I can’t type. It is annoying for me and signals “people visiting this website are stupid”.

2: Do enable auto-fill
Make sure your text fields have names my browser can understand so it can auto-fill those forms. Make the name of the email address field “email” and the telephone number field “telephone”. That way, when people enter their names, the browser fills out the rest of the form with the correct information. Saves us all a lot of trouble.

3: Don’t disable copy pasting
Some smart-ass developers add a few lines of javascript to a webform that disables the copy and paste function. This is extremely annoying. I might be entering information in more than one form (like booking a hotel and a flight to get there) and will be copy pasting the important info to and from both forms. If you do this to users you should be ashamed of yourself. Don’t screw with my browser functions!

4: How likely is it that I’m 0?
This one comes from Nico Lumma who writes: “if you ask for my age, don’t use the current year as a default, it is unlikely that I was just born this year”. That is a very good point. You can still include the years up until today but why not find out the average age of all your users and pre-select that one?

5: How many members do you have in Afghanistan?
Judging from most web forms the majority of web surfers live in Afghanistan. They offer a country drop-down list and sort it by Alphabet and Afghanistan is the first country on the list. That is the easy way out, I get it. But why not offer your top 20 or 30 countries at the top of the list and allow people to scroll down for more?

6: No spaces or – in drop down lists!
When I open up one of those 255 country names in one drop down lists I don’t scroll down to find ‘netherlands’ somewhere down the list. I just type ‘ne’ and the browser preselects the first country down the list that starts with those characters. That is, unless someone thought it would be a great idea to add a few spaces or dashes before every country to line things out. Please, -don’t -go -there…

7: Not long enough is too short
My name is “Boris Veldhuijzen van Zanten”. Pretty long name, I know. My sisters first name is “Ellemijn” so that one is even longer. Some Brazilian names are even 40 or 50 characters long. That means that at websites like Apple’s and Twitter, which have max-length’s of 20 characters, I get no further than “Boris Veldhuijzen va”. That sucks. And it sucks for more people than you would think. Why not just limit it to 255 characters?

8: A different state of mind
If you are an internationally focused company (and who isn’t if you have a site on the WORLD wide web) making “State” a mandatory field and neglecting that countries other than the US might not need this is very annoying. Some forms reset after you choose a country other than the US, which is fine. Even better; just make it optional.

9: Don’t use an unreadable, ultra-long captcha
Spam is annoying but also a small nuisance. Don’t move the problem from your inbox to your clients web form. Is it really that bad to delete a few spam emails from your inbox every day? Worse enough to trouble your customers with that annoying captcha? I personally hate those Google captchas that make we squint and tilt my head and guess at what they display.

10: we ♥ UTF8
Wouldn’t it be cool if Björk Guðmundsdóttir, 毛泽东先生 and Борис Николаевич Ельцин wanted to become your clients? So why piss them off and don’t offer UTF8 support for their special character sets? It really doesn’t take much extra effort to make your site UTF8 compatible. Ask your developer for help if you don’t know what this means.

Bonus point: Don’t ignore mobile users
A lot of forms are (almost) unusable for mobile browsers due to long dropdown / checkbox lists and the overuse of complicated javascript validation. Visit your website with your iPhone or iPad and try to sign-up or buy something. Is it possible? Is it easy? More and more people are using iPads and Android phones to order stuff and sign-up for services. Don’t shut them out.

Gerard van Enk also suggested that if you design forms or deal with customers and members you should check out this w3 page. It has some helpful tips on how you should ask for peoples names. It is all much more complicated than you think but also a lot of fun to find out how different cultures deal with family names. It will make you think twice about asking people for first and last names…

Got more annoyances or ideas for improving forms? Spit it out in the comments. (I sure hope that our comment form doesn’t suck!)

Photo credit: Dmitriy Shironosov via Shutterstock.