Imagine how many websites users log into everyday. Now think about how many times in their life a user will have used a login form to type in their username and password. Even though logging in may seem like a matter of seconds, if you add the total time the user spends logging in for an entire lifetime it amounts to much more than just a few seconds.
Logging into a website is a common habit for most people. Because users use login forms so often, designers should start to think more about the time and effort it takes for a user to log into a website.
The typical path a user takes when logging in is to
- visit the website home page
- click login
- wait for the new page to load
- visually process the new page
- type in their username and password
The more steps to logging in the more time it takes for the user to complete the task. What if there was a way we could cut a couple of steps, so that users could log in faster? One way to do this is to use a dropdown login box. This is a small box that drops below the login, so that users don’t have to wait for a new page to load. They can log in on the same page they’re on without having to wait for the system to respond and without having to visually process a completely different page. This user interface solution eliminates two unnecessary steps in the user’s login task, resulting in a faster login for the user.
However, like with most great things there is always a drawback. If your user doesn’t visit the home page first, but instead visits the login page first because they bookmarked it, then the efficiency of a dropdown login box could be debatable. It depends on how your users bookmark websites. If they are very organized with their bookmarks then I can see how a login page would be faster for them.
The other thing you have to think about is how you want your users to interact with your website. Do you want your users to visit your home page first before they log in? Or, do you prefer to give users the option to bookmark the login page? If you choose the former, using a dropdown login box would give your users a better login experience. If you choose the latter, using a login page would only give users who have the login page bookmarked a better experience.
Maybe you’re a designer who hates both the dropdown login box and the login page for whatever reason, but you still want your users to log in easy and fast. Another approach is to embed the login fields on your home page. By doing this, users will only have to click on a field to start typing. This approach works well when you have enough space on your home page to put the login fields and button. Not all websites have enough space for it. Thus, a dropdown login box will not only save users login time, but allow those websites to conserve home page space as well.
Whatever type of login you choose, remember that logging in is a task users do everyday. Making the task fast, easy and painless is a good experience you can give your users, even if the difference is only a few seconds. For some people, a few seconds may seem like a lifetime. These days, most people don’t want to wait. To end, I’d like to give you a few examples of some dropdown login boxes and a tutorial on how you can make dropdown login boxes happen for your website: Perfect Login Dropdown Box Like Twitter with jQuery