El libro de la optimización de formularios Web, de ClickTale

Luis Cortázar
Luis CortázarAnalytics & Conversion Consultant; UX Research à CODICE pasión digital
3
The Giant Book of Form Optimization
your everything guide to online forms
A Web of Forms
You can shed a lot of sweat and tears redesigning each page of your website, however if the last page of your funnel, the form(s), is not
optimized with the same precision and personal touch as the pages before it, your time and money are as good as wasted.
After analyzing the forms of 830 of the web’s top performing websites, ClickTale has developed and summarized 21 of the most helpful tips in
this easy-to-navigate Giant Book of Form Optimization. Learn all the key tips you need to personalize your web form redesigns according to
both the industry and type of form you are optimizing, enabling your visitors to reach their goals, while simultaneously achieving your own.
This eBook is divided by the five usability components of web form analysis, including:
The CTA (call to action)
The Form Field
The Supporting Elements
The Convenience Factor
The Page Design
SUBSCRIBE
GET QUOTE
Remember your password
PRICE: $10
Input Your Email
Put Your Name Here
1
The Call to Action (CTA)
1 Ensure that your CTA is above the fold
The more your customers can see at first sight of your form, the better. This way there is no confusion, no second thoughts, and less reason for
abandonment. If you are not sure where your average fold lays, In-page analytics tools easily clue you in as to how your page appears to your
website users. Scroll Reach Heatmaps enable you to see exactly how your online users see your web form and how far down the page most
visitors are willing to scroll.
Word to the wise: If your form does indeed span past the fold of the page, this does not bode well amongst online users, with a significant
percentage of visitors bouncing away from the page within nine seconds of landing.
2
✔ ✘
2 The sole aim of your copy is to drive people to convert
Good landing page copy should contain enough copy to drive people to convert, but not too much to drive them away. Writing good landing
page copy is more art than science but here are a few rules of thumb:
 Talk about the tangible benefits for completing the form
 Try to reduce points of friction of perceived risks
 Provide incentives such as free shipping, free trials etc.
