Getsitecontrol Insider

8 Ways to Optimize Design of Your Website Popups

April 24, 2020 Episode 16
Getsitecontrol Insider
8 Ways to Optimize Design of Your Website Popups
Chapters
00:01:03
Make sure the popup matches the rest of your site
00:01:40
Have a clear call to action
00:02:31
Use contrasting colors for your call-to-action button
00:03:04
Experiment with different formats
00:03:31
Use microcopy to allay fears
00:04:04
Remember about mobile audience (and treat it differently)
00:04:58
Aim for personalization when possible
00:05:27
Play around with the timing
Getsitecontrol Insider
8 Ways to Optimize Design of Your Website Popups
Apr 24, 2020 Episode 16

Not all website popups are created equal. And there's a big difference in performance between an optimized popup design and an unoptimized one.

Obviously, you want your popups to be one of the former.

So, let’s go ahead and talk about the tips for designing better popups for your website using Getsitecontrol.

Prefer reading a blog post version of this episode with real-life examples?
Check it out here.

Need inspiration?
See how your favorite businesses use website popups to grow!
Learn from the experience of The New York Times, Nike, Reebok, The Guardian, Tiffany & Co, Marie Claire, Intercom, Ahrefs, and other amazing companies worth looking up to.

Show Notes Transcript Chapter Markers

Not all website popups are created equal. And there's a big difference in performance between an optimized popup design and an unoptimized one.

Obviously, you want your popups to be one of the former.

So, let’s go ahead and talk about the tips for designing better popups for your website using Getsitecontrol.

Prefer reading a blog post version of this episode with real-life examples?
Check it out here.

Need inspiration?
See how your favorite businesses use website popups to grow!
Learn from the experience of The New York Times, Nike, Reebok, The Guardian, Tiffany & Co, Marie Claire, Intercom, Ahrefs, and other amazing companies worth looking up to.

Speaker 1:

Hi! You’re listening to Getsitecontrol Insider – the podcast where we share tactics for optimizing website conversion rates.

:

In this episode, we’ll cover 8 tips to turn website popups into conversion boosters. Wondering what a perfect popup should look like? Stay tuned to find out.

:

Love them or hate them, popups work wonders – but that’s only IF you use them right. They can help you grow email lists, promote offers, and just generally drive people towards performing important actions at your site. Not all popups are created equal, though. And there's a big difference in performance between an optimized popup design and an unoptimized one.

:

Obviously, you want your popups to be one of the former. So, let’s go ahead and review the tips for creating better popups for your website using Getsitecontrol. Beyond the design and content, we'll also delve into some other relevant areas, like when and where you display your popups. Let’s dive right in.

:

Tip#1. Make sure the popup matches the rest of your site When you design your popup, you want it to feel like it's a part of your site, rather than an intrusion. To achieve that, make sure to match the style, colors, and typography of the rest of your site. That way, when your popup does appear, it will feel like part of the experience, rather than an outside force inserting itself into your site. Using the Appearance tab in the Getsitecontrol popup builder, you’ll be able to tweak all these design elements even if you’re a complete non-techie.

:

Tip #2. Have a clear call to action You're probably displaying a popup on your site because you want your visitors to do “something”. That “something” could be signing up to your email list, checking out a special offer, participating in a survey, or anything else. To drive people towards performing that action, you want to have a single button with a strong call to action (CTA). For an email newsletter popup, a common example is “Subscribe”. It's short, simple, and tells visitors exactly what to do (and what's going to happen). Don't be afraid to get a little bit more creative, though. For example, instead of “Subscribe” you can put “Join the list” or “Get weekly updates”. And if you're using popups to drive traffic to a sale on your website, something like “Get discount” is more enticing than “Visit sale” because in the end everyone wants a discount, right?

:

Tip #3. Use contrasting colors for your call-to-action button A compelling CTA isn't just about the text, it's also about grabbing your visitors' attention in other ways. Namely, color. You want to use a color that contrasts with the rest of your popup to specifically draw visitors' eyeballs right to the button that you want them to click. Want to go the extra mile? Pick a color that would draw attention while still matching the rest of the site theme. This way, you’ll make the popup look even more coherent.

:

Tip #4. Experiment with different formats When you hear the word “popup”, the first thing that comes to mind is probably one of those modal popups that appear and take over your screen until you click a button. While fullscreen and modal popups are a thing, you shouldn’t be afraid to experiment with less intrusive methods. For example, you can try floating bars or slide-ins to still drive action without requiring a modal interaction.

:

Tip #5. Use microcopy to allay fears Microcopy is a small, unobtrusive piece of text near your CTA button that allays the fears some people might have of interacting with your popup. For example, if you have an email lead generation popup, a natural fear that most people will have is “I don't want to get spam emails”. Using microcopy, you can eliminate those fears by saying something like “We won't ever share your email and we'll only send you X emails per week”. That way, people know exactly what they're getting into.

:

Tip #6. Remember about mobile audience (and treat it differently) Nowadays, web traffic is split about 50/50 between desktop and mobile visitors. When you're designing popups, though, it's easy to forget about that and just focus on the desktop experience of your popups. Use the mobile view tab when you create a popup to adjust its appearance for smaller screens and make sure your mobile visitors have a great experience too. For instance, for the mobile version of your popups, you can change the size, the image and its position. As a rule, if you’re creating a modal popup for desktop screens, on mobile, you'll want to consider a less obtrusive implementation. Like a slide-in or a sticky bar, for example. Remember, not only are modal popups tough for people to interact with on touch devices, but Google also rolled out a penalty on aggressive mobile interstitials back in 2017. Tip.

:

#7. Aim for personalization when possible Personalization is the idea of matching your popup's content to the content on the page on which it displays. So rather than having one sitewide popup, you might want to create different popups, each tailored toward a specific part of your site or category of content. While this does require a little more upfront work, it can pay dividends because your visitors are more likely to engage with a personalized offer.

:

Tip #8. Play around with the timing Finally, while timing isn't a part of popup design from an aesthetic perspective, it's still an important part of creating an effective website popup. Rather than displaying your call to action right away, you can experiment with various delays and triggers.

:

For instance, Getsitecontrol allows you to display popups once a visitor has scrolled to a certain depth on the page, spent a certain amount of time on your website or visited a certain number of pages. You can also display popups at exit intent or upon clicks. The point is, if you wait until visitors are engaged to ask for their email address for example, there's a better chance that a visitor will be willing to subscribe. Now that you've got your dose of popup design inspiration, go ahead and try creating one! Visit getsitecontrol.com and give it a spin for free. You’ll be able to easily build popups for growing your email list, promoting offers, surveying visitors, and a lot more. Don’t forget to subscribe for our weekly marketing tips and follow us on Twitter! Thank you for listening, Until next time!

Make sure the popup matches the rest of your site
Have a clear call to action
Use contrasting colors for your call-to-action button
Experiment with different formats
Use microcopy to allay fears
Remember about mobile audience (and treat it differently)
Aim for personalization when possible
Play around with the timing