Your registration form – capturing more emails


For many sites, e-mail addresses are collected in one of two ways:

  1. When a user creates an account on the website
  2. When a user requests subscription to a newsletter

In my world, newsletter signups aren't near as popular as registering for an account (unless you offer something for free in exchange for signing up for the newsletter).

If registering for an account is our primary lead source, we better make sure we snag any email address that's entered, whether registration was completed or not!


The Failing Registration Form

Every registration form has a certain percentage of abandonment, users that visit the form and either leave right away, or enter a couple fields, then give up. The reasons for abandonment are many, but here are a few of the more common:

  1. The form is misleading about it's length (multi-step process that isn't dislosed at the beginning)
  2. Validation errors that frustrate the user
  3. Information that the user does not feel comfortable providing
  4. A user gets side-tracked during entry of a long form, even though they had full intention to complete it.  This is increasingly common as more users are using "tabbed browsers" which allow them to easily open a new page to find additional information, never to return to the original form.

The sad part is, without having any contact information for the user, there is no way to follow up with them to assist with the registration process. They are lost, probably for good.


Snagging a piece of the abandoned registration

The good news is, technology is available to help us grab a piece of the user's information as soon as it's available. Typically, this piece of information will be one of the first two or three fields entered by the user. I think for most website owners, that golden piece of information is the user's email address.

To make this happen, we need to do two things:

  1. Encourage the user to enter their email address very early in registration process
  2. Capture the email "behind the scenes" as soon as it's typed into the field

Getting the email early on

The concept used to get a user's email address first is very simple: Ask for it first! Then, don't overwhelm your user with 20 additional fields afterwards. Instead, break the form down into 2 or 3 steps.

For example, if your registration form is asking for username, email, password, billing & shipping information, it could easily consist of 20 or more fields. Ask for the email address, username & password first. Then, on subsequent steps, request the billing & shipping information.

If you don't wish to create a multi-step checkout, this technique is still possible. Just be sure to list the email address as the first field on the registration form.

simple registration form

Capturing the Email

Okay, so we now have a multi-step registration process, encouraging the user to at least provide their email address. So, how do we capture and store that email address directly after it's entered, but before the form is abandoned. Not only is this possible, but this exact technique of "moving" data behind the scenes happens to us constantly as we browse the web. When using Google Maps, each time you pan the map up/down/left/right, the web browser sends information about your mouse movement back to Google's servers behind the scenes, without refreshing the page. A response is then sent back to the web browser, telling it how to adjust the map.

This same technique can be applied to capture the email address of a user as soon as it's entered. However, in our case, we only need to be concerned with the first part of the "data movement", which is, sending data to the server behind the scenes. We don't need to get any type of response, or take any action afterwards. We just want the server to store the email address and that's it!


technicalThe Technical Details (for your webmaster)

Your webmaster has most likely heard the term AJAX. It's a technique that is used to send information to, or request information from a web server without reloading a web page. So, it is essentially transparent to the user.

If your webmaster is familiar with a JavaScript framework, such as jQuery, the amount of work required to grab the email address after it is entered, then store it to database is very minimal. This can be completed by a proficient developer in about an hour.

At a high level, the process would involve:

  1. Create an event handler to find out when the user has left the email field
  2. At that point, if an email address has been entered, use AJAX to send it to a server script
  3. That server script will store the email address to an "abandoned registrations" database table

If the registration is completed by the user, that record in the "abandoned registrations" database table should then be removed. However, if the registration is not completed, that email address will hold string in the database, ready for a follow-up!