Building Successful Web Forms, Part 1
Web forms play a key role for visitor (and customer) interaction on many sites. However, many web designers don't realize that there may be huge differences in form abandonment ratio, depending on how well the form is designed. In this post and follow ups, we'll give you some tips to help you make your web forms an effective communication channel.
Always provide form filling instructions.
Don't assume that all of your visitors will understand how to submit a form without further explanation. Short and clear form filling instructions can reduce form abandonment, and increase the quality of the information collected.- include a call to action phrase like "Please fill out this form to contact XYZ"
- indicate the purpose of the form and the recipient of the information collected
- if applicable, confirm that you will reply, and give an indication of the time frame
Select the correct data type for each input field.
Because of necessary form validation, choosing and incorrect data type may prevent a form user from submitting valid information. When this happens, it is likely to lead to form abandonment.For example, if you specify that a form field can only contain a Number, it may not work for a phone number. 1233456789 will work, but not 123-345-6789. So use the Phone type instead. In many cases, the form builder will pre-select a type for you, but not always. Read more about selecting an input field data type in the form builder documentation.
Choose the most appropriate input field widget.
Don't restrict yourself to text boxes and drop-down lists. Take advantage of the full range of HTML form fields with radio buttons and checkboxes. Learn when to use each one.Using a drop-down list for a yes/no question will slow down the form user, and increase the chances (s)he gives up. Use radio buttons instead. Read tips about choosing the best input field widget in the form builder documentation.
Brand your forms for instant visual recognition.
Always brand your web forms with your own logo. This helps visitors recognize at first sight who they are about to send information to.Posted on Tuesday, 06 May, 2008 at 18:21 in html-form
Permalink | Comment
Tags: web-forms, form-builder, howto
Subscribe
About This Blog
This is FormSmarts Blog, a weblog about web form design. The topics covered include technical aspects of HTML forms — such as form security and form spam — but also broader social aspects, like form accessibility, usability, and privacy. Most posts discuss general topics in the context if FormSmarts free web form service.
