User experience and conversion rate go hand in hand. For every $1 a business spends on improving its user experience, there's a potential $100 return. Better UI and UX, meanwhile, can potentially raise your website's conversion rate by 200% and 400% respectively. 

You likely know all of this already. The value of a positive user experience is, after all, a known quantity across virtually all business sectors. That applies just as much to your contact forms as it does to other segments of your website — as we mentioned in a previous piece on CAPTCHAs, more than 67% of leads will permanently abandon a form if they encounter even a minor complication.

‍

Given that forms are inevitably the final stage in your lead funnel, that's something you don't want to happen.  

Here are five design tips to improve the user experience of your contact forms. You need not solely take us at our word, either — each piece of advice is founded on empirical evidence. 

1. Keep Things Simple

Complexity is the enemy of success, and a complicated sales or lead generation process can drag down your conversion rate as surely as a poorly-designed website. The more fields your form has and the more difficult those fields are to complete, the less likely a lead is to see the process through to the end. On the other hand, removing even a few fields can have a considerable positive impact. 

• A company surveyed by Unbounce increased its conversion rate by 120% by reducing their form fields from 11 to 4. 
• One minor error in Expedia's contact forms cost the travel agency $12 million. 
• According to The Baynard Institute, the average checkout displays approximately double the number of necessary form fields. 

In order to simplify your contact forms, take the following steps: 

• Remove any questions that aren't absolutely necessary for lead generation. 
• Eliminate dropdown menus and use radio buttons instead.
• Use a single column instead of multiple columns. Because of how human eye tracking works, multi-column forms are more difficult to fill out. Increased difficulty means reduced conversions. 
• Make sure your language is straightforward and to the point. There should be absolutely no doubts in a lead's mind of your reasons for requesting each specific piece of information. 
• Ensure your form supports auto-fill, as it can save leads a significant amount of time when filling out their details. 

2. Create a Sense of Progression

It's something we've all experienced at one point or another. When we complete the first step in a multi-step process or project, we feel compelled to continue. That compulsion only increases as we come inexorably closer to completion. 

It's a well-known and well-worn principle in marketing, and one that is highly relevant to your form completion rate. By designing your forms around progression, you can actually subtly change how leads perceive your forms. As with simplification, there are a few steps you'll need to follow here. 

• Arrange your fields in order from simplest to most complex. That way, by the time your leads reach the difficult contact fields, they're already invested. 
• Divide your forms into multiple steps to avoid overwhelming users with too many fields all at once.
• Add a progress bar so that customers can see where they are in the conversion process. 
• Think long and hard about how your forms flow. Each field should feel like it leads naturally to the next, 

3. Think About Errors

How do your contact forms communicate to leads that they've provided incorrect or invalid data? Do leads find out only when trying to process from one step to the next? Does the entire form refresh, resetting everything they entered in the process?  

A poorly-implemented, intrusive, or confusing error message is a conversion killer. 

In order to ensure your form's error handling doesn't frustrate or alienate your audience, you'll need to consider both the content of your error messages and how they're presented. General best practices in that regard include: 

• Ensure it's immediately clear what a lead did wrong, why it's a problem, and how they can fix it. 
• Do not assign blame for the error. 
• Don't use popups for the error messages. Instead, consider inline validation, which alerts users to issues or errors in their data without shoving popups in their face, thereby improving everything from success rate to completion time.
• Speaking of alerts, ensure they're in an easily discoverable location, such as to the right side of each form field. 
• Allow users to turn off password masking if they so choose, especially if they're on mobile. 

4. Make it Readable

Aside from layout, readability is hands-down the most important characteristic of your contact form. It's also one of the more complicated concepts to define, primarily because it's impacted by so many different elements. Orientation and simplicity aside, the following factors may have either a positive or a negative effect on readability: 

• Choice of font. Make it something crisp, clean, and professional. 
• Field size. Try not to make them too large or too small. 
• Visual design elements. This includes graphical flair like shadows, bevels, color scheme, background, etc. 
• Visual indicators as to whether or not a field is optional.
• Keep related form fields grouped where possible. 
• Don't use placeholder text to label form fields, but to provide context to them. 

When designing for visibility, you also need to consider accessibility. Some of your leads might be colorblind, require a screen reader, or suffer from vision problems that make reading small text difficult. To ensure that these leads are accounted for and not left in the lurch, you'll need to: 

• Allow users to customize the size of the form's fields.
• Allow users to customize font size, type, and color. 
• Ensure you aren't relying solely on color to communicate error messages and other information. 
• Incorporate support for screen reader applications. 

5. Design for Both Mobile and Desktop

You would expect that, with the shift to remote work, smartphone usage would have gone down — after all, people are spending more time working in their home offices now, right?

While it's certainly true that people are spending more time on their PCs than they once did, mobile usage, spending, commerce, and ad placements all spiked during the pandemic. People are spending more time on their phones, spending more money on mobile apps, and spending more time on shopping apps. What this means is that if mobile support was important before the pandemic, it is now something you can no longer ignore. 

When it comes to filling out forms, mobile users have a few unique needs compared to desktop. 

• Visible passwords: The chance that someone will be able to steal a user's password by looking over their shoulder is minimal, at best. Even on desktop, password masking doesn't do much for security — and on mobile, it actively damages usability.
• Field focus: When a mobile user is editing a field on your form, that form should be centered on their screen so that it's always visible. 
• Font size: For mobile devices, keep the font size on your form as close to 16 pixels as possible. And if you need to use anything smaller, don't go below 10 pixels and use all caps. 
• Touch targets: You'll want to design your mobile form with an eye for how users hold their smartphones and where on their screen they most frequently tap or touch. This also extends to buttons, with sizing that varies based on their distance from the screen's center. 
• Form fields: These should be slightly larger for mobile, and code should be used to toggle autocorrect and autocapitalize off. For autofill, you can either disable it or try to offer context clues in your form's backend. 

Form Design Doesn't Have to Be Challenging

Contact forms are among the most frequently-neglected usability elements on the web. Given their proximity to the end of the sales funnel, that's a problem — and Responser offers a compelling solution. 

Our lead recovery and form abandonment software not only allows you to recapture lost leads, but also helps you optimize every step in your funnel. 

Start your free trial today if you’re ready to recover more lost leads.

‍