3 ms·
Tell HN: Use Pop-Up Log-In Forms and People Can't Use LastPass to Log in
I don't know which direction log-in UX is heading, but I need to make it clear to everyone designing a log-in page that if you are designing a log-in page, do not create one that pops up. Visitors who use LastPass might hate you for it.
For people who don't know, LastPass is, at its core, a service to store all your passwords that can be generated at random by LastPass, when people sign up. This creates a large, protected vault of log-in information. When a LastPass user encounters a log-in page, LastPass can automatically fill in the forms. The alternative would be to memorize your passwords, which, for the paranoid lot of us, are probably base-64, 32-character-long ones.
Let me give you an example of what happens when you use different forms. Etsy does both things which serves as a great example.
If I use their pop-up log-in button on the front page, this is what happens: http://i.imgur.com/x0rZZ.png. Note how none of the forms are filled out by LastPass.
If I use the "regular" HTML form on https://www.etsy.com/signin, this happens: http://i.imgur.com/9rtCp.png.
If the latter log-in is not available, I will have to click my LastPass icon, go to my vault, search for my Etsy credentials, copy them to my clipboard, and paste them into the pop-up form in order to log in.
But the worst is when the sign-up forms are pop-ups; now my credentials aren't saved, and you had better have a safe system for forgotten passwords, because you are bound to receive them. This is because the credentials aren't saved to LastPass, when they are in pop-up JavaScript. A royal pain in the ass.
I can only speak from personal experience, but for the love of everything UX, please, please, please use regular forms without any fancy JavaScript dingus, even though you just discovered jQuery for the first time.
With the increasing privacy concerns, LastPass users are going to grow in numbers - not dwindle - so you are going to annoy and possibly deter a lot of users inadvertently, if you don't get your log-in prompts right.
- kmfrk 16y agoClickable: http://etsy.com http://etsy.com http://i.imgur.com/x0rZZ.png http://i.imgur.com/x0rZZ.png https://www.etsy.com/signin https://www.etsy.com/signin http://i.imgur.com/9rtCp.png http://i.imgur.com/9rtCp.png
- jcnnghm 16y agoI really don't like it when I can't automatically login with LastPass. Please name your input fields sensibly, and don't interfere too much with them.
- premchai21 16y agoWhat would you recommend more specifically? In particular, whatever LastPass is doing seems likely to be fragile unless there's consensus about how to identify a form as one that accepts tokens (usually a username/password combination) to authenticate an existing user, or similarly set parameters for a new user, or change authentication tokens, or… In the Unix world, there are various extant mechanisms for this around: PAM, LDAP, &c. However, I haven't detected any published rough consensus for the Web; searching for terms like “design login form common field names username password” doesn't turn up anything obvious. The only strong heuristic that I can think of is detecting form fields of password type, and then distinguishing the use cases temporally based on whether you already have tokens cached.
- pixeloution 16y agoIt seems like this is something you should say to last pass, rather then site owners. Expect every site in the world to conform to a piece of software ... or expect a piece of software to adapt to its expected use. Which one makes more sense to you? It would be nice if it worked, but I'm not blaming Etsy Etc.
- ajennings 16y agoYour two image URLs should be swapped in your post. The first one points to the non-popup login screenshot and the second one points to the popup login screenshot. Couldn't LastPass just fix this bug by giving you an option somewhere to re-parse the page and do its auto-fill? That would seem to be much more attainable than convincing every website to use a non-popup login system.
- tomjen3 16y agoHonestly? File a bug at lastpass, since this is their problem. I doubt more than a few percent of users use it which properly means that the amount of users turned away from the wasted screenspace is much higher than the number of people who use lastpass and site owners aren't interested.
- ukdm 16y agoI have experienced this and you don't need to load your vault. I just right click on the field, go to the lastpass entry on the menu and do copy username, paste then the same for password. It takes a few seconds longer, but still works. Also, saving the details of a site is done automatically. All you lose here is a bit of ease of use. A visit to your vault and a few clicks makes the site a new permanent entry.
- 1tw 16y ago1Password handles this type of login form without flinching, which suggests LastPass could too. As others have said, filing a bug with LastPass would seem a better option than trying to persuade the entire web to ditch a popular sign-in method.
- tzs 16y agoMost of these types, anyway. 1Password doesn't work with CNET's pop-up login form.
- dazzawazza 16y agoI suspect this is something to do with LastPass. 1Password has not problems with popups as long as the form is on the page (but hidden) it's fine. It works on twitter, not sure about etsy, I don't go there.
- stevelosh 16y ago1Password works perfectly on Etsy too.
- ashearer 16y agoThis is a peeve of mine too, but as long as attention is paid to this problem, jQuery-laden popup login forms can be built that work automatically with password managers. There a trick to it, though, which is to put the form in a nominally 'visible' state at page load time, even if it happens to be visually obscured by other elements. Autofill will happen at page load, but will only become apparent when you make the popup div visible by bringing it to the front. Caveat: I need to re-test this with the latest version of LastPass. However, when I built a site using this method a few years ago, it did work across various password managers and different browsers, which didn't happen using the more common method of toggling the display property. The scope of this problem is more than just LastPass. Etsy's popup fails equally well with Safari's password manager. IIRC, Safari was the pickiest of the browsers about how the login box was hidden, but password autofill did work with it in the end.