Publish: April 12, 2018 by framestr
When creating online forms, you need to think about a form that will streamline the user’s experience. While you always expect users to fill out forms as accurately and effortlessly as you can imagine. It isn’t the case always. As a technical person, some things that you can answer in your sleep are complicated to the non-technical person.
Also, users make multiple mistakes, and that is where your help comes in. You need to offer assistance, as well as validation explaining how to fill out the forms for the user to fill the forms successfully. As we wrap our heads around the online rave shopping trend, you need to ensure that your form is intuitive. You shouldn’t have to explain to users the process of filling out a form. So, if your forms appear too complicated, redesign it.
To design intuitive forms, keep these tips and tricks in your back pocket.
You have to keep stories out of forms and use text only where you need it. But, you shouldn’t use more than 100 words to explain things.
You will require concise text when asking for unfamiliar data – that is, anything that will leave your user asking ‘what is this?
You also need concise text when asking for specific data, when you have concerns about privacy or security, or when the information is necessary within the particular context. The latter captures the essential information to help users move through the form.
In cases where the amount of text to guide the users will appear complicated, use dynamic contextual text. These texts include automatic inline help which will reveal itself as a user clicks an input field. Maintain a strong visual connection between the fields and the help text.
You could also use the user-activated inline exposure to help people access txt only when they need it. A question mark icon works well for this.
Forms with multiple input fields discourage users hence the need to ask only for relevant information. Instead of asking for home addresses and their weight, ask for name and phone numbers.
Less is more if you want to boost completion time, and to decrease the cognitive load.
As much as you can, help your respondents fill out the form. Since you already have some of their information, wow them by pre-filling the fields or, don’t show them.
Allow the eyes of your respondents to move naturally by using the single-column design from top to bottom. This design saves the eyes the agony of zigzagging and checking to see if they filled out everything. It also increases the completion time. Single column design direct respondent to start at the top.
Allow for automatic activation of fields, especially the first field to prod the respondent.
To create a feeling of gradual answering, use semantic sections, especially in forms with multiple fields.
If you don’t want your respondents to give up or get angry since you didn’t share the constraints earlier, add the constraints. Ever wondered ‘how was I to know that?’ On the same note, incorporate visual constraints and be clear in your error reports – ‘something went wrong somewhere’ won’t work.
Lastly, place the labels outside the field and if necessary, use the labels in combination with the placeholders. Also, mark the optional, rather than then mandatory fields.