Imagine this – your perfect, ideal client is browsing your website. They like what they see and are intrigued by your services. You have a few calls to action strategically placed on your site and this prospect decides to take the next step. They make a conscious decision to reach out to you via your contact form and…
Oh, no. They have an unpleasant, frustrating experience when completing your form. How do you think your prospect feels about you now? Most likely, it’s less favorable than before. If it happens after the form is submitted, you might get away with it. But if your prospect has a poor experience while filling out your form, you might loose that connection. They might get frustrated and leave your site.
If you have a contact form or questionnaire or application on your website—or possibly all 3—the forms need to be easy to use. Here are 6 simple ways to make sure your visitors have a pleasant user experience when filling out your online forms:
1. Useable on every device. A few nights ago, I remembered I hadn’t scheduled my son’s yearly checkup. So, I pulled out my phone and went to his pediatrician’s website to use their online form to book an appointment. The form was virtually unusable because everything was misaligned and the date picker was off the screen. I got really irritated that I had to go get my laptop to make the appointment. Had my son been a new patient, I just might have given up and found another practice.
2. On longer forms, mark which fields are required. Unless your form only has a name + email field, as in the case of an opt-in for a freebie or newsletter sign-up, marking the fields that are required with an asterisk will really make your visitors happy. If you’ve ever filled out a long form, clicked submit, then had a sea of red alert messages screaming that you missed some fields, you know how annoying this can be.
3. Readable field text. In other words, text that is large enough to read easily. It’s no fun when you fill out a form and the font size is so tiny, you can barely read what you write.
4. Fields that fit the amount of information. If you are asking someone for their name or email, a standard text field will do. If you want a couple of sentences of information, then give the user a large input box that will easily house their response. Likewise, if fields aren’t wide enough, people with longer email addresses might have trouble.
5. Easy to find submit buttons. Make sure your submit button is in close proximity to the form. Just underneath the last field is a great place. If it’s way off to the side and your form isn’t responsive and optimized for mobile or tablet devices, your prospective client might not find the button. As we’ve learned, confused viewers might give up. Don’t just rely on the browser standard for a submit button. Those tend to blend in and get lost. Make the mouse cursor change from an arrow to a pointer and make the button change color or transition in an eye-catching way. Also, you don’t have to use “submit” as the text on the button. That can be pretty boring. It should be something that is enticing and understandable like “Sign me up” or “Get it now!”
6. A clear success message when the form is submitted. Let your visitor know that they’ve completed the form successfully. It makes people feel good. The best thing to do is serve up an entirely separate page with a visible ‘Thank you!” or “Success” or both. The second best thing is to include a confirmation message on the same page and have it stand out. The trouble with the latter is that, if the form is really long and the page doesn’t jump up to where the success message is, the user might not see it.
Be sure to give clear instructions on what the person should expect next—a call back, a confirmation in their inbox, or some other form of follow up. Clear communication keeps people feeling good about you and your brand.
Bonus tip—go a step further and include your social media links on your form’s Thank You page. Your prospective client might be so impressed that you provided such a great user experience for them that you could gain a new fan or follower.
Very helpful, Jill. Thanks for these tips. I’m totally new to the whole idea of actually implementing responsive design. I definitely agree with you re a “success” message, once your message has been successfully received.