Using Modal Windows to Increase Signups

In the last few months, Blue Ion has had significant success increasing the volume of leads and signups for our clients utilizing modal windows. Unfamiliar with the term “modal window?” It’s also called a lightbox or, in some seedier circles, a popup window (cringe). Whatever you call it, it’s the little window that appears to overlay the content on the website you are currently viewing to prompt you with a message, an alert, login screen, a sign up form, etc. Here’s an example from Goop.com.

modal window
Conscious Modal Windowing from Gwyneth Paltrow

There are a few ways to use modal windows to generate signups, most of which involve some amount of jQuery programming. Here’s a few popular options:

  • immediate, uninitiated prompt to sign up for something upon first page view. See example above on goop.com
  • session-based, formulaic prompt. For example, if you initiate a prompt after a certain amount of pages viewed (a favorite of mine) or after a certain piece of content is viewed.
  • customer initiated prompt. For example, if you clicked sign up for a newsletter and it generated a modal window instead of taking you to a new page/url.

The first two options are not user-initiated, so there is the possibility of a bit of blow back from your users. Keep an eye on the before/after changes in:

  • session duration
  • bounce rate (especially if you go with option 1)
  • pages per session
  • exit rate
analytics data
All good? Good.

I haven’t historically seen much negative change, and a small amount of loss in metrics could be forgivable depending on what you gain. But, don’t destroy the user experience by going nuts. You see this more often when people use modal windows for ads after every 4 page views (looking in your direction Outside Magazine!).

Make sure that in all of these modal window options you offer at least one benefit to signing up. Popular benefits that businesses mention are:

  • exclusive content
  • special offers
  • first access
  • increased convenience

The trick is to be short and sweet. In our example below, we offer the benefit of getting a free visitors guide that is jam packed full of color photography to help plan a trip. We need quite a bit of information to send a guide, so we then send customers over to the full page form if they are interested.

modal window example
Visitors Guide prompt example

If you are just looking to increase email signups or some other short form lead, you can even include the form in the modal window. An example of that is below. It’s nice because your customer doesn’t have to leave the comforting confines of their current content (nice alliteration… pats self on back).

modal window example 3
Example with email in window

A few final quick pro tips on modal windows.

  • If you are including a signup form in the modal window, and not pushing users to a new page, then be sure you are properly tracking the signup event in Analytics. Have your web developer implement event tracking on the signup button click so that you track the goal of signups.
  • Make sure users can close out of the window by clicking anywhere, not just on the little X or “no, thank you” message.
  • Test your modal window on mobile both for appearance and the ability to close the window out easily. They tend to be glitchy.
  • For triple bonus points, yodel while you modal. Modal-ay-eee, modal-ay-eee, modal-ay-eee-hooooo!

Good luck with your modal-ing.