Web Form Checklists

Web Forms | April 15, 2018 | 4 min read

In previous sections, we’ve offered you examples and explanations of best practices for your business’s web forms—its email signup form, its account creation form, its contact form, and its online scheduling forms.

But now that we’ve showered you with the details, it may help to step back for a minute with a simple checklist, and try your hand at your own. So below, we’ve got four checklists for you: one for each of the four web forms we considered.

As you design your own forms, keep in mind what’s fundamentally happening when a user is confronted with a web form of any kind. Until that moment, much of the visitor’s experience with the business has been passive. Sure, maybe they’ve been clicking through the site with a particular intent; but they’ve been taking the content in, rather than offering any content (read: data) of their own.

So, as inconsequential as it may seem, the moment your user decides to use a web form is also the moment they have to move out of a state of inertia, and into a state of action.

And if you’ve been human for any amount of time, you know how difficult this transition can be.

What this means for you is that everything you can possibly do to make that form compelling… you should do. That includes these best practices:

Email Signup Forms

☐ My signup form is prominently placed on my homepage

☐ If I decided on a popup signup form, I also have a separate signup baked into my homepage

☐ The language beside my signup form is short, powerful, to-the-point, and benefit-driven

☐ I have no more than one (or, at maximum, two) form fields in my signup form

☐ If I display an image that represents my offer, it’s relevant, compelling, and doesn’t distract users from the task at hand

☐ Users who subscribe via my signup form receive an immediate benefit (in the form of a lead magnet or a discount on their next purchase, for example)

☐ My signup form is mobile-friendly

Account Creation Forms

☐ My account creation form is positioned one click away from my homepage, on a dedicated page that describes the benefits of having an account with my company

☐ The fields in my form have been consolidated as much as possible; and I’ve eliminated any “optional” forms (rather than indicating required fields with an asterisk)

☐ If my form requires users input a lot of information, I’ve distributed my fields across multiple, well-organized forms

☐ If my account creation form is a multi-step form, I display a progress bar so users know how far along in the process they are

☐ I’ve enabled social sign-in on my account creation form

☐ The form includes links to my privacy policy and terms of use (and both of these open in new tabs or pop-ups, rather than sending users off the form)

☐ I display information buttons to offer explanations and tips about what goes into the fields

☐ My password field has a “password strength” visual

☐ I offer drop-down lists and auto-complete features, so that users have to type as little as possible

☐ I offer a current field highlight feature, so users know exactly what field they’re on

☐ I offer on-screen validation, so users know that they’re filling out the form correctly

☐ My account creation form is mobile-friendly

Contact Us Forms

☐ Users can access my contact form from any page on my website… but I also have a dedicated contact page that it sits on

☐ My contact form reflects my company’s personality in tone and manner of speech, sounding much the way my employees speak to each other and to our clients

☐ There’s a photograph of my team near my contact form

☐ The copy on my contact form reads like a genuine invitation to get in touch

☐ My contact form offers reasons why a prospect would contact my business, along with the benefits of getting in touch (“to arrange a visit,” “to set up a free consultation,” “to learn how we can grow your business”)

☐ I offer various methods of contact alongside my contact form, in case users would rather call or engage in a live chat

☐ I also link to social media, so that users have yet another way to engage with my business (and maybe to get their questions answered by loyal customers)

☐ I’ve included only as many fields as are necessary to determine how I can best serve my contacts

☐ I’m clear about how long it will take my company to respond to inquiries

☐ My contact form is mobile-friendly

☐ My contact form redirects to a thank-you page after users submit their queries

Online Scheduling Forms

☐ My scheduling pages are accessible from both my homepage and my services page (and—ideally—from every page on my website)

☐ The copy on my scheduling pages is benefit-driven and speaks to clients’ pain points

☐ My booking journey is short, intuitive, and requires as few clicks (and fields!) as possible

☐ My scheduling forms are mobile-friendly

☐ I offer a current field highlight feature, so users know exactly what field they’re on

☐ My business’s phone number is perpetually visible on every page of the scheduling journey

☐ I’ve included a free-form text box so that clients can add any additional notes about their service

☐ I offer a range of online payment options—the logos of which are visible on every page of the scheduling journey

☐ If appropriate, I display a “soft upsell” option during the scheduling process

☐ Users are met with virtually no distractions throughout the whole of their scheduling process (aside from that soft upsell)

☐ My scheduling page redirects to a confirmation page after users hit the “Confirm” CTA

☐ My clients receive email confirmations and follow-up reminders as necessary

 

One final note: Remember that a web form is a threshold, an opening into a conversation. Hopefully it’s the beginning of a much longer conversation between you and every contact who fills it out. This means being prepared, on the other end, for every kind of invited communication that comes your way.

Previous Chapter