Building Successful Web Forms
Web forms play a key role for visitor (and customer) interaction on many
sites. However, many web designers don’t realize that there may be huge
differences in form abandonment ratio, depending on how well the form is
designed. In this post and follow ups, we’ll give you some tips to help
you make your web forms an effective communication channel.
Always provide form filling instructions.
Don’t assume that all of your visitors will understand how to submit a form without further explanation. Short and clear form filling instructions can reduce form abandonment, and increase the quality of the information collected.
- include a call to action phrase like “Please fill out this form to
contact XYZ” - indicate the purpose of the form and the recipient of the information collected
- if applicable, confirm that you will reply, and give an indication of the time frame
Select the correct data type for each input field.
Because of necessary form validation, choosing and incorrect data type may prevent a form user from submitting valid information. When this happens, it is likely to lead to form abandonment.
For example, if you specify that a form field can only contain a Number, it may not work for a phone number. 1233456789 will work, but not 123-345-6789. So use
the Phone type instead. In many cases, the form builder will
pre-select a type for you, but not always. Read
more about selecting an input field data type in the form builder documentation.
Choose the most appropriate input field widget.
Don’t restrict yourself to text boxes and drop-down lists. Take advantage of the full range of HTML form fields with radio buttons and checkboxes. Learn when to use each one.
Using a drop-down list for a yes/no question will slow down the form user, and increase the chances (s)he gives up. Use radio buttons instead. Read tips about choosing the best input field widget in the form builder documentation.
Brand your forms for instant visual recognition.
Always brand your web forms with your own logo. This helps visitors
recognize at first sight who they are about to send information to.
Posted on May 6th, 2008 in HTML form.
Post a Comment
Tags: form builder, form design, howto, input field, web forms
Why Does Submitting a Form Require Two Steps?
Many form processors let visitors submit a form in only one step: users fill in the form, and are done after pressing the submit button. With FormSmarts, there is an extra confirmation step, during which users are invited to review and confirm the information submitted. There are two strong reasons why we added the confirmation step.
The first reason is quality. FormSmarts is typically used for transaction where the information submitted is important. Important because the information collected is intended to be read by humans, rather than machines. Important because this information is often intended to be acted upon.
By allowing users to review and modify their submission, we increase the accuracy of the information you get in the end.
Form users understand that, and it increases their confidence that you value the information they are sending you. Most of times, confirmation will only add a few seconds to the whole transaction.
The second reason is security and usability. Many form submissions are automated, or even manual spamming attempts, known as form spam or comment spam.
When a user presses the submit button, a lot more happens on the server than you may suspect. If we spot a likely spamming attempt, we’ll ask the user to complete one or more tests (e.g. CAPTCHA test) on the confirmation page. But in the same time, the bulk of users will never be asked to waste time on a CAPTCHA test.
Based on years of experience, we have no evidence of users thinking they are done after the first step and not completing the form submission.
Posted on Apr 23rd, 2008 in form handler.
2 Comments
Tags: captcha, form handler, form spam, form submission, usability
Form & Input Fields Now Editable
The form builder now allows the modification of input fields and web form details. Click on the icon to edit a form or field.
Posted on Apr 16th, 2008 in form builder.
Post a Comment
Tags: form builder, input field, upcoming, web forms
Getting Help on FormSmarts
At FormSmarts, we are pleased to let you use our web form platform absolutely free. However, whenever we have to help you in person, we ask you to spend a few minutes writing a review on one the following websites, before we take some of our time to help you.
- write a review on CGI Resource Index
- write a review on HotScripts
About Writing Reviews
We ask you to write reviews that are useful to readers, not spam. If you’re using FormSmarts, there must be reasons: talking about features you like about FormSmarts is probably a good start.
Contact Us When Done
Once you’re done, contact us.
Posted on Apr 16th, 2008 in form builder.
Comments Off on Getting Help on FormSmarts
Form Processor Upgrade: More Interactivity for Web Form Users and More
We’ll be upgrading at the end of the week some key components of FormSmarts. The changes will affect both form users and form owners.
More Interactivity for Web Form Users
- form users can modify any invalid data they may have submitted in the same page, rather than having to press the back button
- form users can modify submitted data even when form data is not cached by the browser, or if JavaScript is disabled
- we’ve added features to improve the experience of visually-impaired users equipped with screenreaders
Changes in Email Notification of Form Results
- new email subject format [Form #123] My Form Name #456
- the first part [Form #123] is fixed so that you can use it to create a filter within your mail client
- emails now include a unique transaction ID, e.g. #456 that can be used, for example, as an order number for order forms (form users are shown the transaction ID on the confirmation page)
- whenever your form contains an email field, you can now reply to sender hitting the reply button in your email client
- because of the previous point, we no longer show your pass-phrase in every email
Posted on Apr 15th, 2008 in form handler.
Post a Comment
Tags: email notification, form submission, web forms
Any Feature Suggestions for FormSmarts?
We’ve added a feature suggestion form. You can vote for features requested by others and suggest new ones. Now is the time to have your say.
In average, we release a new version of FormSmarts form builder or form processing engine weekly.
Posted on Mar 31st, 2008 in form builder.
Post a Comment
Tags: upcoming
New Web Form Creator Demo Video Available
We’ve added a new demonstration video to help new FormSmarts users get started. The video is on YouTube, and a higher quality version is available for download form the Internet Archive.
Posted on Mar 25th, 2008 in form builder.
1 Comment
Tags: howto, HTML form, video tutorial
FormSmarts Form Creator Now Supports All HTML Form Field Types
We are pleased to announce that FormSmarts now supports the full range of HTML form input fields. Users can now update their web forms and create new ones using Drop Down Lists, Radio Buttons, and Checkboxes.
We are in the process of updating relevant documentation on the site.
Update: see how to choose the correct form input field.
Posted on Mar 22nd, 2008 in form builder.
Post a Comment
Tags: form design, upcoming
Tips for Web Form Users with Non-English Language Websites
Many users in non-English speaking countries now use FormSmarts, so we thought we would post a few recommendations for them.
When building your forms with the form creator, use the text data type for any fields that may contain non-English characters, such as the accented characters found in many European languages (All data types now support all languages/character sets).
Note that non-European languages like Arabic, Chinese, Hebrew, Japanese and Russian are not supported at this time.
As you know, FormSmarts form handler is not a simple form to email processor script like FormMail. Each and every web form submission is analyzed in real time, and the user may be asked to complete a challenge if we suspect a form spam attempt. Although anyone capable of reading elementary English should be able to understand what is expected from him/her in that context, this is something you may have to take into account when designing your web forms. You could for example warn users in the form filling instructions.
If you need help, we provide limited support in French, German, and Chinese (as well as English, of course.) You can write us in any of those languages, but we will only reply in English.
Posted on Mar 11th, 2008 in form handler.
2 Comments
Tags: howto, international, web forms
Displaying Your Own Logo on Your Forms
FormSmarts users can now display their own logo in the top left corner of their forms.
Note that because each logo must be reviewed manually, we ask you to spend a few minutes to help us publicize FormSmarts before we take some of our time to validate your logo. Alternatively, you may get your logo validated for a small fee of US$ 5 per logo submitted. You may help us by:
- writing reviews about us on relevant sites and blogs (e.g. Scripts.com, HotScripts)
- posting a video on YouTube showing how to use FormSmarts (gets you free validation of all of your logos)
Once done, ask us to validate your logo.
Posted on Feb 16th, 2008 in form builder.
2 Comments
Tags: upcoming, web forms
About the Form Builder Blog
Categories
- collaboration (4)
- file upload (1)
- form builder (42)
- form handler (9)
- form spam (5)
- HTML form (11)
- mobile form (1)
- online form (4)
- payment form (10)