Online forms have become a primary interface for netizens, and they exist for numerous purposes. Web forms may be categorized by level of complexity, which include:
- the simplest – search forms are the most common example of the simplest type of form. This is also the most common type of form found on the Web. The user enters a search phrase or one or more key words to be found, then clicks on a button (often labelled “Search”) and the search operation begins.
- simple – generally, any “contact us” forms consisting of several fields are examples of simple forms.
- versatile – such forms require mandatory completion of certain fields.
- interactive – in addition to mandatory fields, such forms also update form data based upon certain user-entered values. For example, calculations may be made to determine the taxes or fees required to be added to an order. The benefit of this type of form is the real-time nature of the system response.
As form design is essentially a function of application development, it is fitting to apply a similar process. We recommend the following important steps when developing a form for your Web site:
- Determine and document the specific purpose for the Web form and prepare text to explain the form’s purpose to site visitors.
- Consider what fields are needed for the form. Indicate which fields are to be mandatory and which are optional. Always try to keep the length of the form to a minimum. Do not attempt to capture data without a clear purpose. Ensure you’ve stated at the top of the form that mandatory fields are indicated using an asterisk (“*”).
- Decide upon the appropriate type of field for each question. In addition to basic input fields (which hold up to 255 characters), there are also several other types of fields you may need to use:
a) radiobutton – used to select a single option amongst two or more
b) checkbox – allows multiple options to be selected
c) drop-down list – also used to select a single option from a list of them
d) date – uses a mini-calendar control to allow the user to select a date
e) textarea or large text fields (several lines) – used for larger amounts of text than is possible using the basic text input field - Ensure a logical order to your form’s fields. They should be arranged such that the first fields capture high-level information (names, for example) while later fields collect more specific details (such as mailing address, education level, etc.).
- A common approach among professional form designers is to first prepare a mock-up of the form (also called a wireframe or prototype). This may be as simple as pencil designs on full-length sheets of paper. Sketch in the location of the various fields, and ask your client to run through a simulation exercise: pretend to complete the proposed form using the mock-up pages. This approach should help determine whether too much scrolling may be involved, if the fields should be grouped differently, and so on. It is very important that the final form on paper is agreed to before proceeding to develop the form online. This could save time.
- A truly professional approach would involve the use of a group of testers who would test the form that is developed. The more important the form is to your site or your business, the more consideration this approach should be given. In advance of testing, produce a test plan which identifies each of the form fields and instructs the testers on what to input. The test plan should also include anticipated outcomes. This is particularly necessary if your form is to contain any versatile or interactive fields. You want to be certain the back-end code is returning the expected results based upon user input. In the end, pay heed to the results of such tests and consider the opinions and recommendations offered seriously. In the end, the long-term viability of your website may hinge upon the usability of your online forms!
Clever design translates into a quality form which, in turn, determines its effectiveness. An effective form helps to reduce errors such that you can be certain people have correctly completed the form. Fewer errors suggests a higher degree of user satisfaction and, ultimately, a greater number of conversions.