3 Optimize the call to action
You need to persuade customers reluctant of buying. These calls to action need to offer a smooth transition to checkout that a customer,
debating whether or not to continue on to the checkout stage would not hesitate.
✔ Good examples: “Learn more”, “Get your free [widget]”, “Get quote”
✘ Bad examples: “Submit”, “Download”, “Send”
4 Add trust logos next to your CTA
The web is filled with millions upon millions of websites. Letting your customers know that your site is trusted and recognized by specific online
security organizations is a huge sigh of relief for the majority of online customers, especially if there is credit card information involved. Here are
some trusted logos that will do the trick:
3
The Form Fields
5 Use in-form validation
Let customers know immediately when they have entered an incorrect/invalid answer within a field. Currently, most forms on the web have
customers fill in the entire length of the form and, only once they hit “Submit,” give the “red flags” customers need to either refill the form or,
for those in a hurry and with a low tolerance level, completely leave the site. If customers are notified line by line how the form fill process is
going, they are able to feel more secure with their entries and more likely to successfully submit the form.
6 Use side-by-side field captions
Surprisingly, many online websites are still placing field captions vertically above the field box, causing the length of the form(s) to be twice as
long. If this happens to fit your website description, consider placing the field caption horizontally next to the blank field. Additionally, to avoid
any confusion on the visitors’ part, you can also include the name of the fields within the field box. As the customer clicks/enters the field, , the
text is deleted.
4
7 Less form is more
The less information you require from your customers, the less fields they have to struggle through and the more likely they will submit the
form.
As in the case of B2B websites, one e-business is fully aware of what the other e-business is trying to achieve when asking for every detail
except time of birth. While many clever online marketers and website buffs simply create pseudo names, numbers, addresses, etc., would it not
just be easier if the information asked amongst each other at the introduction stage was no more than a few relevant fields?
8 Tap into additional databases
Although more information about your customers is always helpful, check and see if you can suffice without making all fields mandatory. One
way of doing it is tapping into databases. For example, if you can complete the city from the zip code, you just saved a whole field. Form
Analytic tools instantly reveal which fields are frequently left blank and refilled by customers. Once you determine which fields are problematic,
you can decide which ones you are willing to let slide.
9 Use technology to save users time
Country is one of the most annoying fields to enter. You scroll down a list of 160 or more countries and territories that you never knew existed
until you find your own. Can’t decide which fields are more valuable than others and struggling to shorten your form? If knowing the exact
locations of your customers is crucial data for your business, location fields including country, state and city can all easily be obtained using the
reverse lookup on visitor’s IP addresses.
5
The Page Design
10 Design a smart layout
It is indeed true that customers always have the option to scroll, but the less work you give your customers to do, the better. Keep your form as
short and sweet to the point as possible, not only in the number of fields but also in terms of design. If your form is long, consider either a two-
column design or on the other hand a multi-step form, where you capture the email and name first and then capture other details in a separate
page (see tip 12).
11 Don’t create distractions
Jackpot. You have got your potential customers interested in your content/products. Now they want to see your product in action. There should
be no confusion and no hesitation on the part of the visitor. The call to action screams it, the title on the page confirms it. In the form page, less
content is more.
In the case of websites selling or providing online products and services, abundant product/service information surrounding the fields, as well
as over usage of images, can be distracting and grab customer attention too much to the point of causing them to back out of wanting a demo.
At this point in the conversion process, customers have hopefully read enough compelling content on previous pages to want a demo.
12 Break your one long page of fill-ins into a two-page process
Aggressive long forms are just not attractive, intimidating even. While there is always the option of cutting down the number of fields (the
popular way to go), this is often not enough. Instead of cutting down fields, try splitting the form onto two steps / pages. This gives impatient
customers the illusion that the energy required to fill out these fields is indeed less than what might actually be involved. Most websites who
have gone through this redesign process experience a significant reduction in bounce rates.
6
The Supporting Elements
13 Add customer testimonials
In general, the design of your form pages should be as simple as possible. However, in the margins, some encouraging texts and light images
are always helpful to ensure customers that others have enjoyed and approve of your product/services. It is always nice to get that nod of
approval before clicking on that call to action.
14 Add incentive to complete the form
Just as children respond well to candy, your customers will respond well to any small/large incentives you can offer. For example, you can try a
free download, some free swag that would be worth their while, etc.
15 Include all product information
On wish lists, check out, and booking forms, customers are often tempted to take steps backwards, not confident enough to move ahead with
their purchases. The more details that are included on the wish list, the more confident customers will be when they decide to move ahead with
their final purchases.
16 Include images of purchase items
Add options to expand product images, further enticing your customers to make the purchase they know they want.
7
8
The Convenience Factor
17 Let customers use cookies to remember their passwords
As great as your form may be, there is no reason for a customer to fill in the same form over and over if he/she has no desire to do so. Every
process the customer goes through when doing business with your brand contributes to their overall perception of you. Easy, convenient,
rewarding…these are the qualities that get a form filled.
18 Go easy on customers and their passwords
It is true that the web can be a dangerous place now. However, customers have other items on their to-do lists that go beyond creating the
ideal password. As much as they may want to join your miles club (travel) or your price club (ecommerce), adding any time and frustrating stop
and go points, can send your customers flying in another direction, or make them frustrated on their next visit with a password they cannot
remember.
19 Go local
While US customers indeed make up a good chunk of internet users, requiring number-only zip codes, US states, and specific phone formats
will only increase the chances of customers receiving error notices and abandoning your website. The more flexibility and customization you
allow your customers when filling out your forms, the more flexible they will be with you.
20 Be up front about your correspondence plans
Tell your customers right on the form itself when they can expect to hear back from you if you can. This provides extra motivation to not only fill
out your form, but also include accurate details. If you do not know when you will be getting back to customers, do not include any information
you cannot promise.
9
21 Include an email privacy statement
Ecommerce, travel, and other industry websites where a transaction is involved usually succeed in getting emails from customers. However,
often times download and request a demo forms have a harder time getting an email, and at that, an email that works. Many customers are
wary and skeptical of what may be done with their personal information, especially with their email address, which today can be as personal as a
home address.
When asking for your customers’ email addresses, include a privacy statement, ensuring them that their personal information, specifically their
email will not be used or shared by any third party.
10
About ClickTale
ClickTale is the leader in Customer Experience Analytics, the next advance in web analytics, optimizing usability and maximizing conversion rates
of any website. Its patented Customer Experience Visualization™ technology allows e-businesses to see their customers’ true-to-life™ online
experience at all levels of detail, from aggregated views to playable videos of users’ browsing sessions. Unlike traditional analytics platforms that
assess page-to-page navigation, ClickTale reveals the customer experience inside the page. ClickTale, an enterprise-class SaaS solution, is fast to
deploy and provides immediate ROI. Serving over 80,000 customers worldwide including Fortune 500 companies, ClickTale is the fastest growing
company in its space.
www.clicktale.com
US 1-800-807-2117
UK 0800-048-8871
© 2013
Questions?
Tell us what you need
Like what you read?
Visit our content library
Want to get started?
Demo tailored to your site’s needs
Learn More Request a Demo
@
Next steps
Contact Us
1 sur 12

