BLOG - HOW TO

Designing Overlay Email Subscribe Forms That Your Visitors Will Love

ROS HODGEKISS - MAY 6, 2011

When it comes to subscribe forms, it looks like the difference between being making it the most loved, or most hated design element on your site comes down to shades of gray.

I came across an interesting study on ‘Lightbox Overlay Dialog Boxes‘ via Jakob Nielsen’s Alertbox blog. In one example, he shows a lightbox that’s not at all dissimilar from one we featured in our earlier round-up of email subscribe forms:

Regarding lightboxes like this, Nielsen is gushing, calling them the ‘interaction design technique of the year’ in his 2008 study on good application UIs. He reiterated this point in March, stating:

“In last week’s study, this (lightbox design) worked well, just as many other lightbox designs have performed swimmingly in our previous usability studies.”

However, in the same study, Nielsen goes on to slam another overlay dialog box, calling it a ‘repugnant perversion‘ and ‘no better than a pop-up, which is the #1 most hated advertising design‘. Here’s the subscribe form in mention:

So, what makes the Flight of the Conchords lightbox superior to this overlay? The dimming effect. This is put eloquently in the 2008 study, which states:

“The lightbox benefit is obvious: it’s impossible for users to overlook the only bright part of the screen. This is in stark contrast to many traditional designs, where users often remain blissfully ignorant of notifications that are camouflaged within busy pages.”

The overriding problem with the later design is that it in no way stands out from the busy (and not particularly attractive) page below it, creating a visually confused look in which the reader doesn’t know whether to look at the site logo, the prominent ‘Signup Here’ button, or the prompt to subscribe. Plus, the overlay has no visual consistency at all with rest of the site, even going as far as using a totally different set of (crappy) fonts.

Adding a lightbox subscribe form to your site

Searching for ‘lightbox JS code’ on Google offers plenty of variety to choose from. However, if you’re looking for a more intelligent way to present your subscribe forms to site visitors, it’s hard to go past PadiAct, an app for creating targeted forms that display based on criteria such as referrers, behavior patterns and time on site. PadiAct also integrates with Campaign Monitor and is super-easy to setup, while providing the advantage of detailed reports on conversion rates, daily trends and more. Find out more in our recent review of PadiAct.

Finally, what has your experience been with the different types of subscribe forms out there? Do you prefer lightboxes, or regular, static forms? We’d love to hear your thoughts in the comments below.

Straight to your inbox

Get the best email and digital marketing content delivered.

Join 250,000 in-the-know marketers and get the latest marketing tips, tactics, and news right in your inbox.

Subscribe

Get started with Campaign Monitor today.

With our powerful yet easy-to-use tools, it's never been easier to make an impact with email marketing.

Try it for free