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.

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.

Form & Input Fields Now Editable

The form builder now allows the modification of input fields and web form details. Click on the Form Field icon to edit a form or field.

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.

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.

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

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.

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.

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.

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.

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.

« Older Entries Newer Entries »

About the Form Builder Blog

The Online Form Builder Blog is published by FormSmarts, a web form service providing all you need to create a form and publish it online in minutes. FormSmarts makes it easy to build a form and embed it on your site. You can then get form submissions by email or store them on FormSmarts and download an Excel report. Learn more about the many other benefits of FormSmarts.