Contenu connexe

Tendances(20)

Similaire à El libro de la optimización de formularios Web, de ClickTale(20)

El libro de la optimización de formularios Web, de ClickTale

  • 1. 3 The Giant Book of Form Optimization your everything guide to online forms
  • 2. A Web of Forms You can shed a lot of sweat and tears redesigning each page of your website, however if the last page of your funnel, the form(s), is not optimized with the same precision and personal touch as the pages before it, your time and money are as good as wasted. After analyzing the forms of 830 of the web’s top performing websites, ClickTale has developed and summarized 21 of the most helpful tips in this easy-to-navigate Giant Book of Form Optimization. Learn all the key tips you need to personalize your web form redesigns according to both the industry and type of form you are optimizing, enabling your visitors to reach their goals, while simultaneously achieving your own. This eBook is divided by the five usability components of web form analysis, including: The CTA (call to action) The Form Field The Supporting Elements The Convenience Factor The Page Design SUBSCRIBE GET QUOTE Remember your password PRICE: $10 Input Your Email Put Your Name Here 1
  • 3. The Call to Action (CTA) 1 Ensure that your CTA is above the fold The more your customers can see at first sight of your form, the better. This way there is no confusion, no second thoughts, and less reason for abandonment. If you are not sure where your average fold lays, In-page analytics tools easily clue you in as to how your page appears to your website users. Scroll Reach Heatmaps enable you to see exactly how your online users see your web form and how far down the page most visitors are willing to scroll. Word to the wise: If your form does indeed span past the fold of the page, this does not bode well amongst online users, with a significant percentage of visitors bouncing away from the page within nine seconds of landing. 2 ✔ ✘
  • 4. 2 The sole aim of your copy is to drive people to convert Good landing page copy should contain enough copy to drive people to convert, but not too much to drive them away. Writing good landing page copy is more art than science but here are a few rules of thumb:  Talk about the tangible benefits for completing the form  Try to reduce points of friction of perceived risks  Provide incentives such as free shipping, free trials etc. 3 Optimize the call to action You need to persuade customers reluctant of buying. These calls to action need to offer a smooth transition to checkout that a customer, debating whether or not to continue on to the checkout stage would not hesitate. ✔ Good examples: “Learn more”, “Get your free [widget]”, “Get quote” ✘ Bad examples: “Submit”, “Download”, “Send” 4 Add trust logos next to your CTA The web is filled with millions upon millions of websites. Letting your customers know that your site is trusted and recognized by specific online security organizations is a huge sigh of relief for the majority of online customers, especially if there is credit card information involved. Here are some trusted logos that will do the trick: 3
  • 5. The Form Fields 5 Use in-form validation Let customers know immediately when they have entered an incorrect/invalid answer within a field. Currently, most forms on the web have customers fill in the entire length of the form and, only once they hit “Submit,” give the “red flags” customers need to either refill the form or, for those in a hurry and with a low tolerance level, completely leave the site. If customers are notified line by line how the form fill process is going, they are able to feel more secure with their entries and more likely to successfully submit the form. 6 Use side-by-side field captions Surprisingly, many online websites are still placing field captions vertically above the field box, causing the length of the form(s) to be twice as long. If this happens to fit your website description, consider placing the field caption horizontally next to the blank field. Additionally, to avoid any confusion on the visitors’ part, you can also include the name of the fields within the field box. As the customer clicks/enters the field, , the text is deleted. 4
  • 6. 7 Less form is more The less information you require from your customers, the less fields they have to struggle through and the more likely they will submit the form. As in the case of B2B websites, one e-business is fully aware of what the other e-business is trying to achieve when asking for every detail except time of birth. While many clever online marketers and website buffs simply create pseudo names, numbers, addresses, etc., would it not just be easier if the information asked amongst each other at the introduction stage was no more than a few relevant fields? 8 Tap into additional databases Although more information about your customers is always helpful, check and see if you can suffice without making all fields mandatory. One way of doing it is tapping into databases. For example, if you can complete the city from the zip code, you just saved a whole field. Form Analytic tools instantly reveal which fields are frequently left blank and refilled by customers. Once you determine which fields are problematic, you can decide which ones you are willing to let slide. 9 Use technology to save users time Country is one of the most annoying fields to enter. You scroll down a list of 160 or more countries and territories that you never knew existed until you find your own. Can’t decide which fields are more valuable than others and struggling to shorten your form? If knowing the exact locations of your customers is crucial data for your business, location fields including country, state and city can all easily be obtained using the reverse lookup on visitor’s IP addresses. 5
  • 7. The Page Design 10 Design a smart layout It is indeed true that customers always have the option to scroll, but the less work you give your customers to do, the better. Keep your form as short and sweet to the point as possible, not only in the number of fields but also in terms of design. If your form is long, consider either a two- column design or on the other hand a multi-step form, where you capture the email and name first and then capture other details in a separate page (see tip 12). 11 Don’t create distractions Jackpot. You have got your potential customers interested in your content/products. Now they want to see your product in action. There should be no confusion and no hesitation on the part of the visitor. The call to action screams it, the title on the page confirms it. In the form page, less content is more. In the case of websites selling or providing online products and services, abundant product/service information surrounding the fields, as well as over usage of images, can be distracting and grab customer attention too much to the point of causing them to back out of wanting a demo. At this point in the conversion process, customers have hopefully read enough compelling content on previous pages to want a demo. 12 Break your one long page of fill-ins into a two-page process Aggressive long forms are just not attractive, intimidating even. While there is always the option of cutting down the number of fields (the popular way to go), this is often not enough. Instead of cutting down fields, try splitting the form onto two steps / pages. This gives impatient customers the illusion that the energy required to fill out these fields is indeed less than what might actually be involved. Most websites who have gone through this redesign process experience a significant reduction in bounce rates. 6
  • 8. The Supporting Elements 13 Add customer testimonials In general, the design of your form pages should be as simple as possible. However, in the margins, some encouraging texts and light images are always helpful to ensure customers that others have enjoyed and approve of your product/services. It is always nice to get that nod of approval before clicking on that call to action. 14 Add incentive to complete the form Just as children respond well to candy, your customers will respond well to any small/large incentives you can offer. For example, you can try a free download, some free swag that would be worth their while, etc. 15 Include all product information On wish lists, check out, and booking forms, customers are often tempted to take steps backwards, not confident enough to move ahead with their purchases. The more details that are included on the wish list, the more confident customers will be when they decide to move ahead with their final purchases. 16 Include images of purchase items Add options to expand product images, further enticing your customers to make the purchase they know they want. 7
  • 9. 8
  • 10. The Convenience Factor 17 Let customers use cookies to remember their passwords As great as your form may be, there is no reason for a customer to fill in the same form over and over if he/she has no desire to do so. Every process the customer goes through when doing business with your brand contributes to their overall perception of you. Easy, convenient, rewarding…these are the qualities that get a form filled. 18 Go easy on customers and their passwords It is true that the web can be a dangerous place now. However, customers have other items on their to-do lists that go beyond creating the ideal password. As much as they may want to join your miles club (travel) or your price club (ecommerce), adding any time and frustrating stop and go points, can send your customers flying in another direction, or make them frustrated on their next visit with a password they cannot remember. 19 Go local While US customers indeed make up a good chunk of internet users, requiring number-only zip codes, US states, and specific phone formats will only increase the chances of customers receiving error notices and abandoning your website. The more flexibility and customization you allow your customers when filling out your forms, the more flexible they will be with you. 20 Be up front about your correspondence plans Tell your customers right on the form itself when they can expect to hear back from you if you can. This provides extra motivation to not only fill out your form, but also include accurate details. If you do not know when you will be getting back to customers, do not include any information you cannot promise. 9
  • 11. 21 Include an email privacy statement Ecommerce, travel, and other industry websites where a transaction is involved usually succeed in getting emails from customers. However, often times download and request a demo forms have a harder time getting an email, and at that, an email that works. Many customers are wary and skeptical of what may be done with their personal information, especially with their email address, which today can be as personal as a home address. When asking for your customers’ email addresses, include a privacy statement, ensuring them that their personal information, specifically their email will not be used or shared by any third party. 10
  • 12. About ClickTale ClickTale is the leader in Customer Experience Analytics, the next advance in web analytics, optimizing usability and maximizing conversion rates of any website. Its patented Customer Experience Visualization™ technology allows e-businesses to see their customers’ true-to-life™ online experience at all levels of detail, from aggregated views to playable videos of users’ browsing sessions. Unlike traditional analytics platforms that assess page-to-page navigation, ClickTale reveals the customer experience inside the page. ClickTale, an enterprise-class SaaS solution, is fast to deploy and provides immediate ROI. Serving over 80,000 customers worldwide including Fortune 500 companies, ClickTale is the fastest growing company in its space. www.clicktale.com US 1-800-807-2117 UK 0800-048-8871 © 2013 Questions? Tell us what you need Like what you read? Visit our content library Want to get started? Demo tailored to your site’s needs Learn More Request a Demo @ Next steps Contact Us