Good website form design can make a significant difference in the success of the data collection. This is why forms should take the respondent into consideration with its layout and field selection. Here are nine UX tips to make your website forms more successful.

1. Collect Only The Pertinent Information

You will want to collect only the required information. Doing this will speed up the process, increasing the likelihood of successful form completion.

Asking for less information also lightens the cognitive load on the user, keeping them fresh and engaged.

01

2. Set The Focus To Speed Up Entry

Be sure to set the focus to the first data collection point on the form when it loads. This saves the user from having to search the screen for a start position. Not only does this mean faster collection, but it also helps to eliminate common user mistakes.

02

3. Prefill As Much As Possible

Help out your respondent by filling out as much of the form as possible for them. In many cases, the country, state, and even city can be determined by their connection. But you should still have these as editable fields for data quality. For example, the current location may not be the respondent’s address.

03

4. Use A Single Column Layout

A single column layout is more natural for the eye to follow. A form that has both vertical and horizontal fields forces the user to follow a zig-zag pattern as they provide information. This pattern can cause eye strain and errors.

04

5. Logically Group Fields

Group the fields that logically belong together. Doing this allows for a reduced cognitive load on the respondent, speeding up the collection and reducing errors.

05

6. Use Concise and Informative Error Messages

A weak error message can serve to confuse the user and create more errors. By having concise and informative error messages that explain the issue, the problem can often be corrected with minimal effort.

06

7. Use Input Constraints

One of the best ways to be sure that quality data is being collected is to use input constraints. For example, a mask for a phone number can validate that the correct amount of digits are received. Another use might be to collect only figures for zip code and payment information.

07

8. Use Visual Constraints

Visual constraints can help guide the respondent in providing the required information. One use of this is to have field lengths that closely match the expected input. This gives a visual clue to the user about the information that should be provided.

The use of visual constraints can also make the form easier to follow, reducing errors.

08

9. Explain the Data Collection to the User

Finally, be sure to explain to the user why the data is being collected. In most cases, this is private information that is being requested. Explaining the purpose of the data will build trust with the respondent, and they will be more likely to fill out the form in a useful manner.

09

Leave a Reply