Blog

Web Form A/B Testing: How I Increased Form Fills by 37%

Web form a against web form b

Last month, I launched an A/B test of our Request a Quote form page to see if a new design would impact the percentage of form fills. I planned the design of a new version of the page to see if the some of the basic "best practices" really had an impact. The result was a 37% increase in form fills.

Here is what the current form looks like:

Our current request a quote form.

Here are the changes I made:

Fewer visual distractions. I got rid of the main navigation and all other content on the page. The only action to take was to fill out the form. I did leave a "Back" button, which currently points back to our home page. (I plan to change this to a simple "Back" button that takes the user one page back, like a browser button would.)

Items being removed from the request a quote form.

Form validation. I added form validation cues such as a green check mark or a red "X" that confirmed, in real-time, whether the form was being filled out correctly. For the "Phone" and "Company" name fields, I wasn't too picky, in fact allowing those to remain blank, if need be.

Form validation example in the new request a quote form

Supporting content. I knew that there were questions that users were asking before requesting a quote. I wanted to answer those and add some value, as well as reassure that we do not use their data in any dubious ways. Most of the on-going testing will revolve around trying different things of this type: showing our list of clients again to re-enforce our credibility, including trust badges and certificates such as our AdWords Partner Status, BBB accreditation, and a Verisign-type security badge.

Content that supports the request a quote form.

The new request a quote form

The new form is stripped of superfluous content and makes the form almost fun to fill out with immediate validation of input data. Another small, but nice feature is the default placement of the cursor within the first field to fill out.

Our new request a quote form

The new form increased chances that a visitor to the form page would fill out the form by 37%.  Below are the Google Website Optimizer results:

Google Website Optimizer results of the request a quote form test

This test came on the heels of a previous landing page test,which increased our overall conversion rate (all traffic) from 1.12% to 2.42% (a 217% increase). The increase in the form fill rate led to another increase in our overall conversion rate, this time to 3.36% (a 301% increase from our original 1.12%).

Ab test results from form optimization

I will test out adding the following in the coming months:

  • Trust symbols
  • Testimonials
  • Client list
  • Value proposition

Changing the name of the form is also something I have considered, perhaps a "quote" is not what our best clients are looking for. To test this, I will create 3 identical forms with different names and different calls to action on the page going to them. I will try:

  • "Request a Quote"
  • "Request a Consultation"
  • "Contact Us"

If you have any suggestions on what the test out in the future, please leave a comment below!

NEW POST (September 29, 2011): How an Owl Increased Our Retargeting CTRs by 430%

For more on Web Form conversion optimization, take a look at these two videos:

5 Ways to Increase Your Website's Conversion Rate Whitepaper

Share this post

Comments on this post

  1. the form is a nice squeeze page, but doesn’t squeeze to hard.
    It clarifies
    1.what they’ll receive by filling out the form.
    2. Timeframe it takes to get in touch.
    and it just looks good and ofers a nice header with phone and address. Keep testing and try thos trust building icons as well. Thanks for sharing.

  2. great article, rearly interesting how such small changes can make a massive diffrence to conversion. Turning the quote page into almost a mini site is a rearly cool idea.

  3. I’d also test changing “Submit” to read “Request a Quote,” like the button at the bottom of this page.

  4. I second this experiment. have seen an increased response just by a more user oriented easier design and weeding out the distractions. It definitely WORKS.

    Another thing I tried testing is minimizing the number of fields. Though in SEO and web design it’s bit tricky but clients don’t like to fill up a lot… at the same time, it’s good to get the most required details and later you can sort once you get the leads…

  5. No one has mentioned the placement of the labels. The move from left to top is a subtle, yet powerful, change in reducing the perception of visual noise. It’s a much calmer design and lets the user focus more on the task at hand. Filling in the form.

  6. Pingback: Tips For Becoming A Tough Google A/B Tester | zach is blog

  7. Pingback: Smart marketers A/B Test businesses, not websites. Here’s how. | Good for Customers, Great for Business

  8. Even though this is an old study it is still very relevant some great tips on conversions guys!

Comment on this post

*
*

Ready to discuss your project? Work With Us
Blue Fountain Media is recognized as a
Top Digital Agency by
Ranked #1 Interactive
Agency by top interactive agencies example
Ranked Top 10 Digital
Agency by awwwards logo
Ranked Top 10 Agency
Worldwide by IMA logo
Featured Blog Article
Download our Free Whitepapers
Our Locations
New York Headquarters
New York Headquarters
102 Madison Avenue - Second Floor
New York, NY 10016
Chicago Office
Chicago Office
222 Merchandise Mart Plaza, Suite 1212
Chicago, IL 60654
Seattle Office
Seattle Office
14980 NE 31st Way, Suite 120
Redmond, WA 98052