Until Google comes out with an application that can scan our thought waves, the most common medium for communicating important information on the internet will continue to be the humble web form. Whether your website’s purpose is to sell something, capture contact leads or invite membership, you will need to give careful consideration to how you facilitate that process. This article will offer a few tips on how to create a smoother experience for visitors who are interacting with your website.
1. Minimize the pain. Nobody likes filling in forms. Only ask for the information that you really need. If you have a legitimate reason for asking personal details like date of birth, occupation or marital status, explain what it is.
2. Position labels intelligently. If vertical space allows, place the label above the input box. This allows the fastest visual scanning. Otherwise place it to the left and right-align the labels flush with the input boxes.
3. Choose input controls intelligently. Use radio buttons where there are a small number of exclusive choices. Otherwise use drop down selections. Use text boxes if you don’t care what format the answer comes in.
4. Validate the data at each step. There are many validation scripts like the JQuery Form Validation Script that will provide instant feedback to the user if the form input is unacceptable.
5. Give descriptive feedback. Give the user unambiguous messages about errors and success. Use text and color. Suggest valid inputs in the case of errors.
Only ask for the information that you really need.
6. Save the data in the webform in the case of errors. There are few things more frustrating for users than being forced to redo all the required input because of a rejection the first time around based on one simple error.
7. Provide intelligent defaults in the selection boxes. If most of your visitors are from North America, why make them scroll through an alphabet of country names? Why not have the USA highlighted in the selection dropdown list by default.
8. Give feedback on progress. If visitors are completing a long series of steps, make it clear how far through the process the have travelled and what is still remaining.
The Swirling GIF
9. Let users know when they are “on hold”. Often it takes a little time for files to upload/download or for complex calculations and internal processes to run. During this time users should have some appropriate visual clues such as the ubiquitous “swirling GIF” image. Even better is to disable the submit button and other controls during this phase.
10. Let users know up front what payment options are acceptable. Don’t make users step through 6 or 7 online screens in order to find out whether or not you accept American Express credit cards. Put clear information about the acceptable payment options right at the beginning of the payment process.
11. Indicate required and optional fields. In particular if the number of required fields or optional fields is small relative to the total, give textual clues.
12. Make field lengths suitable for the type of data they collect. For example there is no reason to have a 200 pixel wide text box for zip codes.
13. Emphasize the primary action buttons. You want to guide the user along a path to the final conversion goal. Highlight the buttons that will take them a step closer.
14. Vertically align the primary action buttons with the input fields. Don’ make users zig zag all over the page to get things done.
Primary action button is on the left.
15. Use progressive disclosure where necessary. Not all users need to see all the options all the time. Reveal or hide relevant input fields based on what users select.
16. Don’t use image CAPTCHA. These things might be aimed to of keep out spam but they also do a decent job of frustrating and driving away your visitors. Use simpler CAPTCHA challenges like “type the answer to this equation ’11 + 4 = ( ____ ) ‘” or “what is the third word in this sentence ‘Lorem ipsum dolor ( _____ )'”.
If you are pulling your hair out over half completed yet abandoned shopping carts or any other type of website owner frustrated by low conversion rates we hope this article may have provided some clues on what improvements you should make to reach your success target.
