Hey there, I'm Jonathan, a freelance digital consultant, specialising in UX/UI Design.

I help companies design and develop beautifully simple user interfaces. I work with a huge variety of clients including companies like, Smith & Nephew, KLM, Durex and the National Aids trust.

Web Application Login Forms - Best Practices

Posted By Jonathan Clift on 03 July 2014

Login form design is often neglected because it's functionality is so specific. With such 'simple' functionality it would appear that time would be better spent designing other more complicated areas of a Web Application. Whilst there might be an argument for this, it's important that every login form adheres to certain best practices.  Every user will land on this page before they start using your web application, so designing these forms in the right way will help set the bar for the rest of your application.

Having designed lots of login forms, I thought I'd put together some of my observations on what I think makes a great  form. Below you'll find a generic example, explaining the best practices that I believe are important. Implementing these in your login form design will ensure you create a usable and well designed form, that will hopefully impress your users before they've even started using your Web Application. Below you'll find a link to my login form example with a number of comments/callouts highlighting the best practices. Take a look and see what you think. login-form-best-practice Am I missing anything? Feel free to send in your thoughts on anything you'd change or add to my login form. Also, more than happy to post the original PSD up here, should anyone want to use any of these styles in their own design, just let me know.