You may say “of course, the form works” but I find non working forms to be relatively frequent. The first example is on the website of a multinational corporation.

I once returned a router because the form didn’t work.

In both of the cases below, there are “work arounds” that the user can use to submit the form. However, imagine how many people just give up?

I live in a world with a huge contradiction. I know how good software can be and yet I encounter software problems every day. Today I will focus on website forms and I’ll blame how Javascript is implemented.

The case of the inactive button

I just came across a form that doesn’t work if you copy and paste the password into the field. The “Sign in” button stays in its inactive state, grayed out, and it is not possible to click it. The work around is to click “return” on your keyboard after pasting in the password. Apparently, the Javascript that activates the button is waiting for a keyboard event and using the mouse to paste in the password does not trigger this activation. Does this form work? The answer is a clear no for this user.

Let’s move on to exhibit number 2.

“Email Must Match”

Above is another form that was encountered in the wild. The Javascript apparently has calculated that the user had moved away from the email field, and therefore the email validation was triggered, and this huge error message was displayed. The software was wrong in its calculation. The user was still in the middle of entering the email. And that large error message filled most of the screen, completely baffling the user and the perception was that the website was broken.

I could have also named this post “Error messages gone wrong”. Software developers recognize that this is a Regex pattern, but to everyone else this error message just says “Email must match: blah blah blah blah…..”

Don’t display Regex patterns to end users.