Universal Analytics: How to track conversions when URL doesn't change? - events

I'm in the process of upgrading a couple of sites to Universal Analytics and need some help setting up goals for conversion tracking...
I am now using auto event tracking (click listener) to see where users are clicking on the sites' forms, but I'm not sure how I can create goals for form submissions as the URL does not change. (Previously I was sending virtual pageviews when the submit button was clicked, but I don't think it's possible to do this in Universal Analytics?)
I know by using the click listener I can still see how many times the submit button of the form is clicked, but I need to set this up as a goal so I can monitor the cost per conversion of my AdWords campaigns.
Any help appreciated!

loop, if you are using GTM, you can simply use Form Submit Listener:
This listener then could fire an event tracking, which will serve as the condition for any conversion goals you might need. Just keep in mind when setting the conditions for goals, ALL of the Event-related dimensions (category, action, label) need to match, even though you can use only one (for example category = form submitted) as well.

Related

Time of stay on webpage

I want to know the time a user spends to fill a particular field in the page and want to trigger an event if the user spends more than 5 minutes to answer a question on that page.
I've looking at various Web Analytical tools like Crazyegg, Lucky Orange. Google Analytics for my website and i did not find any of them have this feature.
Is there any way that i can get this feature in my website.
I've been researching to get the perfect fit but in vain.
Any advice would help.
Thank you.
With the help of the Google Tag Manager you should be able to do this with Google Analytics:
Add a Datalayer to your page, which fires if a User starts filling your form/field.
Build a Event, Listening on this Datalayer and send a Timestep (for example: Category = Form, Action = Start, Label = {{Timestamp}}) Now you know then a User started interacting with your form.
Build a second Datalayer, fireing when the User sends your form. Build a Event for this and send your second Timestamp to GA (for example: Category = Form, Action = End, Label = {{Timestamp}}) - now you know how long a user needs for your form.
Trigger the Event
Here we can use the same Datalayer, we used with the Event-Tracking.
Build a Triger for your Event, listening on the Datalayer and then starts a Countdown (Timer-Trigger in GTM)
In the Timer-Trigger rules you have to specify, that the Trigger should not fire if the second Datalayer (Datalayer-End) fired allready.

Is it possible to make a accessible form without a submit button?

I am trying to create a site with high rankings in accessibility and one of the things i have come across is. My live search (that makes a ajax request and shows suggestions from what you type in the search bar on "keyup").
The list of suggestions i full of links that will take you to the page you are looking for meaning there is no submit page containing your results you just click the links therefore a submit button would be in my opinion redundant and useless.
My question therefore: Is it possible to make a form ex a live search without a submit button without the site being ranked lower than if it had a search button?
Is it possible to make a form ex a live search without a submit button without the site being ranked lower than if it had a search button?
You have to read WCAG Success Criterion 3.2.2 On Input
The first technique proposed is G80: Providing a submit button to initiate a change of context
But there's another technique which would not require a submit button:
G13: Describing what will happen before a change to a form control that causes a change of context to occur is made
TLDR: yes, but.
Its usually considered good practice to have a 'fallback' scenario. Say, for instance, the user is not using JS (god forbid) or if the user is using a screen reader of some sort - the search box should direct the user to a new page with listed results.
A helpful guide to building accessible sites can be found at (https://www.w3.org)[https://www.w3.org/TR/WCAG20-TECHS/]

AjaxFormValidatingBehavior Performance and Lost focus on Firefox

My project is using Wicket's AjaxFormValidatingBehavior to auto-save form content to Session on sort of a multi-tab form with a tree menu (there is no save button on individual tabs, though there is a "Save" button that actually submits the form, runs the validations and saves contents to database). I am facing few issues:
Since the behavior is added to all form components' onChange event, there is a server-trip every time user moves from one field to another. I know that a throttle duration can be specified to prevent this, but its not possible to set in my case as my forms are of different lengths/complexity, many components dynamically generated (including the tree menu). But is there a more elegant solution to auto-save form content (that doesn't have a submit button) rather than this annoying solution.
Another issue I am facing is that post onChange event, on Firefox the component loses its focus after the "server trip" ends. While on IE7 it works fine.
For the first question I think you need to add a pipelining facility, on your components' onchange call a javascript function of your which calls your webapp. You can include a feature similar to the one provided with the throttle duration but page-wide (delay each calls and only trigger the last if it is older than x milliseconds for example).
For the second one, I think you have to use the AjaxRequestTarget#focusComponent in your behaviors, or handle this thing in your "wrapper" as described in the first answer.

Use events or virtual pageviews for Google Analytics and ajax

What makes more sense (or is proper according to google)? Registering an event or a virtual pageview with Google Analytics when tracking navigation through a webpage with heavy use of ajax?
I had been using events to track this kind of thing, but I find myself kind of emulating the pageview mechanism by tracking the clicks through events like the following:
_gaq.push(['_trackEvent', 'signup', 'clicked', 'header']);
should I instead be creating virtual pageviews when visitors click on links that call AJAX and bring up dynamic content?
_gaq.push(['_trackPageview', '/signup/form']);
If this is a new content that user navigates to, then you should be using virtual pageviews.
If you use events for all navigation then some metrics will be unreliable like pages/visit, avgTimeOnPage, avgTimeOnSite, pageDepth. If you use pageviews for navigation these metrics will be closer to the truth.
Since not so long ago, you couldn't set up goals for events, which made virtual pageviews the way to go. These days, you can set up event goals, so the question is certainly valid.
What you can do with virtual pageviews (and not with events) is to visualize a funnel. If you want to follow the path of your visitors, I'd recommend a virtual pageview.
If you're using events, you can only find out that some time during the visit, the visitor opened the form. With virtual pageviews you can see in what preceeded the form, what lead the visitor to it.
I would go with the event tracking for more information about the event. Showing an in-page form that doesn't change the content is more of an event, but it's not really down to that, but rather how you need to report it.
Using pageviews for dynamic events within page would inflate the actual pageview numbers and since you can use events as goals in the new UI, there is no reason to track them as pageviews anymore.

How can I maintain the checkbox state on a page that is refreshed by Ajax?

I have a html table in my application that shows the state of various jobs running in the system. Each job has a state associated with it e.g a swirly gif for running jobs. New jobs have a checkbox next to them that allows the user to select and kick off the associated job.
The table is a struts2 auto refreshing div (sx:div), it refreshes every few seconds to reflect what is currently happening with the jobs.
The problem is that when the div refreshes I lose that state of the checkboxes.
Is there an elegant way of maintaining their state? I have the option of calling some javascript upon completion of the ajax refresh using the dojo topic system built into the tag but i'm not sure what is the best way to approach it.
I'm not very familiar with struts so take me advice for what it's worth.
There are two ways to approach this that I see.
The first (and probably simplest) is to add an event to the checkboxes which stores the checked state in an array or object onchange. Then, on callback from the ajax refresh, restore those states.
The second approach would require that the ajax refresh either be executed as a post so that the checkboxes are submitted to the server, or having a separate ajax action which fires off when a checkbox is checked. With either of these options, the ajax refresh could "know" at render which checkboxes to render as checked.
If you decide to go with number one, the javascript is not very difficult, especially if you happen to be using a good library (jquery, etc.).

Resources