Acquisition

Everything You Need To Test And Optimize Ecommerce Web Forms7 min read

everything-you-need-to-test-and-optimize-ecommerce-web-forms

Web forms — pop-ups, in-line forms, and more — are a great way to generate new leads on your ecommerce website. You can encourage your shoppers to give you their information so you can send them content that convinces them to make another purchase later.

Of course, nobody really loves filling out a form while shopping online — especially when it seems like every time you land on a site you’re bombarded with popups trying to get you to sign up for this or download that.

Yet 86% of people fill out at least one web form per week, which makes them an important part of your ecommerce marketing toolbox.

The tricky bit comes with getting your customers and potential customers of your ecommerce business to:

  • Want to fill out the online form
  • Finish filling it out and submit it

To improve your form conversion rates and earn the relevant customer information, you need to optimize your web forms to improve the user experience and maximize your chances of success. But how do you do that exactly? Here’s what you need to know to get the most out of the web forms on your ecommerce site.

Web forms use cases

Almost half of marketers cite web forms as their highest converting lead gen tool. There are a number of different ways you can use web forms to collect important information on your customer to get them moving down the pipeline towards a sale. These include:

  • Sign up for a newsletter
  • Sign up to become part of a loyalty program or for an account
  • Attend an in-person on online event
  • Access premium content
  • Questions, comments, feedback or complaints
  • Standard shopping cart

While many B2C marketers tend to focus on just collecting an email address, you can also use demographic information such as location, gender or age to better personalize communication and make it more relevant and useful.

Best Practice: It’s very important to note that when customers give you their information, they’re trusting you! Make sure you use it wisely and sparingly. Don’t start firing off all kinds of irrelevant content that will make them wish they’d never filled in that form. Treat these customer communications like the gold that they are.

Optimizing your web forms

Even if you’ve got something amazing to offer customers in exchange for their details, setting up any old web form and hoping that they will fill it all out is not a good strategy. You need to follow website design best practices and personalize the form to make it clear, contextual, and technically sound.

Design and tone

Your web form needs to have personality and stand out. To do that, you should match the web design with the style and tone of your brand. If you’re funny and silly normally, be funny and silly in the web form. If you’re normally sarcastic and edgy, carry that tone through to the form. See web forms in the same way you would any other marketing material.

Also, make it quick and easy to fill out, don’t include irrelevant fields, and follow common UI and UX best practices.

Purpose and clarity

Don’t waste a customer’s time with 15 different form fields to fill out to make an online order. Make it clear what the web form’s purpose is, as well as exactly what they will get and when they will get it. If customers don’t understand the form and it’s too complex, not only will they not fill it out, they are less likely to trust your brand.

Always include a confirmation page so buyers know they submitted the form correctly and don’t have to do it again. If you are asking them to subscribe to something such as your newsletter, it’s good practice to ask them to confirm and opt-in via a link in their email.

Make sure the web form is also integrated into the site in a way that it doesn’t interrupt a user’s flow. Normal customers have a goal when they get on a site, and if you distract them a poorly placed popup, you might annoy them and lose their business. That’s also why it’s important that the web form is relevant and has a clear purpose.

Customization and context

Where you put your web form and when it appears matters. You can either choose to embed your web form on your site or make it pop up at certain, triggered moments like exit intent.

If you want your customers to sign up to your newsletter, then it makes sense to have a signup form on the homepage as this is normally the first place they visit. If you’re having someone sign up for a rewards program, it makes sense to have it on the order confirmation page alongside credit card information instead.

You can also customize and personalize these web forms according to past shopping behavior and customer interactions. For example, if a customer is browsing women’s sneakers, you can use a popup webform to offer them free delivery or a coupon for these sneakers.

If you are using popup web forms, make sure you don’t show them too often. If a customer has already clicked out of a form on one visit, don’t show it to them again. Or limit the amount of time you show them the popup in a week or month.

Testing your web forms

Before you put anything in front of your customers, you need to have tested the hell out of it, ecommerce web forms included.

Don’t annoy your customers by displaying a web form that has typos, is poorly designed so it’s not clear, or doesn’t work. You’ll not only drive them away, but you’ll also convey a bad image of your brand.

Check how it looks on desktop and mobile to see how it displays, proofread the text, ask people in other departments if they understand it and if it works properly for them.

As you get more and more people to fill it out on your site, you can also A/B test lots of different elements, such as:

  • Colors (text, background, and buttons)
  • Font (type and size)
  • Word choice on the page and buttons (and number of words)
  • Button placement

Great examples of web forms

So that the theory, but what does a great web form look like in practice? Some ecommerce platforms include web form templates, but you can also design and create your own. Here are some examples of creative and effective web form designs we’ve seen lately.

UNTUCKit surveys buyers

As buyers go through the checkout process, UNTUCKit includes a quick little web form that asks how buyers found out about them. This is a great, but non-intrusive form that gives the brand a bunch of information about what marketing is working best.

Sticker Mule offers a discount

This is a classic, but unintrusive web form option. Sticker Mule has a small pop up in the corner of the screen promoting a discount on their products. This is great because it’s easy to close, doesn’t interfere with the browse experience, but is also noticeable.

Soko refers friends

This is a classic web form that helps Soko refer new customers to their brand while offering existing customers a great discount. The pre-written copy makes it super simple for buyers, and the three-day reminder is especially clever.

The ultimate goal of web forms is to encourage your customer to convert and become loyal to your brand. By following these guidelines and emulating these fantastic examples, your web forms will be more effective and help you deliver a superior customer experience through personalized, relevant, useful communication.

This article was originally published by our friends at Zaius.

About the author

Steve Hutt

I'm obsessed with entrepreneurship, commerce, and Shopify. If you have the desire to implement what's working today for direct-to-consumer brands on Shopify, I'm excited you're here! Get the Shopify help you need. This industry blog and podcast is my digital brain where my guests and I share cutting-edge marketing strategy, must-have Shopify apps, and marketing platforms that will help you build and scale lifetime customer loyalty. To do this, I'm part of the Merchant Success Team at Shopify Plus and host of the eCommerce Fastlane Podcast.