What are some of the stumbling blocks in form design that you need to be aware of? What can you do to help keep people from abandoning your site from your forms? Here are some helpful advice and tips on making your forms more usable.

It’s about trust, benefit and cost

There is a theory that was derived from psychological, sociology and economic perspectives called Social Exchange Theory, which proposes that all social interactions and relationships are a process of exchanges that weighs in the subjective costs as compared to the benefits. When the benefits or rewards are outweighed by the cost or effort, people will end the interaction. The visitor already has some trust in your firm, as they have made it to your contact form.

What ways can your law firm provide a reward for the user to fill out your form? Offering something for free has always been a successful means to entice the user to convert. A lot of firms offer free legal consultations, so make sure you have call to actions throughout your site that say this; and make sure you say this on your actual forms.

Now that we know that the success of any interaction depends on the right balance of trust, benefit and cost, we can get down to the little things that can be done on forms to help convert your users.

Only ask for the information you need to make the initial contact

The web is growing at an extraordinary rate, along with scammers and con artists, so users are becoming more wary of arbitrarily giving their private info out. That’s one of the reasons why you should only ask the bare minimum to make the initial contact.

We have seen some law firm sites make the mistake of having really long forms with fields that are not really relevant or necessary to contact the person, such as asking for the person’s address, or even worse, asking for their birthday. Do you really need their address or birthday to make the initial contact with him or her? Save getting that info for when you contact them by phone or email, once you have gained their trust fully. The only time you need to ask for their address is when you are sending them something, such as a brochure or free report.

Through usability testing, we have found that the best forms have four or less fields: name, email, phone and comments/questions fields. To save even more space, you can combine the email and phone fields into one field and name it something like,”Enter Your Phone and/or Email,” thus letting the user decide what they want to give.

Brian Crescimanno, in his excellent article called “Sensible Forms: A Form Usability Checklist,” recommends asking yourself two questions about every element of the form:

• Is this a piece of information that is valuable to us?

• Is this a piece of information that is so valuable that it’s worth denying users  access to (whatever lies beyond the form) if they do not choose to provide it?

In any case, the old adage applies: “Less is more.” Keep it short.

Indicate required fields

Since people live busy lives these days, it is important to clearly mark which field is required. People usually scan the form before they start filling it out to measure how invasive to their privacy it is to complete the form, so indicating which fields are required builds trust between you and your visitor.

The standard and recommended indicator is the * (an asterisk), which can be placed near the label or field. A short explanation of the indicator should be placed above all the fields, such as “* Indicates Required Field.”

And be very cautious with which fields you make required. At the very least you need their name and either their email or phone; do not require both their email and phone.

Use clear and concise language

Forms are not where you want to have a lot of technical and marketing jargon. Be clear and concise, and descriptive as to what you want the user to fill out. Speak in the language of your target audience.

Also, use the <label> tag so accessibility is maintained.

It is good to match both the form’s heading and the submit button, so continuity is achieved. For example, if the main heading on the form is “How Can We Help?,” it would be acceptable to have the submit text to be “Get Help.”

Formatting, styling and layout

It is important on web forms that readability and flow is maintained. In that regard, here are some general guidelines to maintain the flow for readability:

• Avoid multi-column fields. It’s normally best to avoid putting fields and/or labels in more than one-column, as it breaks up the flow and does not allow the user to see the form as a whole, creating more cognitive effort on the user’s part. The only exception to this rule are the first name, last name, country and state fields, which are expected to be seen together as groups.
• Place labels above the fields. Usability tests have show that users can more easily associate labels with its field if it is above, rather than to the left of the field. If you must have the label on the left, it’s best to right-align the text.
• Make sure the fields have enough height and width for the user to type. In general, it’s good to have the width to be at least 50 characters, and if it’s a text-area field for the comments give it at least 10 lines tall to ensure readability.
• Style carefully. It is common to want to pretty up the default fields from the often boring default browser styling, but we must be very careful that the look and feel does not distract from the readability, and is in keeping with the site’s branding and design.
• Use ample whitespace. Flow is often jeopardized when there is not enough space between the fields.
• Group related fields. To help maintain flow, it is helpful to organize related fields together. You might have a section with just their contact info; and then another concerning the details of their case.
• Choose legible text. Use colors with good contrast with your design’s background. Make sure the text is large enough to read in proportion to the surrounding elements.
• Make sure your contact form at least starts above the fold. Way to often we don’t even see the form unless we scroll down the page.

Plan for when things go wrong

Since we are only human, we make mistakes, and errors often occur in filling out web forms. We need to account for those and take the appropriate action to defend against them. Ways to avoid errors on forms are:

