How to build an online form that converts

Listen with curiosity. The greatest problem with communication is we don’t listen to understand. We listen to reply. When we listen with curiosity, we don’t listen with the intent to reply. We listen for what’s behind the words.

Roy T. Bennett

Listening doesn’t always happen face to face.

Right at this moment, someone, somewhere around the world is trying to listen to their audience using an online form.

The right data is a beautiful thing. It clarifies and illuminates, taking businesses forward and creating stronger leaders. It’s the differentiator between a good business and a great one.

To collect the data you need, we have to start with the bare bones of a form. Every high-converting form is built with smart, savvy information architecture.

Let’s dive in.

Why do you need a form?

As Steve Jobs said, you need to get close to your customers. They are the key to your success, after all. We all would like to climb into our customer’s brains to know how to better serve them.

So, when presented with the chance to ask them questions — a form — it’s tempting to simply start brainstorming all the questions in the world you could possibly ask them.

RESIST!

Here’s the first rule of smart, strategic form building:

Every single extra question makes your users less likely to complete the form.

Every accouterment, every decoration, every additional section that doesn’t really need to be in there.

Longer forms = lower conversion rates.

Instead, write down the knowledge you’d like to gain from the form and work backward.

What is the purpose of your form? Feedback? Research? Performance?

Write down specific knowledge you’d like to gain from your survey, along with a couple of simple questions you think might answer your hypotheses including the set of possible answers.

Next to the answers, write down the percentage of responses you’d expect in each bucket. Comparing the future results against these guesses will reveal where your intuition is strong and where blind spots exist.

This pre-survey process will also help you synthesize the critical aspects of the survey and guide your design process.

Remember: as the scope of your survey widens, the pool of likely respondents grows narrower.

Simplicity is the most crucial — and most under-used — form design feature.

So. Think very carefully about what you do and don’t need. Kill your darlings.

Think carefully about why you need this answer and how you will use it. If you have any uncertainty, lose it. Consider the exact data you’re after, align your questions with that, then get your red editor’s pen — and ruthlessly cut everything else.

The shorter the form, the sweeter the results. Long forms lead to respondents a) quitting the survey altogether or b) simply switching off and clicking random checkboxes until it’s complete.

Ask one thing at a time

Make sure you’re avoiding this pitfall by scanning your form for the words ‘and/’or’. Spotted one? Splice that question in two.

Oh, and try to be as obsessively-precise as possible.

For example, instead of asking ‘do you eat junk food regularly’, ask ‘how many times a week do you eat junk food?’.

Specific answers mean crystal clear data.

How can we make our users’ lives easier?

Use predefined answers

Training for a marathon, studying for an exam, working towards a promotion. There are some areas in life where taking the hard route will reap the best results.

Form filling? Not one of them.

Easy-to-complete questions will motivate users to zip through the form; overly-complex ones will have them checking Facebook, yawning and feeding their cat.

So, how can we make answering questions as effortless as possible? By giving users a (metaphorical) head start. One way is by making questions single choice (radio) or multiple choice (checkbox):

Q: What services do you use from us?

a. Personal training

b. Spa and Pool

c. Fitness

Minimal thinking. No typing. It doesn’t get much more straightforward than that. And everyone’s a winner because predefined answers are much easier to evaluate.

If there’s a potential answer you can’t foresee, pop in an ‘Other’ option with a textbox that lets your audience enter a custom response. Boom.

It also helps to visualize answers. We played on this when building JotForm Cards with one of its most unique features: the emoji slider!

Instead of wading through the never-ending nuances of “Strongly Agree — Strongly Disagree” statements, users can select the emoji that best represents their feelings.

Another take on this is the evaluation slider. By dragging the blue dot or clicking on the grey one, respondents can get quick feedback and see their answers change instantly.

Arguably the most simple question type is the yes/no.

We noticed that users tended to create Yes-No questions using radio buttons. So our final mission was to make their lives easier by adding a Yes-No Toggle to the input table types.

Placeholders / Clarify Default Values.

Our lives are stressful. Our days are long. Our social lives are busy. So, on the scale of things people are happy to devote a high amount of concentration too, form-filling scores relatively low.

Let’s be realistic: a lot of the time, users will be answering questions in a hurry, only partially paying attention. So, think of your form as a treasure hunt. For a six-year-old. On their birthday.

You want them to get to the finish line, and their prize, quickly and without much effort. That means guiding them forward with clues, cues, and direction.

