20 tweet guide to creating the perfect online form

keep it short, simple and easy to complete. design to reassure and build trust. don’t surprise or challenge people. reward their efforts.

  • make it easy to fill for mobile and tablet users. fastest growing audience. think web traffic 2years ago. expect growth at an alarming pace.
  • in-line validation. let people know immediately if they’ve not given you the right info. clearly explain the problem and how to fix it.
  • label fields clearly. don’t make people have to think about what information to give, it should be obvious.
  • make error messages easy to understand. if you want a mobile phone number without country code then show people an example.
  • use cookies to remember field contents. minimise what people have to do to complete your form and give you the information you need.
  • include product information on summary/confirm pages. people want to know what they are paying or signing up for. reassure them it is there.
  • anticipate and deal with common errors. if you need their email address twice then make it clear. even better make it clear why.
  • don’t clear fields after user error. if you don’t understand how annoying this is then you are in the wrong job. go employ a UX person now.
  • make forms short. people are busy and impatient. filling in forms is not fun. don’t make it harder than it has to be or you will lose people
  • make forms fun. not easy but humour at the right moment could make the whole experience a bit more tolerable. or not. careful here.
  • give people feedback at the end. especially if you’ve just asked them to pay. no one likes sending details/money into the ether. it’s scary.
  • mobile UX. thumb-friendly buttons, scan-able spacing, minimise user input. yet to meet anyone who finds it easy to type on a smartphone.
  • disable auto suggest for mobile and tablet users. your name and email are not in the dictionary. auto suggest won’t help you.
  • serve the right touchscreen keypad. who needs letters when you’re being asked for your mobile phone number? and where’s that @ symbol…
  • reduce decisions to a minimum. forms are for transactions not selling extras. people have committed just make it easy for them to get there.
  • use descriptive wording / actions on buttons to be clear and reassuring. don’t make people worry/wonder about committing / paying.
  • use a progress bar. ensure people always know where they are, what they have done and where they are going. reassurance builds trust.
  • if it’s secure then make it look secure. padlock symbols and reassuring wording works. it’s the internet, it’s scary. make it less scary.

19. July 2013 by SharonAnneKean
Categories: Day Job | Leave a comment