• Be pre-emptive. As noted above, be clear and concise in your language on the labels, and denote clearly what fields are required. You might provide further helpful descriptive notes below each field.
• Use inline validation. Before the user even submits the form, let the user know they have made an error with clear and concise language. For instance, if the user types in the wrong email format and then tries to go to the next field, an error message can be dynamically displayed below the field in red that says, “Please enter a valid email address.” Helpful scripts like this jQuery plugin can make this possible.
• Also provide validation on the server-side. Inline validation is not foolproof, so also provide error messages after the user submits the form.
• Use caching, saving techniques. After the user submits and an error comes up, provide a mechanism whereby a user can go back and not have to redo all their work, which will only lead to user frustration.

Consider multi-step forms

If your form needs to be longer than 4-5 fields, consider breaking up your form in different steps using AJAX. For example, step one could have the name and contact info, with two buttons at the bottom, one saying “I am done, please send now,” and another one displaying “I have more information to give.” If the visitor just wants to send their name and contacts, they can stop there and his the “done” button; or they can proceed to the next step where they can provide comments about their case; in the same fashion, the can decide to finish the form here or proceed to step three to give additional, optional information about their case.

The advantage of this technique is that it gives people the chance to only provide the bare minimum, while allowing others to give more if they so choose; thus there’s less likely of a chance for people to abandon the form if they see there’s too much to fill out.

The importance of testing

People are of different walks of life, different ages, genders; and races, so it is important you test your form with your target audience. Testing can be as simple as asking a friend to go through the form and ask them if they had any difficulty. But real testing ideally should include both professional user testing and A/B testing.

Submit we go!

If you do most of these things listed here in this article, you are well on your way in creating the best possible form in converting your visitors into clients. There is so much more you can do to improve form usability, but that is for another article. Just remember that any interruption the user’s flow creates more effort on the user’s part, and thus reduces their trust in your firm.

If you need assistance in improving your form usability, do not hesitate to call us today at 800-872-6590 or fill out the form below.

Increase Conversions by Improving Your Form Usability | Law Firm Web Marketing

It would be more beneficial to lead the user to the final result that you wish to achieve with your website, whether that is to have the user contact your firm, or just to provide valuable information.

The following are some useful tips to avoid clutter on your website and lead the user to the vital information.

Use of Whitespace

One of the best ways to ensure that your website does not have a busy feel is to make great use of whitespace. By whitespace, we do not mean the actual color white, but the space, padding or margin between elements or objects. It’s the negative space. Not having enough space between elements gives your site a busy feel; having the right amount can make a difference in calling out certain elements you want the visitor to focus on, and giving the eyes a visual rest.

It also works on the micro level. Some sites are hard to read just because there is not enough space between the lines of text; sometimes just increasing the line height will do wonders in cleaning up the readability and cleanliness of your site.  There also should be consistent spacing between the elements, such as the same spacing between headings; otherwise your site might look unprofessional.

Reduce the Amount of Content

Consider reducing the amount of main content text as much as you can. If you already reduced it, try trimming it down again. People on the web read differently than reading print material. We tend to read books and magazines in a linear fashion; on the web it is a more non-linear affair; we scan text online, jumping around the page to what piques our interest; usability eye-tracking tests bear this out.

Having a lot of text can be of great benefit in search engine rankings, but SEO should never take precedence over the user experience. The user is the primary goal you are trying to convert to a client; and if you overload them with too much text all at once, you may lose that visitor, no matter how good your law firm Web SEO is.

If you absolutely need to have a lot of keyword rich content and links, consider moving some content to the footer area of your site as supplemental information, or links can be moved to a dropdown menu from your navigation areas. Do not worry about some of your content being below the fold because users have grown used to scrolling on the web.

Decide what is your most important content and sell it well above the fold; leave the rest to secondary areas of focus.

Visual and Content Hierarchy

It’s also important to break up of text with headings, lists and photos. Having proper headings, along with minimal content and the right whitespace, allows the user to quickly jump to what interests them, creating a visual hierarchy.

Balance of Design and Content

Some sites suffer from putting too much focus on a pretty interface and design, with gradients, bevels and chrome galore. The design should support and emphasize certain areas of the content, not overload the user’s eyes with visual graphical noise. The design should almost be there as background noise, leading the eye. A good litmus test to determine if your design is too heavy is quickly go to your website and see what you see first at a glance – the text or the graphics around the text. If you see the graphical interface first and not your content, you should tweak the delicate balance between design and content.

Conclusion

To be sure, there is a fine balance between the content and design, but by ensuring there is ample whitespace around the text and other elements to lead the eye, we only enhance the user experience. Be kind; don’t overwhelm your visitors with clutter. Minimize by deciding what you can live without and emphasize what is vital.

Link Resources:

Eye-tracking studies
http://www.youtube.com/watch?gl=AU&e=&hl=en-GB&v=ilq9qeyVjT0

http://www.youtube.com/watch?gl=AU&hl=en-GB&v=sVXjMXnU56E 

If you would like additional information or to learn how we can help you improve your law firm website conversions, please feel free to contact us at marketing@consultwebs.com or call us at 800-872-6590.

Clean House: Improve Your Law Website Usability | Law Firm Web Marketing