Kaleigh Moore
Kaleigh Moore is a freelance writer specializing in blog content for SaaS companies and ecommerce platforms. You can check out more of Kaleigh’s work at wearelumen.com.
» More blog posts by Kaleigh Moore
Josh Gallant
Josh is the founder of Backstage SEO, an organic growth firm that helps SaaS companies capture demand. He’s a self-proclaimed spreadsheet nerd by day, volunteer soccer coach on weekends, and wannabe fantasy football expert every fall.
» More blog posts by Josh Gallant
Popups can actually enhance your visitors’ experience and be an incredibly effective marketing tool when used in a thoughtful, targeted way.
To name a few, pop-ups can help you…
With a few best practices and some steal-worthy examples, this post is here to help you design and launch high-performing popups that convert more of your visitors into sales, leads, and customers.
Do popups still work?
First thing’s first, let’s address the elephant in the room.
Yes, popups absolutely still work.
Popups keep people on your page, remind them of what you have to offer, and collect data to nurture leads. Think of them as your marketing sidekick with the superpower of boosting conversions.
How popups worked for these brands:
Broomberg wanted to generate more leads on a tight advertising budget. They designed a popup that increased their leads by 72%. They did this without having to spend more money on paid search advertising.
Types of popups and how they work
In simple terms, a pop-up is an element on your website that “pops up” when users visit a page, scroll to a certain depth, stay on a page for a certain amount of time, or shows a different signal of engagement.
Let’s cover the eight most common types of pop-ups you’ll likely be working with.
Time-based popups
Time-based pop-ups are probably the most common.
After a visitor has been on a landing page for a set amount of time, a popup appears to offer them a discount, a free resource, etc.
By setting a specific time for the pop-up to appear, you can ensure that your audience has had enough time to explore your content before being presented with a lead-generation opportunity.
Remember, timing is everything when it comes to popups, so be sure to use analytics to determine the optimal time to display your pop-up.
Welcome popups
Welcome popups appear right away when a visitor lands on a page. Essentially, they’re time-based pop-ups where the “time” is immediate.
These popups often include a special discount offer or a newsletter sign-up form to entice visitors to stay connected with your brand. By offering something of value right from the start, you can encourage visitors to explore your site further and potentially make a purchase.
Scroll-triggered popups
Scroll-triggered popups are exactly what they sound like—popups that appear after a visitor scrolls a certain amount down the page.
By setting them to appear after a user has scrolled through a certain percentage of your page, you can catch their attention when they’re already showing signs of being engaged—increasing the chances of them interacting with your offer.
For example, a scroll-triggered popup can be set to show up after a visitor has scrolled through 70% of a long blog post. This ensures that they have already seen the value you provide and are more likely to take action.
Exit intent popups
Exit-intent popups appear when a visitor intends to leave your page. They typically monitor when visitors hover over the tab bar to click “back” or close the page.
By tracking user behavior, such as mouse movements and scrolling patterns, these popups can be triggered at the right moment to capture the attention of potentially lost leads.
Exit intent popups can increase conversions and engage visitors by offering special deals, collecting feedback through surveys, or providing valuable information. Just make sure you aren’t coming across as desperate or used-car-salesman-like. After all, a few extra conversions at the expense of your brand reputation isn’t a wise trade to make.
Click-event popups
Click-event popups are similar to scroll-triggered popups in that they target visitors who are already showing signs of engagement.
When a visitor clicks on a link (like a CTA) a popup can appear to guide them towards conversion further. Since these visitors have already expressed intent, the chances of them converting are higher when they see your popup message.
Floating bar popups
Floating bar popups (or sticky bars as we call them here at Unbounce) are the least intrusive type of popup you can use.
These types of popups stick to the top or bottom of the screen as users scroll to keep your message or CTA on screen at all times. This can be a great way to promote a limited-time offer, encourage sign-ups, or drive traffic to a specific page.
Because it’s more of a gentle nudge that can be ignored compared to a traditional popup that needs to be actively closed, you can roll out a sticky bar popup across more pages on your site at the same time.
Chatbot popups
Chatbot popups are most commonly used with a live chat tool (or these days especially, an AI chatbot) that shows a prompt in the bottom-right corner of the screen.
The objective is typically to provide assistance to visitors showing some intent to purchase or reach out. Maybe they’ve reached a key product page, a demo request page, or have visited at least five or six pages on the site.
Just make sure you aren’t overdoing it with chatbot prompt after chatbot prompt, especially if your first attempt gets ignored. It’s easy to become the overly pushy sales rep in a department store that really, really, really wants to sell you some old jacket.
Full-screen “takeover” popups
Lastly, we have the full-screen “takeover” popup which does exactly what you’d imagine—takes over every pixel on the screen with your popup.
These popups (obviously) make your message impossible to miss, which is a positive, but do have their drawbacks and risks. They’re as intrusive as it gets on purpose, so use them sparingly and strategically.
A full-screen takeover that just promotes your mailing list without a you-don’t-want-to-miss-this level offer is probably not the best move. Instead, save the takeovers for your biggest offers and your most important messages, like Boxing Day sales or exclusive pricing.
How to design a successful popup
Great popups are really just a combination of the right elements blended together with the right strategic approach. Let’s talk about how to build a winning popup.
The headline is the hero
80% of people who see a piece of content will only read the headline, and a good headline can boost traffic by up to 500%.
So be sure to make the benefit of your offer clear right in the headline. This makes it easy for someone considering clicking away to know exactly what they’re turning down. Your call to action (CTA) should also be simple enough that it fits in a headline anyway.
If you’d rather not start from a blank page, you can use Unbounce Smart Copy to generate a bunch of optimized headline ideas in seconds with AI. Then you can narrow the list down to your favorites and make any tweaks you want.
Be clear, relevant, and concise
Like all content, you want your popups to be clear and to the point. It’s not just about the relevance of your popup to your visitors. It’s also about the relevance of your popup to the page it appears on—and the experience that you’re guiding your visitor through. Make sure it complements the content on your page instead of competing with it.
Canvas Factory found this out when they discovered a certain popup’s conversion rate on blog posts was just 0.18% compared to 11% on product pages.
The difference came down to relevance. The offer was the same in both cases: a $10 discount on your first order for signing up for their email list. Their A/B testing confirmed the natural assumption that a discount popup will do better on a product page (where potential buyers hang out) than on a blog where visitors might just be looking for information.
Design with user experience in mind
Think of the whole visitor experience when you’re designing a popup. That’s how you achieve relevance. The best way to get them to take the journey from visitor to buyer is to consider what that path looks like for them. Then design with their perspective in mind.
If you’re promoting a product, for instance, share a discount code and get new customers to sign up with a lead gen (form) popup. If you’re having a sale, direct them to related sale items with a clickthrough popup. If you’re sharing a piece of content, either send them to a related piece of content that nudges them closer to becoming a customer—or send them to a product that’s mentioned or is particularly relevant.
Include a strong call to action
A call to action does exactly what the name suggests: it asks readers to do something.
The CTA is the focal point of a popup.
It should stand out, and what it’s asking visitors to do should be obvious—even if a visitor looks it for a split second. You only get one CTA per popup; there can’t be two offers. What’s the one action you want people to take?
A/B test your popups
Popups are one of the best places to A/B test your offers and messaging. Impressions will be quite high, and you only have a few elements to work with in most cases: Headlines, images, forms, and your CTA.
If you run an A/B test to compare two headlines and one far outperforms the other—not only will you be able to get more bang for your buck with that particular popup, but you may also have an insight you can carry forward to other landing pages or marketing materials.
Be respectful
Sure, popups sometimes get a bad rap. But if you follow the above tips and avoid making the mistakes below, you can make sure yours fall on the right side of popup history.
Confirm-shaming
The internet has a word for dissing people who don’t want your popup offer: confirm-shaming.
That’s when your opt-out option is something like, “No thanks, I like being broke and friendless,” or, “I don’t like saving money.” This snarky tactic might have been cute for the first company that used it, but now it’s so overplayed that there’s an entire Tumblr dedicated to examples of confirm-shaming in action.
Besides coming off as, at best, annoying, and, at worst, downright condescending, confirm-shaming can completely distract from your offer.
The value of a popup is that it allows your customers to take immediate action on something that can help and benefit them. Nothing should distract from that—especially not your attitude. A visitor not ready to buy today might be ready the next time they encounter your content, but not if their first encounter left them with a bad taste.
No exit option
Another issue we see too often is the popup that’s like an escape room. Clicking away from a popup should be simple and straightforward. The extra captive eyeballs you might gain by turning your ad into a click trap aren’t worth the resentment and frustration you’ll stir up. The worst part could be that people you trap with this kind of popup strategy may have been trying to close it so they spend more time browsing your site. Talk about a self-own.
Do unto others
When in doubt, stick to the golden rule: how would you like to experience a popup, especially one you’re not interested in?
Look at the nice example below. No attitude, no snottiness, just a simple “No, thank you.”
Collect data
A great thing about popups is that they can include all sorts of tracking technology that can give you insights into what’s working and what’s not—through insights like impressions, clicks, and conversion rates. Use that info to improve your offer and the design you use to present it.
That said, be deliberate when you’re testing. If you test a bunch of variables at once, you won’t know what’s working and what isn’t. Take testing one variable at a time. For example, testing the CTA and testing whether or not to have a popup triggered on exit are two different tests.
Target and Segment
Possibly the coolest thing about collecting data from your lead gen popups is that you can use it to create customer segments and Facebook “lookalike audiences” for social ad campaigns and other targeted advertising.
The popup and sticky bar builder allows you to trigger popups based on visitor behavior, like arriving at a page, exiting, or clicking a link. You can use advanced targeting features to talk to visitors based on their location or how they found your site (i.e., one popup for a visitor who followed a link in your newsletter and a different one for somebody who found you through social media).
Plus, dynamic text replacement (DTR) takes relevance to a whole other level by changing the text of your copy to match what customers are looking for based on data about their preferences.
Learn from others
Marketing and advertising pros collect “swipe files” of work they like. They use these examples to learn from and as inspiration for their own work. You can do this, too. Start taking note of popups you see online and screenshot the ones that grab your attention in the right way.
When you’re designing a popup, you don’t have to reinvent the wheel.
Study what works and make those elements your own by incorporating them into your design. If it catches your eye or gets you to click, the creator probably did something right.
If you’re building popups in Unbounce, we have a ton of templates that allow you to plug your offer into a format that works.
16 popup examples to inspire your next experiment
We gathered high-converting Unbounce customer popups and other examples from the World Wide Web to show that great popups come in all forms. We have ecommerce popup examples, lead generation popup examples, email popup examples—you name it, we pulled it.
Best popup examples from top brands
Let’s take a look at the types of popups brands you’re likely familiar with are using, and how they’re positioning their offers.
Most of these brands are likely getting hundreds of thousands of pageviews each month, so it’s safe to assume that plenty of A/B testing and analysis is happening to bet these decisions.
1. Blue Bottle Coffee
Blue Bottle Coffee—a coffee supplier with a subscription service—is using a simple time-based popup to collect emails
The overall layout and design is great. It’s clean and elegant, which lines up nicely with the overall feel of the rest of the website.
If we toss on our “critical eye” glasses, the offer itself could be stronger and the headline could be more compelling. Similar to the meal subscription companies, Blue Bottle Coffee likely gets a ton of repeat customers since the coffee supply always seems to be running low in pretty much every home or office (we feel that, big time). Leading with a hard-to-say-no-to offer to win first-time customers rather than just taking the free shipping “offer” approach could be a positive move.
2. HelloFresh
No meal subscription service bias here. When we check out HelloFresh as well, they’re also using popups to push their current best offer—$140 off and free breakfast items in the box.
They’re using a time-based popup:
As well as a floating bar (that isn’t sticky) when you close the first full-screen popup:
The combo approach can be a good one when done properly. You present the offer, then give visitors a chance to bring it back up if they declined at first but change their minds later.
If you test the combo approach though, we’d recommend keeping the messaging aligned across each popup. HelloFresh uses the same headline in both, but the supporting details are different. The floating bar says you get free shipping and has a countdown clock, both of which aren’t in the initial popup.
3. TOMS Shoes
TOMS Shoes is using a time-based popup with a gamified offer to add some spice to their welcome offer. After a few seconds, they show a “spin-to-save” popup that takes over the screen by darkening the background, meaning visitors need to do something with it.
Since the “ask” is virtually zero—no email form yet, just a fun button to click or a simple “No thanks” if you’re not interested—the click-through rate is likely sky high.
After you spin the wheel, you’ll see a second popup with an offer based on where the wheel landed and an email address field. Clean, simple, and effective.
4. GetResponse
This poor lil’ creature. This one is clear, creative, and very noticeable. Even if you bounced, you probably stopped for a second to figure out who or what that little guy is.
Notice even though the CTA isn’t on top—where you might expect to see the headline—it is the largest, hardest-to-miss text. CTA buttons are great because they put your CTA and your clickthrough function in one spot. No need for clutter or complication.
5. Chubbies
Who doesn’t want $10? This popup cuts right to the chase and uses an upfront offer to attract customers. Meanwhile, the body copy manages to keep it light and fun.
Notice that this popup appears on a product page. It’s not coming up on the blog, where a visitor might have just been browsing for an article about hoodies. Instead, it’s right on a page where a customer can take advantage of the discount and buy the hoodie.
6. Uncommon Goods
Some words never get old:
Let your visitors in on a secret guide or grant them membership to an exclusive club. Just be sure that what you’re offering is genuinely valuable and appealing. If you’re not careful, the secret club angle can come off like a sleazy magic trick. But done right, it’s a great way to generate curiosity.
7. Ulta Beauty
Did you know a popup doesn’t need to take up the whole screen or appear right in the middle of the screen?
A simple ‘pop under’ (we call ’em sticky bars) form like this one is like a gentle reminder to join a mailing list. This example appears on a product page, but a low-key popup off to the side or down at the bottom is ideally suited for a blog because something more in-your-face might interrupt someone in the middle of a sentence.
8. MarketMuse
Across their blog posts, MarketMuse is using a scroll-triggered popup to promote a webinar they’re running.
It’s non-intrusive, includes a clear “X” to close it, and has one main CTA.
If we were chasing perfection here, the headline copy could be clearer about what the webinar will cover. It’s clever and uses visual hierarchy well to present itself as the obvious first thing to read, but it doesn’t exactly speak to the webinar’s topic and why you should attend. It’s still a solid, simple popup that you can replicate.
9. ClickUp
ClickUp is a productivity tool that competes with alternatives in the space like Monday.com, Asana, and others.
They’ve published a bunch of competitor comparison pages to position themselves against each of those alternatives. On these pages, they’re using a scroll-trigger chat popup to try to get you in touch with their sales team.
One simple (but still noteworthy) element here—check out the primary headline they’re using.
“Looking to compare your options?”
It’s tailored directly to the page the visitor is currently on.
They could’ve easily just blasted the same chatbot popup with the same basic “we’re great!” headline and moved on to the next project, but they didn’t. While we can’t peek behind the curtain to see their actual performance data, it’s safe to say this customized headline will lead to more actions than the alternative would’ve.
10. Blue Apron
Blue Apron knows that once they can get a potential customer over the first hurdle of getting started with their meal subscription service, the likelihood of repeat purchases skyrockets.
So they’re using a sticky bar right from the homepage to put their best offer (65% off your first five weeks) front and center.
It’s a great hook and the sticky bar is simple yet high-contrast enough to get noticed. Popup banner design often comes down to keeping things clearly visible without feeling intrusive or annoying. They nailed it here.
When you click “REEDEM OFFER” you’re dropped right into their guided signup flow, meaning no matter where you are on their website—you’re always one click away from what’s likely their most valuable page.
Popups built with Unbounce
The following popups were all built directly inside Unbounce. When you’re ready to get started, there’s a template with your name on it.
11. National Sewing Circle
National Sewing Circle is an online platform for sewing instruction and ideas. Their subscription-based business trades information, community collaboration, and resources for avid sewers (or those who want to become one), making their popup especially clever.
With agency TN Marketing, they created an offer of a $40 sewing gift simply for signing up for their newsletter—which works as a lead nurturing strategy to eventually nudge subscribers toward signing up. Stating the dollar amount given in return for an email address clarifies the value, allowing the newsletter to show the value of a full NSC membership over time. So far, this popup has converted 29% of traffic and over 70,000 visitors—and the circle continues to expand!
12. Regiondo
Regiondo is an activity booking software for facilitating, managing, and promoting ticket sales. Their software is robust in functionality and can be used by a range of people in a number of industries, making product information and education a key conversion driver.
This simple, no-frills popup to book a product demonstration gets visitors in the door and connected with a Regiondo team member while they may still be in the browsing or “evaluation” phase. It’s a great example of “well-designed” applying to functionality over flare—a clean, direct popup targeted to the businesses and professionals their services are for.
13. HiMama
HiMama is a childcare app that streamlines childcare center management, parent communication, documentation, and administrative reporting, and streamlining is exactly what their popup does, too—effectively enough to convert 40% of multiple thousands of visitors. Yowza.
Because HiMama can be used for a variety of reasons, and by people in many different roles within the childcare industry, they’ve created a self-segmenting popup that helps them best tend to visitors enquiring about the platform. Contrasting colors, benefits-focused messaging, and straightforward calls to action lead visitors to individual SaaS landing pages targeted specifically to them. Kind of like a choose-your-own-adventure that ends with everybody happy.
14. Sulky
Sulky is a high-quality thread and stabilizer company that ships all over the world. They have a huge inventory of products and know that people who land on their website are there for a reason—they’ve searched for thread suppliers, clicked on an ad, or were referred—and are ready to browse, if not already primed to buy.
Placing a 15% off coupon right on their homepage is a smart way to incentivize a purchase and show appreciation to visitors before they’ve even become customers. The popup’s imagery and messaging are fun, eye-catching, and even a bit silly—in a good way! It makes for a warm, friendly invitation that’s bang-on brand and nearly impossible to refuse.
15. Wealthify
Wealthify is a lead generation service for mortgage brokers and financial planners in Australia. They turned to growth marketing agency Webbuzz to help get them more leads for potential customers. To do this, they took a softer approach that’s paid off with a steady 19% conversion rate.
“It’s been so successful that we have used the ‘info pack’ popup on other client sites,” says Ben Carew, Webbuzz’s Director of SEO Service and Analytics.
By offering an information package to learn more about Wealthify, a bulleted rundown of what’s included, and a one-field entry to sign up, they’ve made it a no-brainer trade for a visitor’s email. The clever graphics, bolded information, and clear call to action don’t hurt either!
16. Energy Locals
Energy Locals is an Australian energy retailer that provides clean, environmentally-friendly energy in an affordable way. Their service is location-specific and has a higher barrier to conversion than, say, buying a pair of pants, so they’ve given visitors a direct line to their 100%-local team should they have any questions or need more information.
Bright colors and minimal form fields make the popup easy to spot and easy to fill out. The drop-down menu for when to call is a nice touch to let visitors feel in control as well, and know that their time is respected. At a 61% conversion rate, the proof is in the popup pudding.
How to analyze and adjust your popups based on results
What exactly you measure to analyze performance will depend on the type of popup you’re using and the type of offer you’re promoting.
Generally speaking, pay close attention to the following metrics especially:
- Popup views: Total number of times the popup is viewed. You’ll use this across most of the other metrics below to measure percentages.
- Conversion rate: Percentage of visitors who take the desired action (e.g., sign up, purchase) after seeing the popup.
- Click-through rate (CTR): Ratio of clicks to views on the popup. High CTR indicates compelling content or offers.
- Bounce rate: Percentage of visitors who leave the site immediately after viewing the popup. High bounce rates may suggest the popup is intrusive or irrelevant.
- Time on page: Average time spent on the page after interacting with the popup. Longer times can indicate engaging content.
- Exit rate: The percentage of visitors who leave after seeing the popup. This is different from bounce rate as it’s not limited to only one-page visits.
- View depth: Number of pages viewed after interacting with the popup. More pages suggest higher engagement.
- A/B testing results: Comparing different versions of popups to see which performs better in terms of conversions, CTR, etc.
- Lead quality: Assess the quality of leads generated through the popup, considering factors like lead score, follow-up interactions, or conversion to paying customers.
For metrics that focus on user experience or engagement after the popup is shown, the best way to analyze the data is through segmentation.
Split your data into two buckets:
- Bucket A: Saw the popup
- Bucket B: Did not see the popup
To put it as simply as possible, you want Bucket A to outperform Bucket B. Ideally when your popup is shown, visitors stay on the site longer, view more pages, convert at a higher rate, and become higher quality leads.
The do’s and don’ts of popups
Now that we’ve covered what elements make up a great popup and run through some real, live examples, let’s narrow down the “rules” we’d recommend you follow.
DON’T rely on confirm-shaming to boost conversions
The juice just isn’t worth the squeeze.
If you think driving 0.01% more conversions by making your visitors feel bad about themselves when they click the “no thank you” option on your popup is a net positive, trust us—it just isn’t. Risking your brand’s reputation just to get a few extra clicks is never a trade we recommend making.
DON’T stack multiple popups together on one page
Popups have long gotten a bad reputation for being intrusive, annoying, and hard to escape. One major element to this reputation comes from stacking popups back-to-back-to-back-to-back-to—you get the point.
When there’s no escape, your conversion chances are zero.
Sometimes these are shady practices sleazy marketers deploy on purpose, but this never-ending loop of popups can also happen accidentally if you aren’t careful.
It’s far too easy to launch an exit intent popup, a time-based popup, a scroll-based popup, a sitewide sticky bar popup, and a chatbot popup… Then, have every single one of them triggered on the same page at the same time.
DON’T default to popups for every CTA on your website
With great power comes great responsibility, young grasshopper.
Popups are a powerful tool, but also one you should use sparingly. Every single page doesn’t need multiple popups, sticky bars, chatbots, and click-based popups. You can still use traditional inline CTAs to drive conversions without constantly relying on popups.
DO tailor your popup messaging to the page and the visitor
Here’s a simple mantra we live by:
The right message for the right audience at the right time.
Generic popups lead to generic results. You’ve likely heard the saying before—if you’re targeting everybody, you’re targeting nobody. This concept applies just as much to popups as any other form of marketing.
Popups that feel relevant and timely are the best performers. The simplest way to make your popups feel relevant and timely is to customize who sees which popups, and which messages those popups contain, based on the individual visitor.
Dynamic text replacement in Unbounce is a game changer for doing exactly this.
