Authentication - Do you have a user friendly registration and sign in screen?
  v1.0 Posted at 10/12/2014 6:56 AM by Tiago Araujo

For a web site that expects a lot of first-time visitors, it is wise to put the user registration form on the same page as the sign in dialog. This saves having the user click on another link to enter their details.

Bad sign in Dialog
Figure: Bad example - non-friendly sign in screen

The image is a bad example of a dialog box because:

  • You can easily enter the correct data and click the wrong hyperlink (i.e. Join or sign in)
  • By well-established convention, buttons should be used whenever form data is to be submitted back to the server
  • The "Forgot my Password" link is ambiguous - Does it take me to a new page or do I have to enter the email address field first?
  • A button, not a link, should be used for submitting data, as links don't allow the user to hit "enter"
Good sign in Screen 1
Figure: Good example - friendly sign in screen for many new visitors

For a web site that expects few first-time visitors, this is a good sign in screen, as it is clean and concise:

Good sign in Screen 2
Figure: Good example - friendly sign in screen for few new visitors

Note: Generally, the action buttons should be aligned to the right.

Related rules

    Do you feel this rule needs an update?

    If you want to be notified when this rule is updated, please enter your email address:


    Note: Social Media login for Yotpo is not working in IE or Safari, please use Chrome. We are waiting for Yotpo to fix it.