Friday, May 25, 2007


Yesterday I answered a question on LinkedIn about using username vs email for logins. Both have their pluses and minuses. Usernames are more secure but can be very frustrating for the users.
Most developers fail to understand what the user will have to go through when registering. One of the worst experiences I had with a sign-up page would be where all the information was asked on one page and validation was done server-side. Why is this bad? Well, I was asked for username, password, security question and asked to validate with CAPTCHA. Most of the time, the username a user wants is not available and that was the case with me. After entering all that information, I was sent back to the sign-up page, except now I had to not only re-enter the username, but also the password, security question and answer and the CAPTCHA. Now, consider having to do that five times or more and think how frustrated the user will become.
Incidentally, I also have an interesting experience regarding the security question. I was setting up an account for my wife and the security question was city of birth. The city where she was born is four characters long, however, I was informed that that's too short and a city name has to be at least five characters long. So, if you were born in a city with four characters or less, tough luck, go use some other site.
To make the user experience as painless as possible, any field that has a high probability of failing validation, like username and password, must be validated before the user hits submit. Though it's best to leave the server-side validation in place in case the user has JavaScript disabled, client-side validation must be present. Username should be validated using AJAX. Password, security question and any other volatile fields that require validation but don't require a call to the server, should be validated as they are entered. All other fields and "required field" validation can be done when user hits submit with an onsubmit function. Warning message can be outputted with an alert or by writing to an error div. I, personally, prefer an error div since it looks nicer than the alert popup.

No comments:

Post a Comment