Eight Rules for Effective Web Forms

Remember these eight rules for effective web forms. When your web forms are designed well, they can provide your visitors with valuable information and enhance their experience of visiting your site while they collect necessary information from them.

Eight Rules for Effective Web Forms

With this in mind, here are a few tips to help you design forms that should be included in every form.

1. Build Conservatively

In the Western world, people read from top to bottom and left to right, and it’s good to keep that in mind when laying out your form. They also often use the tab key to move around the form. Your design should reflect this through intuitive labeling and natural placement of elements. And, of course, your form should never look scattered or haphazard – make sure everything is evenly spaced and neatly arranged.

2. Tailor Your Form to the Situation

Every form you make should be tailored to the specific situation it addresses. When you’re planning the design of your form, ask yourself the following questions: What are you asking? Why? What does your Web design look like with and without the form? Is the form something users want to fill out, or is it something they’re required to fill out? Your answers to these questions should help dictate the layout and content of your form.

3. Use Only What You Need

One element that’s almost always unnecessary is the Reset button. These relics still make an appearance now and then, but they should be avoided. Think about it: When you want to change information on a form, it doesn’t matter if the field is already filled out or not, so why would you even need to erase all the information?

4. Use Clean, Concise Descriptions

You may need to explain why you are collecting certain information on your form, especially when users are loathe to share it, like with phone numbers or e-mail addresses. This not only helps reduce user confusion, but also ensures that the data is accurate and correctly formatted.

5. Be the First to Communicate

If you want to know someone’s name, you aren’t going to stare them in the eyes with a rigid expression and demand, “Full name.” That would just be creepy. If you were looking to garner a positive response from this person, you would instead open with a smile and say, “Hi, what’s your name?” Keeping this in mind, instead of prompting your user with the label “Full Name,” try something a little more personable, like, “What’s your name?”

6. Divide the Form Into Bite-Sized Sections

Communication involves the exchange of ideas in small, manageable sections. You may be asking for quite a bit of information, but that doesn’t mean you have to throw it all at the user in a huge block. Try using horizontal rules, colored bars, meaningful images, or headings that match the design of your site to separate the information into small, easily understood chunks. If all else fails, spread your form out across multiple pages and add a progress bar across the top so users know about how much they have left.

7. Include Meaningful Error Messages

Your error messages should be helpful and clear. Specify in the message which field caused the error, and highlight the label and/or the field itself. After all, no one likes hunting through a form for an elusive field they overlooked the first time around.

8. Release the User

When your visitor clicks “Submit”, they’re done, and they’re ready to head off into the virtual sunset. Your form should say “See you later” or offer some other acknowledgment that the communication is done. Have your form programmed to a “Thank you” page that may offer some other useful information, like we will contact you soon. You could also have a link back to the main page of your site in case your visitor isn’t through looking around.

And that’s it! Keep these rules in mind when designing your next Web form, and you may be surprised at the quantity and quality of feedback you receive as a result.