From the course: Building Great Forms with HTML and CSS

The registration process

From the course: Building Great Forms with HTML and CSS

Start my 1-month free trial Buy for my team

The registration process

“

- [Instructor] Ever since businesses went online and started taking the web seriously, registration forms have been vital. While they could be considered the first barrier to an online sale, they're essential for any business that wants to maintain a relationship with a customer. Think about it. Every time you buy something, you have to register first. Any online service you utilize, what do you do? You register first. You want to rent a house for your upcoming vacation? Register first. Almost any business that sells products or services requires that you register. While on the surface, login forms seem really simple. There is actually quite a bit going on behind the scenes. Let's start off with identifying some principles that will be applicable to login forms, but really, any type of form that you're going to be building. These are things that you can do to get it right. Add value for registration. Why should your users register? As a service or product provider, you must be able to convince your users why they should spend a few minutes of their time doing so. To do this, show the user the benefits of becoming a registered user. It's proven that doing so will make your users more willing to give their personal details in exchange for what you have to offer. Eliminate unnecessary fields. When registering a new user, ask the minimum you need to get started. You can always ask further information down the line. If your goal is quality and not quantity, you're better off focusing on what your qualitative leads need. One of the things that any registration form can do better is to remove the double entry password and email fields. There are other solutions for capturing typos and wrong inputs that are widely available, and definitely will take the burden off of your end user. Know where you put your labels. Labels above the input fields take less time to fill than left aligned form inputs, because there are fewer visual fixations. Studies also argue that inline top aligned labels are the best way to present labels because they offer minimal visual fixations and make the form lean and compact. In my opinion, the best technique for desktop and mobile is to put labels above each input. This means fewer visual fixations. No visual ambiguity and a cleaner and clearer experience for the end user. Provide guidance. A successful registration form will guide the user through it. You should explain how you want users to input your data, and why you need it. Do you need their birthday? Then tell them why this is. That's going to help to build trust and the user will ultimately thank you for it. Required inputs are bad, use optional ones instead. Required inputs could affect your signup quality conversions. A research study shows that people are willing to provide more information than is needed. That means if you say fields are required, then users will only fill in those fields. Instead of indicating required fields, mark the optional fields and users won't feel the need to take shortcuts to fill out the form. Use the right input field and type attribute. Take advantage of HTML5 and give the proper type attribute to inputs. For example, use the input type of email when you're asking for a user's email. On mobile, the keyboard defaults to a friendly email input, when the user is about to fill in this type of field. It's a little bit beyond the scope of this course, but these are also things that you should consider. Use social media for login. Did you know that the average person has between seven and 25 accounts that they log into every day? And around 82% of people have forgotten passwords used on a website. Not surprisingly, this has led to the expression password fatigue. On the other hand, imagine a user arriving on your website and being able to log in with one click. Following which you can harvest a ton of data from that user. With social media login you can decrease fake email registrations, and personalized online experiences, by using the retrieved data. Also avoid using Captcha. Captcha is probably one of the most major causes of form drop off. As such, it does more harm than good. There are alternatives out there which don't have any negative impact on your form. Use an alternative, like the Google solution of reCaptcha or use the honeypot technique, which consists of having an input field that the users leave blank. A robot will fill it in. And that's how you can prevent spam. So now you can see how from the surface, a login or registration form seems fairly simple, but in actuality, it has quite a bit of depth and complexity. There are a lot of things you can do to simplify the process and help to meet your end users needs.

Contents