Ecommerce Forms Best Practices

Forms are a fact of life in ecommerce, whether you’re gathering the information you need to complete a sale, providing for the creation of an account or surveying your customers to find ways to improve your service.

In other words, regardless of what you do, your users will encounter forms on your site of one type or another. With this in mind, it behooves you to make them as user friendly as possible.

These ecommerce forms best practices will help you do just that. 

Woman with a blank tax form on an iPad

Simplify, Simplify, Simplify
The most important thing you can do in this regard is to minimize the number of keystrokes required of your patrons. According to the results of a study conducted by the Baymard Institute, a lengthy checkout process is one of the leading causes of abandoned shopping carts.

And yes, we get it, the more information you have the more you can do to personalize your site’s shopping experience. Studies have shown this is a good thing too. However, rather than asking for all of the information up front, let the shopper complete their transaction, then ask if they’d like to tell you more about themselves.

Provide Optional Fields
Even as you minimize the amount of information required to complete a form, you can still provide users the option of providing more data as they go along. Just make sure they know which fields are required and which are optional.

Again, if you’re deliberating the nature of your forms as you’re considering something like how to sell ebooks on your own website, less will always be more. But if you must go for even more, be certain your optional fields are specifically labeled “optional” to avoid confusing your respondents.

Use Size as an Indicator
When a user looks at a field its size should give them an idea of what’s expected of them. For example, an address field should be longer than a phone number field. You can also provide a single field for data that requires formatting. In other words, rather than providing three boxes for a phone number, use one and have the algorithm format the number automatically. This can also be done with dates of birth and addresses.

Offer Auto Completion
Where duplicate information might be required, program the form to fill it in everywhere else it might be needed after the initial input. If you’re asking for an address, request only the street name, number and ZIP code. The form should then designate the city based upon the ZIP code. This also saves keystrokes.

Use a Show Password Option
Typing errors will cause failed log-ins. Giving the user the option to see the password as they type it (of afterwards) lets them isolate an error more quickly and alleviates the potential for frustration. Similarly, when users are creating accounts, rather have them type a password twice, give them the option of viewing the password they created. To increase security of this feature, you can provide an icon or a checkbox to unmask the password for confirmation. This offers the user an opportunity to double-check it before sending.

Employ Keyboard Matching for Mobile Devices
If a field requires numbers, have your keyboard automatically switch to the phone pad rather than forcing users to switch the keyboard to reveal numbers and associated symbols. If a capital letter is required, have the form correct it automatically if tusers enter a lowercase letter.

Explain Data Requests
If you need to have personally identifiable information, explain why when the user hovers over the field. Keep the explanation to a maximum of 100 characters to ensure they read it. 

Give Them a Status Indication
People are more likely to be patient with a form when they know how far along they are in the completion process. Progressing a status bar across the screen as they move through the form lets them know how close they are to completing the form. Give them a success indication when they’ve satisfied the requirements and their data has been transmitted,

But wait, there’s more. As in-depth as this might seem, we’ve only scratched the surface of ecommerce forms best practices. If you’re interested in learning more, SmashingMagazine has one of the most comprehensive primers on the subject we’ve seen. Giving it some time will be worthwhile. 

Post a Comment



The ZOO banner 3