From the course: Building Great Forms with HTML and CSS

Login and registration form summary

From the course: Building Great Forms with HTML and CSS

Start my 1-month free trial

Login and registration form summary

- [Instructor] Now we've built out a completed path for users to register for our Sea Garden website. We have already created our landing page, which has a call to action and encourages the user to become a member. If they click the Be the change button, they'll come to our login landing page, which is either welcoming users back, if they've already become a member, or encouraging them to sign up. I'm going to click Log in, and here's our login page. We obviously have our required email address field, and we have our password field. And the password can be revealed with the i icon. The user would click Login, and they would get into the back part of the website. We also have a message if they forgot their password. We would take them to a page and tell them what they need to do. If they don't have an account, we will take them to our join page, and the join page contains the fields that we have, we've added some additional functionality, like helper tip text, so the user knows what they need to do. We also added a password strength meter, so that the user is choosing a password that will meet the criteria that we have specified. We can turn the password on and off by using our i icon, and the user is ready to register for our service. So as you can see, there is a lot more to a login form than simply a few fields. From building out this form, I hope you've picked up a bunch of new ideas and techniques that you can implement in your forms.

Contents