In 2008 I worked on a redesign of the checkout flow for Boots.com.

We had the RNIB (Royal National Institute of Blind People) do an accessibility audit. The consultant found a lot of problems but the main one I remember was with form validation.

She said:

1. It’s not clear that there are errors (even though we were showing a big red list of errors at the top of the page)
2. The error messages are disconnected from the inputs (even though the errors were close to the form)
3. The errors were hard to fix (even though we highlighted the problematic inputs)

If you ever get a chance to work with the RNIB, do it because it’s eye opening. You learn to look and think about design differently.

My experience working with the RNIB reminds me about my third law of form design which states:

Users will make mistakes no matter how well your form is designed.

It’s not that you shouldn’t do everything in your power to reduce errors.

It’s that you need to realise that even if you the clearest questions and the most simple and accessible interactions possible users will still – at least sometimes – make mistakes.

And when that happens, it’s a low point in their journey.

This is why it’s so important to get users back on track as quickly and as easily as possible. Because if you don’t, they’ll get stuck or worse leave.

If you want to give users the best validation UX, you must know the answers to three key questions:

Question #1: When is the right time to validate?

As the user types? As the user tabs to the next field? On submit? Is it a combination? Should you disable the submit button until all fields become valid? Does anything change in multi-step form flows?

Question #2: What is the best way to present errors?

Is it with HTML5 validation? Should error messages go at the top or bottom or both? How about next to the inputs? Should you use different patterns when the form only has one question?

Question #3: How do you write crystal clear error messages?

What makes a good error message? What makes a bad error message? Are error messages a good opportunity to show personality?

I’ve used (and recommended) the same validation pattern since the RNIB schooled me back in 2008 – with some upgrades along the way.

If you’d like to design forms that get users back on track from the lowest point in their journey, you might like my course Form Design Mastery. Module 3 has five lessons dedicated to just that:

​https://formdesignmastery.com​

See you soon,
Adam

p.s. as I mentioned above, if you want users to recover from errors, one thing you need is clear error messages.

Form Design Mastery has a dedicated video walkthrough for this. But if you pick it up today you’ll also get my AI error message generator:

You just type the labels and it generates all the error messages you need. What used to take minutes now takes seconds.