When it comes to Web design, online forms are often an afterthought. They get tacked on at the end with little strategy involved. Sure, functionality is tested to make sure the form works. But that’s usually the extent of it.
It’s a crucial mistake. Forms are a vital part of websites and landing pages. They are where visitors go to take action. Not optimizing them is like running an entire marathon and then giving up inches before you cross the finish line.
Too many organizations today do not optimize their online forms, and it discourages and decreases completions and submissions.
A recent statistic from the 2015 M+R Benchmarks Study revealed 13% of people who visit a nonprofit’s main donation page completed a gift. Undoubtedly, that number would be higher if more organizations optimized their forms.
If you’re reading this right now and realizing your forms are not optimized, don’t worry—there’s still hope. The great thing about the Web is that changes can always be made and they can have an immediate impact.
Seven Smart Ways to Improve Your Online Forms
Here are some practical tips for improving the effectiveness of your online forms you can put to work on your website today…
1. Keep it simple
Organizations get excited about collecting data and go overboard with their form fields. They want company name, address, phone, email, job title, field, service interest, etc. Sometimes these fields are required, sometimes they’re optional—but either way they’re detrimental.
The more fields you have, the less submissions you will get. Narrow it down to the essential. What’s the minimum amount of information you need? Once your get people in the door and establish a relationship, you can always ask for more info later.
2. Think mobile
How do your forms look on mobile devices? If go to your form on an iPhone or Android phone, can you see the entire form? Is it easy to fill out? Is it easy to submit? Do users can the same level of experiences they get from a desktop?
With more traffic coming from mobile devices, it’s important to optimize your forms for mobile viewing. Otherwise you’ll lose out on a significant number of submissions.
3. Avoid ghost text
What is “ghost text”? It’s when you put helper text inside the fields to show people examples of how to fill out the form. This practice has actually not proven to be much help at all—it has been shown to hurt usability. Unless you have a highly complex form, it’s probably a good idea to steer clear of ghost text.
Here’s an example of ghost text:
4. Use infield top-aligned labels
A good way to make your form easy to scan is by using infield top-aligned labels. So rather than putting “First name” above a field box, you would put it inside the box just above the area where a person inputs their information. Learn more about how and why to do this here.
This is an example of infield top-aligned labels:
5. Address the next step
When someone fills out a form on your site, do they know what will come next? Through the use of text above your form or text that appears after submission, tell people explicitly what will happen after they submit the form. Will someone call or email them? Who? When?
Tell people exactly what to expect when they submit a form—then meet those expectations.
6. Verify submission
Far too many form submissions end with a thud. The user makes the effort to complete the form, submits it, and then… nothing. No message, no confirmation, no nothing. This is a bad practice that makes users wonder: Did I actually submit the form? Did something go wrong?
Make sure to let people know the form has been received—either with a post-submission message, an email, or both. It can be as simple as: Thanks! We have received your request and will get back to you as soon as possible.
7. Create strong call-to-action buttons
Buttons with more specific actions have been proven to perform better than buttons with generic labels like “Submit” or “Contact”. You want to make your button text as strong, informative and compelling as possible.
This post provides the example where a button that said “Submit Survey” had a 44% conversion rate versus just 10% for a button that said “Submit”. Try to be specific with the action, while still keeping it short and sweet—like “Sign Up Now”, “Try It Free” or “Send My Donation”.
What best practices have you discovered by testing your online forms? Share your tips and insights by commenting below.