Although these forms are seen as less important details, they should be taken seriously. There are many businesses which don’t pay attention to this form and just throw something on their website that is supposed to be filled out, irrespective of its design. But without an increased number of subscribers a business couldn’t become a thriving business.
The truth is that sign-up forms come in so many styles that is very difficult to know which is the right choice. And yes: usually, they include a few form fields such as “email”, “password” and “repeat password”. So, is there something important to design here? There are just 3 form fields! Will they scare people?
Well, in some cases this really happens and data extracted from Google Analytics shows this is true. And of course, they’re not scared by forms, but by being spammed. Or, they’re reluctant to wasting time if the form is boring, too complicated and too long. A sign-up form should be catchy, memorable, remind the user that he is important and the reason why he uses the website.
How to create top notch and effective sign-up forms
Sign-up forms should look great, but they also need to be functional. Although there is no particular recipe for designing effective web forms, there are some general ideas that could be very helpful.
First of all, it should not take long for users to find the form. So, ensure that it’s visible. Offering the answer to the above mentioned questions creates trust and realistic expectations.
Some of these forms are placed in a corner of the website or on the welcome screen. In these cases, a sign-up form is just an instantly forgotten detail. One of the best things would be to place it on the top of every page on the website.
If there are some special offers, include a brief statement that informs users about them. Adding only those necessary fields and asking only what is really important usually makes people fill in a sign-up form easier and faster.
Designing clean, beautiful and effective sign-up forms involves a lot of creativity from designers. Building these forms in a very unique way attracts visitors and increases chances to fill out. Therefore, a memorable design should be considered.
Nonetheless, “memorable” doesn’t mean fancy or complicated. Even a clean and airy design can be impressive. The most important thing is to offer a different vibe to a sign-up form. It can feature big buttons, images, smaller or bigger fields, instructions and anything else that could be useful. The form layout is of major importance as well, so the button size should be aligned perfectly with the form fields.
Check out some examples of websites with creative and effective sign-up forms!
Website link: TestFlight
The form on the Barack Obama website is another great example of simple and very short form.
Website link: Barack Obama
Website link: Yahoo
Winning the trust of your visitors is essential. Usually, they don’t give their email IDs because they could be spammed. Under such circumstances, the best thing would be to add a statement that says “This website never shares your personal information with a third party”. Thus, people are reassured that their email IDs stay confidential and safe. Catalog Choice emphasizes that the privacy of personal information is protected. Other benefits are also mentioned on the left side of the form.
Website link: Catalog Choice
Another way to create trust is by telling visitors about the frequency of the emails and by giving a sample of the type of content they will receive. People usually are reluctant to the unknown and they also don’t want to waste time reading less useful information, so offering just a small glimpse of what they will receive can prevent this problem. AVANTI does that. Their sign up form is entitled “Sign up for promotions”, so they inform you that by signing up, you will receive promotions, specials and news about their events at AVANTI.
Website link: AVANTI
Calls to action incorporated on the sign-up forms add engagement and interaction. “Sign up” or “subscribe”? At the first glance, this is just a detail without any importance. But it might not be like that. “Subscribe” might sound too salesy. The word “subscribe” can send a subliminal message that makes people think they have to pay for something. Thus, “sign up” would be a wiser choice. “Start here” is also less used and it can also be great to use as well as “Start here!”.
Or, the call to action may describe what users can get by submitting the form. For example, providing an incentive is a great tip to make visitors sign up. It can be a free download, ebook or a free trial. InstantLoop uses beautiful colors and its logo design is very pretty. The call to action button is surrounded by some white space that enhances it. By “Join now”, users understand very well right from the start what to expect.
Website link: InstantLoop
LiveResto features a call to action button that tells you exactly what you’ll get.
Website link: LiveResto
Letting people know about password length or format before submitting saves time. Generally, this kind of information emerges after users type in their password and it is too short or doesn’t include a number. Github seems to know that seeing error messages repeatedly is annoying. That is why they added some specifications for the password on their sign up form.
Website link: Github
The more sensitive info should not be required at first as people will become suspicious and will leave the website. Facebook sign-up form is a great example. The date of birth is the last info that is required and under it, there’s a short explanation: “Why do I need to provide my date of birth?”.
Website link: Facebook
Red buttons on sign-up forms have been used for a long time and at present, they are quite controversial. Nonetheless, testing is the best way to tell which color is right to choose for the sign-up button. That’s what GSM did!
Targeted forms increase the chances to be filled in. Thus, adapting to the specific needs of people improves the relationship with them on long-term. Jabong is a great example of sign up targeted forms. When filling out their form, visitors have to choose their gender.
Website link: Jabong
Simplify the form to prevent abandonment. The services or products provided by a business may be great, but if people don’t feel motivated to fill in the form, they will just leave the website page. Progressive profiling is another excellent solution to reduce the number of form fields. It means that a user won’t have to fill in 10 mandatory fields at once, but only 3 or 4 and then use other forms to get the additional pieces of information needed. Hubspot explains the process in details and tells you how to create this type of forms.
Great copy is also important. If emotional, smart and enticing copy is used for a sign-up form, chances are that more people will fill it out. Smart copy can also indicate that it takes just 2 minutes to fill it in. Tumblr features on its sign up form two simple, but enticing sentences: “Follow the blogs you’ve been hearing about. Share the things you love”. Microcopy is also beneficial. Microcopy means brief pieces of info that answer vital questions when filling out such a form. It answers questions such as “is this a free ebook?” or “will I get a weekly email if I sign up?” and makes a user feel more comfortable.
Website link: Tumblr
Adding social media buttons is an extra piece of proof that the service is ok and safe. Podio adds several social media buttons such as Facebook, Live, GoToMeeting and Google. On the right side they also mention the main advantage and entice you to invite other co-workers. The headline “Good Decision” manages to build a positive impression related to the entire signing in process.
Website link: Podio
Mentioning the number of subscribers builds trust and professionalism. Basecamp mentions that it has helped over 285,000 companies finish more than 2,000,000 projects.
Website link: Basecamp
Showing the benefits of the form and using touchy, emotional language leads to a more personal connection and reliability. Mint.com is a great example. On the right side of the form they have mentioned some bullet points enhancing the reasons why they’ll love Mint.com.
Website link: Mint.com
Using Captcha may make user experience more difficult and also decreases conversions. Nonetheless, if you still believe that it would be extremely useful, test and see what happens. Then, you will know for sure which option is appropriate. To ensure protection against spam, Virb asks people to select the word “beldon”.
Website link: Virb
The header of a form is also important. It should feature a larger font size than other text labels incorporated in the form. Some bullet points are also helpful as they can support and explain the main message better. Shutterfly sign up form has an enticing header. It’s visible and clearly shows what you will get.
Website link: Shutterfly
A sign-up form over a dynamic background with many images adds interactivity and grabs attention right from the start. Vimeo is a good example. The form appears right when you enter the site, but the form is designed in such a way that is still visible.
Website link: Vimeo
If many details are required, creating a longer sign-up form is not the right solution. The user will get tired very soon and abandon it. In this case, the most suitable solution would be to provide a clue by showing the following steps. Another tip is to make the form look smaller even if they have to fill out the same information and the same number of fields.
The above mentioned websites are a great source of inspiration. And of course there are many other great examples of websites with effective and creative sign-up forms. It’s difficult to know which tips to choose and apply because you never know that to expect. And if creating sign-up forms can sometimes take too long, there are web form builders that require no coding. Thus, web designers save time and simplify their work. All in all, testing is crucial. As there is no precise recipe, testing will prevent many problems from happening and it will show you what should be improved. So test and test again and ask yourself: would you fill out that sign-up form?
Visit us at InstantShift.com