Form design is an often overlooked aspect of web form optimization. It’s easy to focus solely on the headline, call to action, and copy. But your form can have an equally big impact on your conversion rates if not given the attention it deserves.

Forms are an important part of your website. Every time you want to turn a prospect into a lead or a lead into a customer, you’ll find yourself asking for their contact information. But the truth is, not all forms convert equally. The design of your form can make all the difference. 

That’s why you want to apply these 3 best practices when designing your next web form. By blending them into your custom form, you can create the perfect way to collect the data you need from your audience.

‍

1. Reduce the amount of resistance - reduce the number of form fields and try to pre-fill as many fields as possible. For example zip codes, country or country codes via IP-lookup services. You can also use a service like Clearbit https://clearbit.com/lp/use-cases/shorten-forms to shorten your forms by looking up an email address and via matched fields from LinkedIn etc . You don't have to display the full form. Statistics say removing a single form field can boost conversions by 26%.  

2. Make a straightforward web form - Conversion rates are directly influenced by the design of forms. Use large fonts for headlines, add a contrasting CTA, put a frame around your forms so it stands out.
   ‍‍
3. Only include fields that you require – The General Data Protection Regulation impact on forms - is becoming clear. With the implementation of tougher regulations for data collection both on and off websites, consumers are beginning to get seriously concerned about how their information is being used.
   
   

If you really want to take your conversion skills to the next level, we suggest that you brush up on your “conversion centered design” skills. Follow the best practice of conversion and utilize Conversion Centered Design, two good resources are:  

• https://unbounce.com/conversion-centered-design/ 
• https://postclick.com/blog/conversion-centered-design/ 

“It’s either blends in or stands out”

 -Responser.com

You’ll learn how to use form placement, adjust size, apply the right color to CTA’s and to add visual cues to focus attention to the right places. That’s called Visual Hierarchy

‍

Designers have been using visual hierarchy for years to help them lay out each element in a logical manner. It is important so the user can more easily understand what his or her eye should be on first, and where he or she might need some extra guidance when looking through an interface. 

These are the 12 principles of Visual Hierarchy:

1. Size Impacts Visibility 
2. Perspective Creates an Illusion of Depth 
3. Color and Contrast Draw Attention 
4. Fonts Organize Design 
5. Space Provides Emphasis and Movement 
6. Proximity Suggests Relationships 
7. Negative Space Emphasizes 
8. Alignment Directs Eyes 
9. Odd-Numbered Groups Create Focus 
10. Repetition Unifies a Composition 
11. Lines Suggest Movement 
12. Grids Organize a Design

https://visme.co/blog/visual-hierarchy/

‍

‍