« »
Aug 13
2008
Many people, including myself, don’t enjoy filling out forms. Forms are usually long, unclear, and contain too many required fields, etc.

To the contrary, from a business perspective forms are an excellent tool for gathering information.

Our job as web analysts is to make both parties happy and help optimize form length with input analysis.

In this post, I will share with you E-Nor’s technique in determining the forms fields that people are most likely not to complete. I will show you how to make this data available to decision makers and web optimizers so they are able to make the necessary changes.

First we will need to add some JavaScript to the form’s html code. Add the below onclick event in the submit button code:


Upon submitting the form, the validation function will be called to check the filled or empty status of the fields.


The validation function is often used to verify that a required field has valid information in it. Today, we will also use it to pass two variables to the isEntered function:

  • The first variable is the text that the user enters in each field. If the user enters “John Smith”, for example, in the name field, then document.getElementById(‘name’) = “John Smith”, and if the field was left empty, then document.getElementById(‘name’) = “ ”.
  • The second variable is the name of the field (ex. “name”) and this is needed to send information to Google Analytics.

The isEntered function will check the el variable that is passed to it from the validation function.

  • If the value of variable is null, we will send a pageview to Google Analytics indicating that the field is empty (ex. /forms/contact_us.htm/empty/phone)

Reading data in

As we might have thousands and thousands of pageviews in our main profile, I suggest creating a specific profile for the form:

1. Create a filter and name it URL Filter – Contact Us Form

2. Add the above filter (URL Filter – Contact Us Form) to a new profile with a name such as (Contact Us Form)

3. Go to the new Contact Us Profile -> Content -> Top Content

The numbers above clearly show us which fields customers usually fill out or leave empty. This level of input analysis will definitely help optimize form length

Notes:

  • The Name and Email fields are both required fields; they should not appear in our report since no one will be able to submit the form without filling them.
  • The Comments field has a very high number of pageviews, 154, which is a sign that customers are not interested in filling out this field of the form.
  • I will leave what to do after this to you. Depending on the nature of your business and the objectives of the form, the solution vary.
  • It may make sense to remove fields from the form so that the form is short and to the point.
  • Another option is to test the original form to shorter versions of the form using a tool like Google Website Optimizer. It may be the case that a shorter form will get you more submissions but it is also possible a shorter form will have no effect at all.

Tags: , ,

15 Responses to “Optimize Form Length with Input Analysis”

  1. Pradeep SV says:

    Great and good Info on optimizing form, here is some additional info on Implementation and also the analysis and optimizing of forms

  2. SEOLion says:

    Thanks for the explanation. In Omniture there is a plugin to do form analysis , but here it is an indirect procedure for form analysis.
    Nowadays everyone is expecting to be spoon-fed thats why they still go for Omniture and not the free Google Analytics ;)

  3. Adam Boulton says:

    Hey great post,

    Am I right in thinking that the total number of form submissions is the number of page views for the thank you page?

    And to work out the percentage of comment field filled in you would do the following

    217(total)-154(comment page views) =63

    63/217*100 = 29%

    So roughly 30% fill out the comment field, correct?

    Anyway to get GA to calculate this automatically?

  4. Rehan Asif says:

    Yes, you are right about the total number of form submissions being the number of pageviews for the thank you page.

    29% of those who filled in the form also filled the comments field.
    You can also consider this number: (63/278) * 100 = 22%.
    22% of the times that the page was viewed, the comments field was also filled.

    Sorry, it isn’t possible to get GA to do this automatically for you today.
    But GA keeps getting better every few months, so who knows, maybe this feature will be available in the near future!

  5. Bart Myers says:

    Great post!

    Can you use GA’s new(ish) event tracking features in lieu of the page tracker?

  6. Rehan Asif says:

    Hi Bart,

    That is a good idea and smart application of the object-oriented event tracker.

    I think the basic concept is the same and the exact code that is in the isEntered() function would have to change to follow examples of event tracking.

  7. The technicalities of this are rather advanced, yet the final results are brilliant. Just to understand this correctly, we will still require that the developers of the website make modifications to the code in order for us to track the form or can I just insert the filters into Analytics.

  8. Hi SEO South Africa,

    Yes the website developers will have to make modifications to the form’s code. This might require some work but the end results are definitely worth it.

  9. Hey Allaedin – Nice blog post, very clearly explained and a more object orientated approach than the one I describe in the book.

    My slight (and it is only slight) reservation is that this method doesn’t allow you to define the pv data as a funnel, which is a very powerful form of analysis for forms.

    Best regards, Brian

  10. Hi Brian,

    Many thanks for the feedback… Yes, you are right about the funnel…my solution is not perfect yet but we will keep improving it over time. :)

    See you on Tuesday at the summit :)

  11. great tips for it..i’ll try to put in on my blog

  12. Edwin says:

    Never knew that this was possible with Google Analytics. Thanks for this and I will add it to find more data to crunch :)

  13. JJ says:

    Will this work with the newest Google Analytic code? I am beginner and just want to make this work without changing anything.

  14. Hi JJ,

    Welcome to the Analytics world. The code in the post will not work for the new Asynchronous code. I will update the post with the new syntax, but now for your reference, here is the new code you should use:

    function validate()
    {
    isEntered(document.getElementById(‘name’),’name’);
    isEntered(document.getElementById(‘email’),’email’);
    isEntered(document.getElementById(‘phone’),’phone’);
    isEntered(document.getElementById(‘company’),’company’);
    isEntered(document.getElementById(‘comments’),’comments’);

    frm.action=’/thankyou.aspx?src=contact_us.htm’;
    }

    function isEntered(el, field_name)
    {
    if((el.value==”") || (el.value==null))
    {
    _gaq.push(['_trackPageview', '/contact_us.htm/empty/'+field_name]);
    }

    else
    {
    return false;
    }
    }

  15. I love the idea of seeing how many forms fields were “visited” compared to completed but web analytics may tell you what people do but they don’t tell you why. Certainly we can hypothesize that people are seeing it and may not find it important, don’t believe it’s necessary, or just don’t care, but based on the form layout, I’d guess that people are tabbing into the comments field but not really noticing it.

    Some quick usability testing with 4-6 representative users would provide the feedback you need to know the “why” part of this problem. This isn’t a form with too many fields (five is fairly routine). It’s a form with a workflow that doesn’t match a user’s mental model.

    I realize this post is very old, but would love to see some examples with different form layouts and with more than five fields, particularly those that gather market research data with demographic questions. This could be a very cool experiment!

Trackbacks

  1. Bloggers Digest – 8/15/08 « Get Elastic
  2. Use JavaScript and Google Analytics to Optimize Your Forms | JavaProNews
  3. A Guide to Google Analytics and Useful Tools | WebsGeek
  4. A Guide to Google Analytics and Useful Tools | Astagram Studios- A Creative Studio- Official Blog
  5. lengte
  6. Contact Us Form | AllGraphicsOnline.com
  7. Google Analytics (Parte 2) Aplicativos, plugins e extensões | BLOG SAMIRDESIGN
  8. Tips on Reading Google Analytics | | Digital Traffic SquadDigital Traffic Squad
  9. A Guide to Google Analytics and Useful Tools ‹ Limitless Creations

Leave a Reply