Measuring Form Drop-Off to Improve Lead Volume and Quality, Using GTM and CSS Selectors

This article explains how to measure form drop-off and progression rates using GTM (Google Tag Manager).
There are several ways to measure form drop-off with GTM,
and the one here uses CSS selectors rather than click IDs or classes.

We hope measuring form drop-off and progression helps you improve conversion rate and lead quality.

Related article:
The winning pattern for landing page (LP) structure that delivers results

1. Why people leave an LP

You want as many of the users who reach an LP as possible to convert.
In practice, though, most users leave before they finish filling in the fields.
There are broadly two points at which users who reach an LP drop off.

The first is leaving before they start filling in the form.
The main reasons for this are the following.
・The information and benefits they want are unclear above the fold
If the first screen of the LP does not clearly convey the information and benefits the user is after, they leave.
・The LP design is hard to follow
If the button leading to the form does not stand out, or sits somewhere awkward to click, users give up on reaching the form and leave.
Both of these call for improvements to the LP as a whole.

The second is reaching the form and leaving part-way through, without submitting.
The main reasons for this are the following.
・Too many or too complex fields
A form with too many fields feels like a burden and drives people away.
・The effort of filling it in
A UI that is awkward to type into, errors part-way through, entries that are not saved: any stress around input causes drop-off.
・Confusing questions or wording
If a question is unclear or full of jargon, users hesitate over the answer and may leave.

Measuring drop-off field by field is the first step towards understanding where and why users leave, and reducing the number who drop off between starting and completing the form.

2. The advantages of measuring form drop-off

Measuring form drop-off gives you the following.

2.1 Pinpointing where people leave

You can identify the steps with high drop-off and decide what to fix first.
Looking at drop-off by step and by field shows which fields users find tiresome, so you can work out what to change.

2.2 Higher conversion rate

Finding the drop-off points, fixing them and lowering drop-off across the form raises the conversion rate (CVR).

2.3 Better lead quality

The questions a form asks can affect lead quality.
In a recruitment agency, for example, the jobs you can put forward differ for experienced and inexperienced candidates. Asking about years of experience in the form may change the quality of the candidates you get.
Monitoring lead quality alongside drop-off leads to a form design that improves lead quality.

3. How to measure with Google Tag Manager (GTM)

GTM is a tool for embedding tags in a website.
With GTM you can measure form drop-off easily.

As mentioned at the top,
・The button you want to measure is not a link click
・The button has no data attribute
we introduce a CSS selector method that works even on those premises.

This guide covers it too.

3.1 Finding the CSS selector

A CSS selector is the string used to specify which HTML element a CSS style applies to. To measure each form field you need to know its CSS selector.

①Open the page with the form you want to measure, then open developer tools (Ctrl+Shift+C).
②Click the form field you want to measure and check the matching element.
③Right-click that element and choose “Copy” → “Copy selector”.

Make a note of the selector you copied.
※Check that no two fields share the same CSS selector.

3.2 Finding the measurement ID in GA4

GA4 is Google’s free analytics tool.
You need the measurement ID to send data measured in GTM to GA4.

①In the GA4 admin screen, click “Admin” → “Data streams”.
②Copy the “G-XXXX” value in the measurement ID field.

3.3 Creating a trigger in GTM

Create a trigger in GTM with the click on a form field as the condition.

①In GTM, choose “Triggers” → “New” → “Click” → “All Elements”.
②Set the trigger type to “Some Clicks”, choose “Click Element” → “matches CSS selector”, and paste the selector you copied.

3.4 Creating a tag in GTM

Create a tag in GTM to send the event to GA4.

①In GTM, choose “Tags” → “New” → “Google Analytics: GA4 Event”.
②Enter the measurement ID and the event name.
③Set tag firing to “Once per event”.
④Select the trigger you just created and save.

3.5 Checking the tag fires with preview

Use GTM’s preview mode to click the form fields and check the tag fires on the action you intended.
If you have set one up per field, check each one.

4. Analysis and improvements

4.1 What the analysis looks like

Check the data measured in GA4 using the events report and Explorations.
Look at the number of events (clicks) you set up to see how much drop-off there is.
You get data like the following, for example.

Around 30% drop off at step 3, so that step needs attention.

4.2 Improvements

For steps with high drop-off, consider the following.

・Fewer fields
Too many fields and users leave more readily. Remove anything that is not required, or split the form into steps.

・Better error messages
If an error message is unclear, users do not know how to fix the problem and leave. Show specific, considerate error messages.

・Input assistance
Features such as autocomplete reduce the effort of filling the form in.

4.3 Ongoing monitoring and improvement

Monitor form drop-off continuously and analyse the data regularly.
When you introduce a change, measure its effect and adjust as needed.
That keeps the form at its best and delivers a high conversion rate.

5. In closing

Measuring and improving form drop-off is essential to a better conversion rate and better lead quality.
Measure form drop-off with GTM and make changes based on the data to generate leads more effectively.

Related article: What is search advertising? A plain explanation of how it works, how to set a budget and how to manage it