Web Form Design Checklist


Share on LinkedIn

On average, 62% web forms are abandoned before completion – this means that organizations are losing out on a lot of potential leads, applications and quotations, which results in lost leads and ultimately lost revenues. So in this, the first of two blogs on designing web forms, we’ve pulled together a simple checklist for you to use. The next blog will look at such aspects as field order and single page vs. multi page forms, but initially, I think it’s worth recapping the basics. In order to maximize web form submissions, marketers must design their web form with the recipient in mind. This may seem obvious, but it is amazing how ‘form blind’ marketing departments can get when they are trying to capture all the information they require. Typically, the marketer passes a list of fields to be captured to the web developer and scant attention is paid to what will make the form convert. 

Before designing any type of web form, it is important to define what you are trying to achieve. For instance, is your goal to maximize the number of form submissions, or drive only qualified leads i.e. quantity versus quality. Also, what value do you attribute to these form submissions – do you want a long standing relationship with these people? You need to have defined your requirements and those of your target audience so you can incorporate these into your form and required fields. Depending on the form’s purpose, the number of fields can range dramatically, so one of the first considerations is whether to have a single page or multi page form. Getting the balance is essential – people will be more reluctant to fill in multiple pieces of personal information if they do not feel it warrants it (i.e. a 10 field form for a pdf download) and too many fields on one page will put people off filling in the form completely.

Single Page Web Form

Some key considerations when designing a single web form are described below on our web form design checklist:

  1. Number – Use the minimum number of fields possible
  2. Order – Easy data first, hard data later. Make it easy for your prospects to get started
  3. Placement – Ideally all above the fold
  4. Call to action – Clear ‘positive action’ button which restates the benefit, as opposed to a simple ‘Submit’ button
  5. Flow – Logical flow of requested information

Multi Page Form

Multi page forms can prove to be more problematic. For insurance claims or credit card applications, organizations require detailed, and in most cases very personal, information from the applicant in order to progress the form submission:

  1. Simplify – Break forms done into multiple steps so it does not overwhelm
  2. Show progress – Implement progress indicators so applicants can track their way through the form
  3. Order – Easy first page, getting harder the further down the application process, when people are more compelled to complete since they have already gone so far
  4. Email address – Capture email address early in the process – this allows you to remarket to those that abandon the form
  5. Use persistent forms – Ensure applicants don’t have to re-enter information on an application that they had previously started to complete
  6. Show ‘Email me this’ button – So applicants have an easy link back to their partly completed form, which you can include in a remarketing email

Landing Page

Depending on the way your website and forms are set-up, you may also have a landing page to construct. The landing page needs to entice people to start the form submission process. Here are a few items you should consider for inclusion:

  1. Clear benefits statement – To show why people should fill out the form
  2. Testimonials / quotes or video – To increase the organization’s credibility and their offerings
  3. Encourage communication – Through detailing contact phone number, email address and/or a click to chat button, which enables people to contact you should they have an issue. You have to strike a balance with this though since you do not want them to go away from the form unnecessarily to contact you by other means

To gain more insight into how to design web forms and increase conversions, register for our webinar this Thursday, November, 18th. The webcast will discuss best practices when designing forms and landing pages, long forms vs. short forms, field order (and why it’s important), landing page optimization techniques and best practices as well as how Facebook can help you to increase form conversions. You can register for this webinar (which will be available for download after the event), entitled “Maximizing Conversions from Web Formshere.

Charles Nicholls
Charles Nicholls is a social commerce expert and board advisor to several e-commerce startups. He founded SeeWhy, a real-time personalization and machine learning platform, which was sold to SAP. Serving as SVP of product, he built SAP Upscale Commerce, an e-commerce platform for direct-to-consumer brands and the mid-market. Today, Charles serves as chief strategy officer for SimplicityDX, a commerce experience company. He has worked on strategy and projects for leading ecommerce companies worldwide, including Amazon, eBay, Google and many others.


Please use comments to add value to the discussion. Maximum one link to an educational blog post or article. We will NOT PUBLISH brief comments like "good post," comments that mainly promote links, or comments with links to companies, products, or services.

Please enter your comment!
Please enter your name here