No one wants to be playing guessing games or feeling confused.

A great way to lead users along is by using placeholder text. This specifies a short hint that describes the expected value of an input field (e.g., a sample value or a brief description of the expected format).

That means they can glance at the page and understand the question/answer without having to read it in full.

Another way to gear users up for an easy, enjoyable form-filling ride is by grouping questions. We all make subconscious associations that we’ve developed over the years. Capitalize on this.

Grouping related questions have two primary goals:

Reducing cognitive load

The lower the cognitive load, the higher the success rate of your form. Cognitive load plummets when a form is logical; when longer content is chunked into bite-sized sections; when users can follow a well-known narrative (personal details — address — payment) without any thought.

At the end of the day, all we need to do is carry our users from the start to the finish of our form without losing them. How? By keeping them motivated.

This means they need to know what is expected of them, and how long the form is going to take. That’s why we have added a progress bar in JotForm Cards: it gives users satisfaction as they progress.

Visually dividing sections makes forms more easily-digestible. And starting with easier questions also helps make form filling smoother. When users can whizz through questions at the beginning, they will feel encouraged to continue. his triggers the endowed progress effect.

Logical Question Order

Asking questions in a logical order relies on one thing: putting yourself in your audience’s shoes. How would you expect the order to flow if you were them? Each question should nudge them on to the next.

Most of this boils down to common sense. For instance, asking for someone’s address before their name would be odd. Or asking for a payment method before selecting the product.

Conditional logic

Here’s another way to use logic to benefit your audience: by making it conditional.

Conditional logic is a powerful simplifier of complex processes. Basically, it lets you adjust a structure or process in line with the situation at hand. In this case, it would mean showing/hiding certain questions depending on the user’s answers.

Splitting your form into multiple routes is called “branching”. So, a form that seems super-simple may have multiple branches on its backend. You can visualize this by sketching a decision tree, with each route represented by a different branch.

Imagine you’re creating an online Feedback Form for your latest event. The event had 3 different ticket types: VIP, Business, and Economic. And you need that information because you want to improve and find a solution to make dissatisfied customers happy next time.

2018 Event Feedback Form

1. What was your ticket type?

– VIP

– Regular

– Economy

2. Please rate your overall experience

– Star Rating over 5

3. Please give your email address:

In this scenario, you don’t have to get in contact with the ones who enjoyed the event — just those who were dissatisfied. You could identify them with a star rating. ‘On the basis of the star rating, you can specify:

Develop a quiz where a different “Thank You Message” is shown according to user answers

Password protect a form. The form isn’t revealed until the user enters the password

Not show the submit button until the user makes a particular choice

Sharing the Form

Test your Form before share

Your form is finished. But it’s not time to release it just yet.

We all have blind-spots. And when a form’s success hangs on the quality of the data, it’s good to be cautious. So, make sure you’ve provided robust answer choices and haven’t missed anything by pre-testing your survey.

Send it to family/friends and ask them to keep track of how long it takes for them to respond to the survey, and how they experience the flow of questions. This will help you evaluate the design of the form for next time around, too.

How to befriend your audience

Contacting Your Responders

Let’s assume that you are working on a company that has three departments: Human Resources, Marketing, and Sales.

The responses to your form on your company website must be provided by the relevant department. Using conditional logic, you can automatically send emails to different departments according to responders’ answers.

People like to feel heard. So, communicating the responder via the right person will increase consumer satisfaction and also benefit your company’s reputation. Plus, next time you send them a form, they will be more inclined to fill it out.

Final thoughts

Information architecture might not get people quite as excited as real architecture. But I think the nuances and logistics can be just as interesting. Building a form that keeps users engaged and garners clear, useful data is a skill to be honed and celebrated.

At JotForm, we’re always trying to make the process more fun, simple and down to earth. It’s a work in progress but we have a great time trying. I’d love to hear your comments below.

I've passion for designing User Experience and User Interfaces; understanding and designing new user experiences. And push my self to manage multiple projects and creation of better concepts everyday. You can reach me through this contact form.

This is one universal truth that most of us don’t follow or couldn’t follow that is “Follow your hearts”.
In our professional life, we all have to strictly follow this because after all it is our career and to do well in it is necessary for us to live happily.
Apart from that, it gives us immense pleasure in our mind which I can’t describe. Coming to the topic, you have described a very useful thing for us beginners and you have talked it so briefly that I am amazed and happy for you.