Useability in Form Design
Current Page:  Documentation / Useability in Form Design

 
Form Useability & Style Guidelines

Since e-gateways' original release in 1997 we have seen several thousand implementations of the web form.  Additionally, we have studied users from all walks of life and with various levels of technical skill as they use such forms.  During the course of the development of e-gateway we have applied the knowledge we have gained from these studies to the application to make it handle forms in ways which are meaningful to the "average" user.  However, a lot of what we have learned can only be implemented in the design of the form itself, so we would like to take this opportunity to present our guidelines for form design based on our research and useability testing to date.

The form is probably the most valuable component of your website; giving your users a mechanism by which they might contact you, or offer their feedback on your products or services.  Despite this, the form is often the most poorly implemented element on a website.  We have seen many examples of forms that leave the user bewildered and hesitant to continue and it's not just the smaller companies that are to blame - we've seen bad forms on a couple of very high profile websites too.  It's probably safe to state as fact that if your form is badly designed, visitors to your website won't use it and that reflects badly on your company / organisation.  Using the guidelines set out here, you can implement a successful, user-friendly form quickly and easily.

  1. never, ever capture any more information than is absolutely necessary.  There are two main reasons:
    a) people are still very cautious about submitting (sometimes personal) information over the Internet - the more information you ask for, the more likely you are to scare your users away
    b) people find forms tedious at the best of times - the more fields you add, the more likely you are to drive them away.  If it's essential that you capture a large volume of information use drop-down menus, check boxes and radio buttons as much as possible so that users can click their way through your form rather than have to endure endless typing

    2.  
  2. use you web-page to tell your users how to use the form; a few simple notes make a world of difference (for example: "Use the 'Tab' key to move between fields, press 'Return' or click 'Submit' to send your feedback to us")

    3.  
  3. reassure your users: tell them what you will do with the data they submit; tell them what you won't do too

    4.  
  4. your design should be as clear as possible and should not intimidate the user.  Use HTML tables to layout your form elements neatly.  Label each field clearly and concisely

    5.  
  5. indicate "required" fields very clearly

    6.  
  6. never have more than one form on the same page.  This simple rule is broken so often; it confuses your users (they have no idea whether any given "Submit" button submits the entire form, or (more likely) just a few elements of it)

    7.  
  7. don't impose conditions where it is possible to avoid them.  Many web-based forms are suitable only for their country of origin while using a media that recognises no national borders (the Internet)...  asking European users to enter a "State" and "Zip Code" is meaningless - make these fields a condition of the form (i.e. "required") and you immediately exclude the majority of the Worlds' population!  ("Postal Code" is commonly used in Europe and is in a different format to the US "Zip Code")

    8.  
  8. don't force local conventions on international users  We often see forms that demand a telephone number in a certain format for example, these are often invalid outside of a specific region

    9.  
  9. use text-area fields when asking for address details; there are simply too many variables in international address formats to restrict your form to "Street", "City", "State" and "Zip Code"

    10.  
  10. if there are a lot of forms on your website and they have elements that are repeated, use "cookies" to save and retrieve information that you can then use to automatically populate the common fields with

    11.  
  11. Golden Rule:  Never, ever use graphical "Submit" or "Reset" buttons on your form.  This trend is becoming increasingly popular but our research has shown that users are often unable to work out how to submit a form they might just have spent ten minutes entering data into (not good if they're a potential customer).  All of the major web-browsers have standard buttons that are often exactly the same as the buttons users are familiar with from day-to-day usage of their computer / operating system.  When you use graphical buttons you break the standard and suddenly introduce a "learning curve" for users of your website (as if there isn't enough deviation from standards on the web already).  Don't do it - this is the single, biggest failing of web-based forms.  The conventional buttons might be ugly and disturb the cutting-edge design of your website, but they are what your users expect to see - don't make life difficult for them

    12.  
  12. finally, remember this important point:  if you receive feedback from a web-form - RESPOND TO IT.  Don't go to the trouble of buying e-gateway, designing an efficient, effective, user-friendly form... then ignoring the people who use it

    13.  

 


© Digital-Word Ltd (UK). All Rights Reserved.