Believe it or not, popups don’t exist just to be annoying.
They are actually a very powerful way to encourage users to perform a certain action or pay attention to something that will lead to conversion. But before we dive into that, let’s get the basics down.
Popups are the boxes that pop up on your screen when you enter a page on an app or website. They temporarily block the content you intend to access and are paired with a call-to-action to get you to do or pay attention to something.
This CTA can range from inviting you to subscribe to their newsletters, sign up for membership, or check out an event that’s currently taking place. In other words, they intend to direct your focus towards something and trigger a certain action or behavior.
A popup trigger basically controls when a popup opens on a page. Here’s a simple breakdown of some of the most common triggers available by off-the-shelf popup makers and the uses they’re most well suited for.
This trigger opens a popup after a set amount of time has passed. For example, a popup that appears 3 seconds after a user enters a website’s home page.
This is the most popular out of all triggers. Popups that use this trigger are commonly seen on e-commerce websites and apps during flash sales or seasonal offers, as well as most websites that push for newsletter subscriptions.
Behavior simply refers to any action a user performs on a platform. For example, popups with behavior-based triggers can be conditioned to open when a user:
• Clicks on certain elements on a page (buttons, links, images, text, etc)
• Scrolls a certain distance down a page
• Visits a specific number of pages
These types of triggers are great for a big variety of uses, the most common being to let users view details of an item or play media on a popup without needing them to leave a page.
Popups with these triggers open when a visitor attempts to leave a page, prompting them with a customizable message.
On desktop browsers, these triggers can operate with soft exit detection technology to trigger a popup when the user’s cursor leaves a page. Hard exit prevention can also be used to trigger a popup when the user refreshes the page, closes the tab, or hits the back button.
These triggers are effective for prompting users to think again before they abandon a site. For example, showing users a popup that says “Are you sure you want to abandon your shopping cart?” before they leave a checkout page can quickly get them to reconsider.
While it’s true that 80% of the time website visitors would immediately look for the tiny ‘X’ to get rid of a popup, when done in a way that hits all the right spots, popups can do wonders for conversion.
Think of them as a quick sales pitch — Since the content on the page is blocked by the popup, you’ve got a few seconds of your visitor’s undivided attention. Can you get them to do what you want them to do in those few seconds?
Popups aren’t the time and place for long eloquent copy. Remember, you’ve only got a few seconds to get your point across.
If you’re trying to get visitors to checkout with a discount code, you might want to only highlight the discount percentage, discount code, a simple CTA, and important details like the validity period to spark a sense of urgency.
Upon entry, visitors who access ShopBack on Google Chrome will get a popup that encourages them to add the ShopBack button extension to their browser.
This popup gets to the point by telling users what the extension can do — automatically find and apply cashbacks and coupons. They also make it clear that getting this button only takes 2 clicks, and pair the message with simple graphics that are easy to understand.
Within 3 sentences and an image, the idea is sold. That’s how you get to the point.
Prevent your popups from looking like spam. Make sure they look like they’re part of your brand by using colors, fonts, and graphics that are cohesive with the rest of your platform.
Shopee’s 12.12 sale popup is a great example of cohesive design that helps accentuate and draw attention to the main message.
Getting straight to the point, the popup highlights “No Min. Spend” followed by “Free Delivery” with the same clear and bold typefaces used throughout their website, against their signature orange and blue accents.
The simplicity of the popup layout also prevents information overload. By keeping the design clean and simple, there’s less room for confusion and more room for the main message to stand out.
Lastly, make sure the exit door is easy to find. Don’t try to hide the ‘X’ button to “trap” your visitors. That won’t make them want to click on your CTA more. In fact, they might even get frustrated with your platform.
Respecting their choice to say No will leave a better impression on them than if you force them to say Yes, and that’s what you should aim for — users who voluntarily choose you.
This also means you shouldn’t suffocate returning users with the same popup every time they enter your app or platform. Give them space to breathe and chances are they’ll have a better experience on your platform.
If you need help exploring all your options with popups and other features for your app or website, getting in touch with an experienced team might be a good alternative.
Snappymob is an expert web and app development agency that prioritizes user experience in product design. If you’re thinking of enhancing your business with great digital products, feel free to talk to us!
Snappymob is a passionate web and mobile app developer based in Kuala Lumpur, Malaysia. We have designed and developed awesome web and mobile applications for industries and companies around the globe.
We love our craft — the design, development, and the business of apps and this blog is our outlet for discussing what we think and sharing what we know with our community.