Getting webforms right: Lessons from the best (and craziest!)

As a fellow marketer, I don’t need to tell you that your webform is a crucial part of your prospect’s user journey, and is not something you can set up once and forget about forever. Despite this, my suspicion is that many of us are guilty of taking this part of the lead generation process for granted. Myself included. 
 
Look at the metrics of any campaign and the webform can frequently be found to be the weakest link. Of course you have to get visitors onto your landing page in the first place, but once they’re there shouldn’t we be doing absolutely everything in our power to ensure those unknown visitors convert into a sales lead instead of dropping out of the system and being lost forever?
 
Whether you need registrations for a webinar or you’re encouraging newsletter sign ups (or any other typical B2B campaign promotion) this is where you need to truly optimise conversion rates. Take the webform for granted and all of your effort with the rest of the campaign will have been in vain.
 
You can download our guide to creating the best possible webforms, with audience-driven insights, but for now let’s celebrate the importance of a webform by learning from some of the best, and perhaps one of the craziest, that we’ve seen:
 
1. HubSpot - Clear, relevant copy with minimal form fields
 
 
As the provider of inbound sales and marketing software, you might expect Hubspot to nail the humble webform every time, and you’d be right. Their email newsletter sign-up form is slightly heavier on text than we might normally encourage, but it’s highly relevant and easily digestible. The heading and sub-header couldn’t be clearer, while the body text concisely explains why you should sign up and what you can expect (even giving examples). They don’t ask for any more info than they really need, with a single form field for your email address and a radial button to select weekly or daily updates. That’s it. The form even gives the option of subscribing via Facebook Messenger. 
 
2. MoneySuperMarket - Mobile friendly with helpful form guidance
 
 
Sometimes a form requires a large number of fields, as is the case when giving an insurance quote. But even then it is possible to apply best practice principles to deliver a simple and satisfying experience for the user, and MoneySuperMarket is a great example of this.
 
Recognising that a large proportion of their prospects use mobile devices, they have made every effort to ensure the mobile experience matches that of the desktop user with a form that is fully optimised for a smartphone or table. 
 
While it is necessary for them to ask a lot of questions to fulfil the service, you can see in the screenshot alone three steps to make this easy for the user: 
 
  • The form manages the expectations of the user by detailing which step they are on out of the total number of steps. 
  • The form includes ‘ghost’ text to make it immediately obvious to the user what information is being asked for.
  • For the majority of questions the form provides the option to click on an icon to find out why they are asking for that particular piece of data.
3. Todoist - Great use of inspirational images
 
 
Todoist, a task management app, keep things very simple yet despite the distinct lack of text the page still manages to say a thousand words. By using inspirational hero imagery they are providing a case study scenario to the user. Who wouldn’t want to manage their projects while out walking the dog in the park?
 
They may use a limited amount of text, but they manage to subtly repeat a message of ‘getting things done’, leaving the user with a sense of positivity. Again, who doesn’t want to just get things done? 
 
Such minimal text also avoids clutter and makes the call to action stand out loud and clear. Rather than include the form fields on the page Todoist actually provide a pop-up including a couple of basic fields, although they also give the option of logging in with a Google account. The unusual step of including a subtle secondary call to action also works here, where they provide the opportunity to watch a video for more detail - again, meeting the demands of today’s user and providing a great experience.
 
4. AccountingWEB.co.uk - Simple yet effective
 
 
This example from one of our own publishing sites, AccountingWEB.co.uk, demonstrates the winning combination of a powerful headline, clear and concise copy, along with a reasonable amount of questions asked (and nothing too quirky). As with all our publishing sites, when you are logged into the site and go to a webform, your relevant contact information is already pre-populated. This reduces the amount of effort it takes for the user to complete the webform and encourages higher conversion.
 
5.  LingsCars - A little personality can go a long way
 
 
If you’re not already familiar with LINGsCARS be prepared for a real wtf moment. If you find the webform above interesting, you’ll find the website homepage mind-blowing! Despite breaking just about every rule in the webform book, this seemingly insane approach has been found to work extremely well for this particular organisation. While a mind boggling amount of text, confusing user journey and migraine-inducing design isn’t for everyone, this rather extreme example does highlight that personality can be important.
 
We should remember that people buy from people, not businesses, and even copy on a webform can resonate better with an audience if it has a little personality. Of course your brand personality must be clear, consistent and have a suitable tone for the audience - something which the first four examples in this post do do adequately well without flashing neon text and cats walking across the screen!
 
Want to ensure your webforms are working hard for you?
 
Download our guide on How to Drive Results with Better Webforms for audience-driven insights and practical ways to get more conversions from your webforms.
 

 

blog

Triana Murtagh Sift Media Tuesday 14 February 2017