Sign in page form focus post validation

19 Jan 2011 - 2:53pm
5 years ago
2 replies
1909 reads
Darren Ellis

Anyone have strong feelings regarding form focus after failing validation on a sign in page? In the wild, form focus seems to vary quite a bit. Some sites remove focus completely and the user must click back into the forms. Others put focus on the incorrect form. While others blow away any information entered and set focus on the username form. 

Read through the following examples and insert your expectation (mine are at the bottom):

Scenario 1: Bad password entered

  1. User loads sign in page
  2. User enters username correctly
  3. User mistypes password
  4. User submits forms
  5. System refreshes page and _____.


Scenario 2: No data submitted

  1. User loads sign in page
  2. User submits forms
  3. System refreshes page and _____.


Scenario 3: With a captcha

  1. User loads sign in page
  2. User enters user name correctly
  3. User enters password correctly
  4. User mistypes captcha
  5. User submits forms
  6. System refreshes page and _____.


My expectations:

  1. Focus on form that failed. My uncertainty with this are possible security issues by putting emphasis on the incorrect form. Considering that, removing focus makes more sense. Additionally, I also expect the password field to be cleared. 
  2. Same as above, but focus on first failed field. In this case, focus username. 
  3. Clear password and set focus on it. The user then has to retype their password and type the new captcha words in. Username is saved (any potential security issues doing so?).


I appreciate any thoughts on this.


19 Jan 2011 - 3:57pm
Yohan Creemers

Regarding your security concerns: the username name is for identification, the password for authentication. Giving feedback whether the username is known by the system is (should not be) a security risk.

A captcha is used for sign-up forms. There is no reason to use it in login forms as the password is supposed to keep unauthorized people (and robots) out.

Above statements simplify your design problem. My solution would be:

  • Focus on username field if username is unknown, don't clear the field so users can more easily see what went wrong and correct typos.  
  • Focus on password field if username is known by the system.
  • Display an error message close to the focussed field, visually linked to it .

Ylab, designers for interaction

19 Jan 2011 - 5:37pm
Darren Ellis

Thanks, Yohan.


  • Correct, the username shouldn't be an issue. Agree with you on this.
  • If the user isn't "remembered" but is anonymous I'd put the focus on the username box or not at all, however, just being able to start typing is more efficient than manually placing focus. Additionally, if we recognize the user we could add the username, but they did submit empty forms (on purpose or accidentally) so I'm not sure I'd expect either to be pre-populated.
  • My bad. I meant to include the captcha would appear for further authentication after multiple sign in attempts or if a user isn't white-listed by their IP (e.g., signing in from a different computer). That said, there is some error messaging that does instruct to complete the fields above the forms.


Syndicate content Get the feed