Making a case for inline validation

Written by: sherisaid • Edited by: Ronda Roberts
Updated Jun 30, 2011 • Related Guides: Social Media | Yahoo

As a rule, web forms aren’t the most user friendly of tools. They require a series of questions, and then don't inform you of a misstep until you've finished and hit submit. The most poorly built forms make you start over at the beginning, a frustrating experience for the user.

Inline validation

Most web forms are designed with the most basic of interactivity that only validates on submit, requiring the user to go back and correct any problems. Inline validation takes more time to develop, but it allows people to complete forms faster and without the frustration of having to find the mistake somewhere on the page. As a result, they'll be less frustrated and more satisfied. Since people today often take their frustrations with a website to social media, customer frustration is a dangerous thing that could easily result in loss of sales.

How it works

Inline validation can interact with the user in several ways. It may be used to confirm appropriate answers, suggest alternate valid answers, provide character limits or proper formatting tips, or notify the user of required fields. These snippets of helpful information can be provided at any time during the process: before, during or after the field is filled. Inline validation works by creating a popup when a customer fills in a field. For example, if a customer enters a phone number in an incorrect format, like (555) 555-5555, that does not fit your database format, an inline validation popup can give immediate feedback--such as "Phone numbers must look like this: 555-555-5555"--so the customer knows what to fix on the spot. Some inline validation will not allow the customer to change fields until the information is corrected.

Pogosticking

click to enlarge

The frustration of having to go back and forth between pages is so common it's been given a name, 'pogosticking'. Before there was inline validation, pogosticking could drive anyone crazy when trying to create a new user account on a site like Yahoo. You'd fill out a ton of information, click submit, and get a message telling you that the user name is taken. So you'd go back to the form, pick a new user name, forget to fill in the password (twice) that had conveniently disappeared, click submit, and get another error. This fun game could last for hours. The number of clicks involved could be staggering, and resulted in lot of truly random names created by very frustrated users. Another common pogosticking problem that can be eliminated with online validation is incorrect password entry, which can be doubly frustrating since users can't see the characters as they type.

The guessing game

Possibly the best use of inline validation is to provide suggestions for answers that visitors are unlikely to know. We can all probably fill in our own names with little difficulty, but filling in "Airport code" would stump most of us. Inline validation offers the possibility of popping up a list of codes and cities to choose from.

In terms of customer satisfaction, inline validation is far superior to standard forms. It's a little extra programming to provide on the spot knowledge, but measured in terms of how many potential customers may walk away frustrated, it's definitely worth the effort.

Image Credit: Courtesy of Sxc.hu/pixelbase