A well-designed form is a rarity, and a huge boost to any website. Most forms, online or off, are not well designed. Following a few simple rules will help both your client and their customers:

  • Users do not want to fill out forms. The more rewarding you can make the experience for them, the better. Offer them something: a discount, entry into a competition, a free brochure.

    Do not ask for information you don’t need. The less the user has to fill out, the more likely s/he is to complete the form. Make areas of the form that are optional clearly voluntary.

  • If you have to ask for a lot of information, split the form into several pages, retaining the information the user has filled out on the first page in a session cookie or other technology. (We will be covering these possibilities next semester).
  • Break requested information down into manageable and comprehensible units. Do not ask for a person’s name in a single field; instead, ask for their first and last names in separate fields.
  • Rather than asking for telephone area code and the rest of the phone number on separate lines, make them two or three fields next to each other, with brackets to indicate where the area code should be entered, like this:
    <label for="areacode">Phone</label>
    (<input name="areacode" type="tel" id="areacode" size="3">)
    <input name="phoneno" type="tel" id="phoneno" size="3"> 
    <input name="phoneno2" type="tel" id="phoneno2" size="4"> 
  • Remember to include enough room for extraneous characters (the dash in a postal code, for example) that users may include by habit; typically, those will be stripped out before placing the information in a database.
  • If you're in a rush, and don't mind using something with less customisation, you could use a form builder, such as Wufoo, JotForm, or FormAssembly. All of these utilities also offer basic form processing and eMail response, meaning that you do not have to write your own PHP.

Enjoy this piece? I invite you to follow me at twitter.com/dudleystorey to learn more.