Account Sign-In Patterns

The Wheres and Whens of User Expectations is a good article by UIE that talks about user expectations for account sign-in links and fields:

As we watched users, it seemed they first looked for two text-entry boxes of equal size. Their eyes would scan the page (often with the mouse cursor in tow) searching for the two entry fields.

Sites that had two text-entry boxes, often contained in a larger box with a distinct background and border, would quickly acquire the user’s attention. They’d type their username into the first box and their password into the second.

This pattern is so strong that we see it work even on sites that don’t follow the pattern. Over at Etrade.com, the online trading and banking site, their design has two pairs of dual text-entry boxes. One pair is the standard login field, but a more prominent pair is for stock quotes and the site’s search functions.

Because of the strong drive of the user to react to this pattern, it’s common to see users type their username and password into the stock and search buttons, completely missing the proper sign-in fields. From this, we can see designers need be careful when placing pairs of text fields that users don’t confuse them for the sign-in boxes.

The Sign-In Link Pattern

If users don’t see two boxes, they then start scanning for a link called Sign-in or Log-in. (We haven’t seen anyone who uses a button for this, but it’s also an option. However, we’d wonder if a button would create cognitive dissonance if it appeared without corresponding fields.)

A pattern that worked well in our research was, once logged in, to replace the sign-in link with the user’s name, id, or email address, followed by a sign-out link. Users showed they understood the semantics and reassured them that the system had recognized their account information.

Leave a Reply