Ask the right questions - HTML Tutorial

- [Narrator] Nearly every website has a form and they are used in many different ways. To sign up for something, to make a purchase, to apply for a job, to login to a website, to post on social media, and the list goes on. And there are so many bad forms out there that users are very weary of them. They are expecting that your form will be difficult to understand. That they will get confusing errors when they submit it. And that they may not be able to submit it at all. Because forms are such an important piece of functionality on websites, whether or not your site has good forms can make the difference between whether your website, or even your business, is successful or not. Could Amazon have turned into such a powerhouse if their checkout form was difficult to use? Almost certainly not. The first thing you need to do on a form is ask the right questions. When you start thinking about what will go in your form your top goal should be asking the least number of questions as you can. The longer the form, the less likely people are to fill it out. Even removing one of two questions can make a difference in your conversion rate. The example here is a great form because it only asks what is absolutely needed to sign up for an email list: your email address. I've seen plenty of email list sign ups where they need your full name, address, phone, date of birth, etcetera. And all the fields are required. Why do they need that information? Who knows. But if people don't want to fill out those fields they'll either skip signing up or they'll fill in fake information. The more questions on your form, the more errors and fake data that will be cluttering up your database. There are many places where you can cut out unnecessary questions. For example, when you're buying something it often asks what kind of credit card you'll be using. Mastercard, Visa, or American Express. You may not realize this but you can tell what kind of credit card it is from the first two digits. So on this form, the user starts typing and it picks the correct card. You so you can see now that it's changed to recognize that I typed in the first numbers for a Mastercard. If I type in 37 instead, that's the starting numbers for American Express. An added bonus here, if you look below that at the CVV code, it changes because the CVV code is different for American Express and Mastercard. Here it says the CVV is on the front and it's 4 digits, so it puts 4 dashes in the box. For Mastercard, you can see on CVV it tells you instead it's on the back and there's only 3 dashes. Another thing you can do in forms is make assumptions. For example here, this is a library website. If I go to search, they have more than one type of search. Catalog, Website, or FAQs. The default search is the catalog, because they know most people that are searching here are going to search the catalog. Even though this is the website, they know that if a search leads to a search of the website, people are going to be confused by that because they expect the library site to give them results of what books they can find. Here's another site that makes assumptions. When you go here it recognizes the location that you're at and will automatically fill that in. Of course, if the user wants to find something different, they are welcomed to change the search term. Try to remember the user's data and preferences where possible so you can save them time in filling things out later. For example, many signup forms say keep me signed in and have a check box you can select that option. And that way you don't have to sign in again when you come back to the site later. Here's an example of a form that might cause some problems for users. You don't want to ask them questions that they can't answer. Here is a sign up form for buying a digital subscription to newspaper. You can only an address that's in the United States. Now, one looks at this and wonders is there a reason for that? Is there some reason why their content can't be distributed outside of the United States for copyright reasons? Or did they just not think of the fact that somebody in another country might want to subscribe to a digital product that they'd get online anyways? Here's another example of a question that a user might not be able to answer. This was for buying travel insurance. It asks the purpose of your travel: vacation or business. And I went to buy this recently and was wondering well what if I need to do both? Which one am I supposed to pick if I'm doing both of those things on the same trip? There is no option here that explains it at all so you either have to guess or try calling them and waiting on hold for hours to find and answer to a simple question. If there's some information on a form that the user may not have the answer to it's good to give them options of different types of information they can fill in instead. For example here, you can either enter a zip code or a city and state to find a location. I travel a lot and I find often I go to look for a location of a store or a restaurant and they tell me I must enter a zip code. But who know the zip code of the location they're traveling too? You have to look it up. Being able to enter city and state is certainly a lot easier for someone who doesn't live in that location. Another thing to think about in your questions is the tone, how you're asking the questions. This is from a form on a bank's website to sign up for a new account. They have a long list of questions and each one of them kind of has a breezy, funny question like this one. Instead of just asking for your phone number, it says "Where can we reach you? I know we just met, but we need your phone number." And there are some websites where language like that would totally fit in and be not inappropriate. But on a bank website it just seems very strange, especially since the rest of the website doesn't have this tone, it's more formal. So it makes you wonder, can I trust this bank when they're talking to me in such an informal tone? Are they really going to keep my money safe? Additionally, adding extra text like this makes it longer for the user to fill out the form. There's a lot more for them to read if you're adding extra text that really has no bearing on what they need to enter into that form on the field. Now that you've learned to ask better and fewer questions in a form, we'll move on to learning how to make sure that users understand what you want them to enter in the form.