28

I see in the standard that I can have autocomplete either equal to username or email on an input field.

In my case, username is actually the user's email.

What is the best autocomplete to use on my username input field in this case to maximize compatibility with password managers?

1
  • 2
    As a follow-up, what value should be used on the "register" page? I feel like maybe use "email" for registering and "username" for logging in. Commented Jan 31, 2020 at 19:49

3 Answers 3

40

For a login form it's better to use autocomplete="username" for a username field, even if it is expected to be an email address.

I have no hard evidence for this but I expect this would be more friendly to password managers.

This article suggests the same.

A design document from Chromium aimed at developers suggests the same, and I quote from that:

Email First Sign-in Flow:

Collect the email:

<form id="login" action="/login" method="post">
  <label for="username">Username</label>
  <input
    id="username"
    type="email"
    name="username"
    autocomplete="username"
    required
  >
  <button type="submit">Next</button>
</form>

For a registration form, autocomplete="email" may make more sense.

2
  • 1
    Perhaps use type="email" instead of type="text" here: <input id="emailfield" type="text" value="[email protected]" autocomplete="username">
    – Carl
    Commented May 7 at 21:05
  • Yeah, I agree that if you're expecting/requiring an email address you should have type="email", I was just quoting from the linked design document. The point is that autocomplete should be username rather than email when you're asking for a username, even if you expect the username to be the user's email address. Looking again at the linked document I'm not sure if it was updated or I missed it the first time but there is another example "email-first sign-in flow" which does have type="email" autocomplete="username". I'll update the answer.
    – tremby
    Commented May 7 at 22:21
-3

I ended up researching quite a bit, and found out these conclusions to be true: Angular forms and password managers, if anyone ends up googling here.

4
  • 1
    I don't see how the answer you link to actually answers your question.
    – tremby
    Commented Sep 12, 2019 at 8:19
  • 1
    The end goal was to maximize compatibility with password managers, not so much a question about standards.
    – Qortex
    Commented Sep 12, 2019 at 8:27
  • The link does not even relate to the question
    – rodude123
    Commented Mar 11, 2021 at 22:22
  • See points 3, 4 & 5 in the linked answer, you'll see it is related to the question.
    – Qortex
    Commented Oct 6, 2021 at 17:11
-5

I'm not sure what you're trying to do, but you can also set the autocomplete to just on or off. That will make it so it recommends whatever the user last submitted through the input field with no guidance for the browser.

Additionally, I'm linking you to the page where you can see all the values you can use with autocomplete, hope it helps.

ref.
https://www.w3schools.com/tags/att_input_autocomplete.asp
https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete

3
  • 2
    Yeah thanks. The question is more of usage: as both username and email would apply in my case, what is the best value for autocomplete? I see in the standard that putting the two of them seems not permitted. I wonder how people usually go with that.
    – Qortex
    Commented Nov 12, 2018 at 11:12
  • I think you should put email, since username usually refers to a nickname or an account name chosen by the user.
    – Roko
    Commented Nov 13, 2018 at 7:26
  • 1
    I would have thought "username" was more password-manager-friendly, but I have no evidence for that.
    – tremby
    Commented Sep 12, 2019 at 8:20

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.