Your goal and your audience.
View this email in your browser

User Friendly Forms

Lesson 1: Audience



Welcome to User Friendly Forms!

You won't find any JavaScript tricks or HTML code here. However, you'll learn what makes a helpful (and engaging) web form, and how to make the user experience as enjoyable as possible. We'll give you tips to improve usability and increase conversion.

First, let's talk about the most important elements of any web form: your goal and your audience.


Your Goal

What's your goal? What do you want to achieve with your form?

When someone takes a desired action, it's called a conversion, whether they sign up for your newsletter, donate to your nonprofit, or place an order at your store. At the very least, you want people to click the submit button on your web form. Your conversion rate depends on the number of people who fill out your form vs. the number of people who don't fill out your form, or leave it incomplete.

With your goal in mind, check each part of your web form and make sure that they're working together towards that goal. If you spot something that could be a distraction or a deterrence, take it out.

For example, most of time, we don't recommend that you include a "Clear All" or "Cancel" button in your form. It's too risky for your conversion rate: your visitors could hit the wrong button by mistake, or the button could encourage them to walk away.


Your Audience

Your respondents are the people in front of your form, so take care of them. Make them feel comfortable. Here's what you can do:
  1. Design the form so it's consistent with your website's branding and style. Is your logo easy to see? Are the colors and fonts similar? First impressions are crucial, because it's easy to lose people's attention and shake their trust. Your respondents might feel confused and wary if everything looks different, and abandon the form altogether.
  2. Think of the form as a conversation. Talk to your respondents; make it clear that you know who they are. Your form shouldn't sound like a faceless memo from a machine. It should reflect you and your voice.
  3. Make the form easy to understand, and easy to fill out. Each part of the form should be clear and straightforward, from the macro level to the micro level, from the overall structure to the words you use.
  4. Enable an SSL connection if you ask for personal information. Without it, your respondents won't feel confident that their data will be protected.
  5. Explain how you collect and use information, through a privacy policy or on the form. Don't keep your respondents in the dark. Transparency about your data collection practices will increase people's trust in you.
  6. Include contact information so that people can get help if they get stuck or if they have any questions. Otherwise, they might answer incorrectly, or give up.
  7. Check for accessibility and proper markup. If there's a chance that your respondents will access the form through a mobile device, make sure that your form design is responsive. Is the font size legible? Does your form work in all browsers? Can your form work with a screen reader? Is it easy for people to navigate the form with a keyboard, or do you land on a label when you hit the Tab key?

Further Reading

Eager to dive deeper into form design? Start here!

âžœ  Context is Everything: Get to know who your respondents are, how your form will be filled out, and what motivates your respondents.

âžœ  Web Form Design is a must-read for anyone who creates web forms or is interested in user interface design. It's a comprehensive guide to what makes a great (and bad) web form, and it's full of helpful examples.

âžœ  The Form Usability Treasure Trove: 42 Top Resources covers usability, design inspiration, testing and analytics, plus more.

Up Next

âžœ  Lesson 2: Wording
âžœ  Lesson 3: Layout

In the following emails, we'll go into the nuts and bolts of web form usability. We'll discuss the wording of your fields, buttons, hints, and error messages, then look at the different organizational elements of a web form, such as alignment and grouping.

We wrap up on Thursday, November 20, at 2 PM EST with the live class, where we'll show you how to put all these UX tips into action with FormAssembly.

See you next week!

Copyright © 2014 FormAssembly, All rights reserved.

unsubscribe from this list    update subscription preferences