Email Address Entry Fields

At my current employer, we’re undergoing a massive re-work of our main site. Mostly backend changes, but I was given the opportunity to refresh the UI as I brought the HTML and CSS more inline with web standards. On the major customer form page, we have an email address field. While interviewing our Customer Care department, I found out that the largest number of calls they receive are for people who never received their confirmations because they mistyped their email addresses.

My immediate thought was to add a secondary email address field. It’s what you see in most cases. Our development group complained and rightly so that it’s never fun entering the same information twice and that at least some number of users just copy and paste the address anyway.

After thinking some more, I came up with what I hope is a more elegant solution. After the user enters his or her email address, a message appears in red repeating the user’s email address:

The solution depends on JavaScript, using the onblur event. For our site’s users, less than 5% have JavaScript disabled. One thing I like, though it’s subtle, is that the message explains why the user should review what they entered; they won’t receive their confirmation if it’s wrong.