One Simple Change That Reduced Form Friction By 96%

The

Form Analytics Will Change How You Approach Form Page Optimization

When we think about conversion rates we look at whether an offer converted or if it didn’t. Sure, we’ll try to do some detective work and analysis to figure out why something did well (or crashed and burned) but often times we are looking in the wrong places!

Whenever people analyze a landing page or really any page, the first thing they’ll do is look at the page messaging and the page layout. What often gets overlooked is one of the most important factors on the page:

The form itself!

For something that is so important, forms are often added as an afterthought. Normally we connect with our ecommerce provider, email service provider, or CRM and use the default settings and basic form layout structure, e.g., Name, Email, Phone, etc…

However, when you just stick to defaults or add something crucial to your page as an afterthought, you’re leaving money on the table.

Case and point: DigitalMarketer’s lead generation opt-in forms were converting fairly well on mobile, but there were some major optimization opportunities…

…and none of them had to do with responsive design, page layout, or messaging. It was a technical mishap that added friction and frustrated users.

Meet DigitalMarketer’s mobile landing page for our Customer Avatar Worksheet lead magnet:

Mobile-Lander

The page looks great. It has the name of the deliverable, a description of what you’re getting, an image depicting the offer, and a clear CTA (below the fold we have more convincing content with a reiterated CTA).

Meet DigitalMarketer’s landing page form that shows up when you click the ‘Get Your Worksheet’ button:

Mobile-Overlay

Sure, the ‘Get your Worksheet’ should probably be centered…but overall this is a solid overlay on a mobile phone. The copy is telling the visitor they are almost done, they are given another visual reminder of the product, and the form is clear as day.

Guess how this form converted?

If you guessed 79% on mobile, good job! If not, well, you were probably close!

Check it out:
Form-Analytics
This report was created using TruConversion…get your own awesome form report by clicking here.

The average conversion rate for this page (including all devices) was 35.76%, so needless to say mobile visitors were converting pretty well. However, DigitalMarketer was succeeding despite themselves.

And here’s why…

Field-Analytics

On average people were spending 26 seconds on the email field and 38% of people that used that filled had to ‘refill’.

When people have to spend more time on something trivial that is generally bad for your conversion rate. Even worse, when a person has to refill a field they are one step closer to saying ‘Screw it, I don’t need this stupid worksheet!!!’

Well, DigitalMarketer could have been complacent and just said ‘Who cares, we’re getting a 79% conversion rate I don’t need to improve this experience!’ And if they had said that their customers should have lined up to smack them in the face.

The whole point of optimization is to improve the user experience and in doing so you’ll improve your conversion rates!

So DigitalMarketer decided to put on their detective hat and figure out why people were having such a bad time on the email field. It was actually pretty easy to sniff out.

Here’s the old keyboard on iOs that loaded when you click ‘Get Your Worksheet and are on the ‘Email’ field:

Old-Keyboard

See an issue? I do! THEY DON’T MAKE IT EASY FOR VISITORS TO TYPE THEIR EMAIL!

That shift button is small and is difficult to use. This leads to more typos, more time spent trying to click the button, and more errors!

The developers made a simple tweak and changed the keyboard to this when on the email field:

New-Keyboard

After this change was made they saw some serious results!

Results

There was a ~1% increase in conversion rates, which is great considering how high that conversion rate already is. But here’s what is incredible:

• Decreased time spent on the email field by 57%
• Decreased the number of refills by 96%
• Decreased the total time spent on the form by 47%

After proving this improvement in form usability would mean a better experience for prospects, DigitalMaketer made this a global change on all of their forms and have seen similar results.

Key Takeaways

There was nothing about the offer, the copy, or the page design that impacted how users interacted with the form.

If they just looked at the raw conversion rate instead of digging into detailed form analytics they would have continued to provide a sub-par user experience which would seriously impact conversion rates on higher stake form submission pages like carts.

On any page that includes a form you should be pulling form analytics to get the full picture of the user’s experience.

1) You need to understand how to develop a well designed high converting page
2) You need to have a form that is optimized for devices and for your target audience (different geo regions expect fields to show up in different orders)

The former requires offer analysis, design work, and a lot of time whereas the latter is more technical and can be done fairly quickly.

The analysis and update to the page only took DigitalMarketer about an hour. They saw a problem, figured out what caused the problem, and made the change (notice there was no split test here…you can read more about why here).

So with less than an hour’s worth of work DigitalMarketer was able to improve their form usability across all of their properties…not bad at all.

tl;dr – DigitalMarketer was able to make a quick change based on often neglected data that improved conversions and provided insights for other crucial pages on their site. 

Final thought:
If you have any page with a form on it (and I know you do) use form analytics to make better decisions rather than just looking at the raw conversion rate. Your customers (and your conversion rates) will thank you!

Justin Rondeau is the Director of Optimization at DigitalMarketer and leads product innovation at TruConversion. He specializes in optimizing marketing campaigns and digital experiences to help grow businesses and is also interested in user experience research, karaoke, split testing, mustaches, and the Boston Bruins.

2 Comment

  1. Susan Lassiter-Lyons says: Reply

    So, the change is just defaulting to lower case instead of upper case?

    1. Hi Susan,

      How this wasn’t about defaulting from upper to lower case, it was about defaulting the keyboard that shows up when they are on an email field. In the updated variation we added an ‘@’ and a ‘.’ so they can easily enter their email address (rather than having to hit the annoying ‘shift’ key).

Leave a Reply