• 88k
  • 15
Web Design \ DEC 5th 2018

Tips and Tricks to Create Online Forms for Your Website

Forms. Whether in written or online format, they are a (boring) fact of life. It’s just one of those things that will be part of the foreseeable future and frankly, they’re a pain. That said, this uneventful method of providing information is incredibly necessary and vital. This is especially true as a small business owner. Online Forms are essential for collecting leads, sending price quotes or gaining valuable feedback from your users.

While you may not put too much thought into filling out a form, there are a lot of components that make up what you could describe as a ‘good form.’ It’s imperative to create a one that falls squarely into this category so that the process of filling it out is easy for your users. That helps guarantee that the information they provide will be beneficial.

This may seem like a tall order for the inexperienced but that’s what we’re here for. Below we’re going to show you some useful tips and tricks to create valuable and complete online forms using Wix Forms for your website.

01. Find out what doesn’t work, first

Sometimes, seeing how not to do something serves as a good starting point. The sheer number of poorly designed forms out there will turn up some good results from just a quick Google search. While viewing these less-than-fortunate examples, take note of what you personally find is wrong with the form itself. Use these notes and apply the opposite later on.

02. Be clear with your language

If you want a client to successfully fill out an online form you’ve created, make sure they aren’t the ones asking the questions by the end of it due to vague, unclear prompts. For every piece of information you’re asking from them, try to ensure that it can only be interpreted in the intended way. Of course, you can’t control the way people think, but by using clear, concise, and simple language, you can avoid any communication mishaps.

Wix Contact form

03. Achieve your “ideal form” by creating two others

This is just the long-winded way of saying, ‘add only what you need to your form.’ Create two forms: One that contains just the most necessary details and another that’s unnecessarily lengthy with information you could use to respond with greater precision. Once you’ve established the required fields that both forms have in common, go line by line on your “excessive” form and ask yourself how critical it is to have this information the moment the form is submitted (remember, if it can wait, it can wait). Through trial and error, you will come up with your “ideal form,” which melds the necessities with some ‘bonus’ fields, giving you better insight into the client and request. This additional information will equip you to provide a better first response to the customer.

04. Keep typing to a minimum

It should be obvious that making a form difficult to fill out will increase abandonment rates, so the name of the game is to simplify the process for your web visitors. One such way is to offer up choices instead of requiring someone to fill it out themselves via text field. For example, if you’re asking for someone’s availability, instead of providing a text field, requiring them to write the days and times manually, simply provide checkboxes for the days they are available. Try to prevent the user from typing so they don’t get discouraged, especially if it’s something that you can easily provide a clickable solution for.

Another reason to keep the typing to a minimum? The increased use of mobile devices for accessing the Internet. While it’s more than possible to fill out an online form on your phone, it is that much harder than desktop. So keep it simple for all types of browsers.

Wix Forms

05. Give your online form some breathing room

If your primary goal is to have someone complete an important form, make sure that you make it easy for them to stay focused. Distracting elements like animation, lightboxes and big blocks of text should be kept to a minimum around your form. To accomplish this, place it in an area that will not have to compete with these visual elements on your website. The best solution? Its own dedicated page.

06. Be loud with your colors, not with your words

We’ve already established that it’s very important to to be clear and concise with your language, leaving no room for anything but understanding. However, in order to guide the user, the use of color can be helpful to keep them on track. For example, if you have a long form for the user to fill out, make the button you designate for ‘submit’ or your call to action a bold, high contrast color to the rest of the form. This not only makes the text jump out to you like any good CTA should, but if the user can see the end point (even in their peripheral vision) it can put them at ease and rid them of what we’ve coined LFF (long form fatigue). Another element to consider is the size of your form. Make sure it’s big enough for readers to fill out with as much ease as possible.

07. Obsess over your ‘send’ button

So you think the ‘send’ button is a meaningless trigger to have the information you require sent to you by the client? In a very basic sense, sure, it is, but to a UX (user experience) writer, it can be everything. You invested so much time already researching on how to create an excellent form (which may be indeed why you’re reading this article), so why not go the extra mile in making sure all your bases are covered? Channel your inner UX writer to see if there’s better wording that could be added instead of the standard ‘send’. Does the word ‘submit feedback’ look better? What about, ‘request price quote?’ If you can, try to make your submission button reaffirm what the form is being filled out for.

Wix Forms

Adding Wix Forms to your website

Now that we’re on the same page about what a good form should be comprised of, it’s time to add Wix Forms to your site. Using this form builder, you can create and add any type of form you need to your site. With Wix Forms, it’s easy for your visitors to answer your questions and leave their information. Thanks to its seamless integration with all the other business components available through Wix, all submissions are stored in Wix Contacts. Choose from ten handy templates including Contacts, Leads and more, plus customize and design forms to make them your own.

  1. Go to wix.com
  2. Login to your Wix Account
  3. Access the Editor
  4. Click the ‘+’ button on the left hand side
  5. Select ‘Contact’
  6. Choose from a variety of Wix Forms
  7. To add, just drag and drop

Customizing Wix Forms

After you’ve added your selected online form, it’s yours to customize as you see fit. Don’t get too caught up with the names of the templates that you choose. The ‘Contact’ template you chose could end up functioning as a job application form, feedback form, or any other type of form you need. Fields can be added, removed, designed and animated individually, giving you control and flexibility over even the most minute of details. You can even create a custom lightbox or page that a user will be directed to after they have submitted the form, like a ‘Thank You’ page. The cherry on top? You can easily access all of your submission data within your site’s dashboard.

Ready to put these tips into use? Start creating your own stunning website today!

By Blake Stimac
Community & Social Media Manager, Wix About The Wix Blog

Get The Wix Blog
Straight to Your Email

Subscribe to the WixBlog And never miss an update!

Hmmm, that's not a valid email address.

Hmmm, that's not a valid email address.

Join Us! \ 

Get the latest and freshest content on creating
& marketing your Wix website.

Hmmm, that's not a valid email address.

Hmmm, that's not a valid email address.