Is there any research or best practice guidelines on the most appropriate solution for this UI from an experience perspective?

Are there known advantages and disadvantages of each?

  • This is a useful article to read: nngroup.com/articles/overuse-of-overlays
    – Luchadora
    Sep 6, 2016 at 14:59
  • I don't know why is this flagged as primarily opinion based. In any case, it needs a lot more details, but there are extensive studies and testing on this subject
    – Devin
    Sep 7, 2016 at 17:43
  • bfy.tw/Gpp8
    – Johnny UX
    Feb 27, 2018 at 18:52
  • @JohnnyUX what's the point of the StackExchange sites if we have Google...
    – Adriano P
    Jun 29, 2019 at 2:04
  • @AdrianoP sorry for the late reply. I believe users should make some effort to answer their own question before asking it here. Especially if it's a well researched and documented task. As you point out, Stack Exchange isn't to replace Google, it should be to help find answers that Google can't provide.
    – Johnny UX
    Nov 9, 2020 at 20:40

5 Answers 5


I'm pretty sure we've answered this before, but since I can't find it ...


It's good practice to have a lightweight sign-in that allows the user to stay right where they are (with dynamic refresh of relevant components). Same for registration: you want to lower the barrier to creating an account, so a simple modal panel with the bare minimum data points is the way to go.

You're also going to have certain workflows where users will come in via a restricted access URL (their orders, posts, account prefs, etc). They need to be signed in before you show anything. This is where your dedicated sign-in / register page is needed.


I personally always build the login controls into a modal because almost without exception there will be other views than the homepage that requires the user to login. It's extremely convenient to allow the user to navigate away from the homepage, opt to login, and not feel like they have to start over at the homepage.

Unless of course the page is useless without an account, like in a webapp, where the first view they have is a login.


Modals work well for "interruption" tasks. Consider when the user is in the middle of doing something, then clicks Sign In. They're not taken away into a different space - they stay on their page as the Sign In modal overlays it. Then when sign in is successful they're right back where they were before, mid-task.

I prefer to do the same thing with Registration, though sometimes it's a longer, more involved task. Try to make Registration easy and quick. Keep it as small an interruption as possible. Remember, people are probably not on your site to fill out forms; they're there for some other purpose.


Ipboard is a good example of a similar implementation. You can sign in on the page where you currently are, or you get transferred to a login page if the login/password is incorrect.

You also need to consider that is going to happen if user need to sign up. Whatever method you choose, you need to make sure the user is returned to the page that required his to sign in/up in the first place.

Bearing all this in mind, you should implement both methods. Modal for JavaScript enabled devices and separate page for JS-free devices.


I'm inclined to say you don't need a modal for this type of control and can easily do it inline (for registration) or new page for sign up (if your sign up is more complex) but in most cases a simple sliding panel can accommodate the control without tearing the user away from the homepage into a modal. Also better for screen readers and accessibility generally.

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.