Home > Web Usability > How NOT to do a sign-in screen

How NOT to do a sign-in screen

Following a recent optimization campaign, I was met by this terrible signing in interface courtesy of web advertising site Clickey.com. I felt I should point out the problems with it as it is a usability problem that should not be occurring in today’s web environment.

Clickey

  1. Firstly the terminology is way off. A task which involves registering for an account or adding your domain should not be referred to as ‘Request a password‘. The password is merely a formality when registering at a website, it should not be promoted as the prominent reason and result of the task. Then, check out the submit button - ‘Send Password‘ - I though we were requesting a password, why am I suddenly sending one?
  2. From what I can tell, the box on the left is the traditional ‘login’ box, and the box on the right is the equivalent of a ’sign up’ box. They shouldn’t be of equal size as it’s not obvious which one to use, irrespective of the poor naming of the boxes. The login box should be the most obvious and take up most of the space. Preferences should be made to the existing users. A small, but clear option should be made for new users to sign up for an account underneath the main box so all users can think as they see the page: “I can’t login yet so I’ll carry on looking down the page to find where I can sign up.”
  3. There are too many instructions too. Why should a box with three lines of instructions be required just to create or login to an account? It’s so unnecessary it’s untrue. Also, underneath each text box where you’d type in your details there’s more text telling you what to input. A usable form would make this obvious without additional instructions. They also put the text in red - which often appears on submitted forms where invalid details have been entered.
  4. Lastly, I don’t think the positioning of the boxes works. If this is the way you have to do it then the login box should be on the right with the yellow box header which makes it stand out more. Traditionally users tend to see the furthest right of the two objects of as the most important.

Yahoo Sign Up

The Yahoo! sign in box shown below is pretty much the perfect example of a sign-in box and it checks all the boxes of the requirements I just went through in terms of usability. The content is ordered and positioned correctly, there aren’t too many instructions, there an obvious but secluded area to sign up, there support for forgotten passwords or additional help, there’s an option to stay signed in, and it’s all contained in one simple, user-friendly box.

  1. Simon
    May 8th, 2008 at 16:32 | #1

    Nice article. Keep up the good work!

  1. No trackbacks yet.