Feedback

Why Pop-ups Are Ruining the User Experience

#Design & UX

17th October 2019

Popups are the most hated feature of websites. This has consistently been the case for at least a decade now, so the question is – can we turn it around? Can you implement a popup that won’t hurt the user experience? The answer is both yes and no. The animosity towards popups is deeply engraved in people’s minds. However, certain design and feature choices can help you salvage some of their usability.

Actually, let’s reiterate the first sentence of this article.

People don’t hate pop-ups – they hate how pop-ups are executed.

Most of them interrupt the user journey, appear at the wrong time and distract the visitors.

Third-party services have made it incredibly easy to create a pop-up, which led to more and more inexperienced people using them on websites. They’ve accustomed visitors to bad pop-up experiences. It has been going on for years and it’s hard to turn it around.

It’s become a habit for the visitors to dismiss intrusive pop-ups. And quite frankly, you can’t blame them.

But before we tell you why this happens and how to make the most out of your pop-ups, we’ll need a little bit of context.

Pop-up types

We can single out four general pop-up characteristics:

  1. Modal – one of the culprits of the animosity towards pop-ups. Modal pop-ups are ones that block the user from interacting with the content of the website until he dismisses the pop-up.
  2. Nonmodal
  3. Lightbox – pop-ups that don’t use dimmed background, meaning the content appears “as is” to the visitor, even though there is an overlay on their screen.
  4. Dimmed – dimmed pop-ups disrupt the visual appearance of the website but not only displaying an overlay but also “hiding” the body of the site.

If you think about some of the pop-ups you’ve encountered recently, you’ll find out that modal and dimmed ones were the most annoying. Unfortunately, they aren’t necessarily losing popularity among website owners and designers.

Common pop-up issues

When researching the examples for this article, queries like “block pop-ups”, “pop-up blocker chrome” or “allow pop-ups” were some of the most popular ones. They illustrate the problem perfectly.

People search for ways to disable pop-ups all the time. Alternatively, they want to enable them again, which means something prompted them to block pop-ups in the first place.

Intrusive nature

The idea of pop-ups is intrusive enough. If you consider they can be modal and dimmed on top of that, it becomes unbearable.

Modal cookie consent popup used on Mashable's website.
Mashable doesn’t have a good track record of using pop-ups. Currently, they use a slightly dimmed and modal cookie consent pop-up.

It’s almost as if you’ve opened a new tab in the visitor’s browser without their consent. The path to close a pop-up is slightly shorter, but the concept is virtually the same. You’ve interrupted their interaction with your website.

Considering an average session duration on websites is between one and three minutes, the traditional pop-up display is unacceptable. You’re definitely familiar with retail employees approaching you at the store.

They have good intentions (and your pop-up might too), but more often than not it’s an interruption to which you reply “no, thanks”.

Of course, there are exceptions. One of our clients has an average session duration of over 7 minutes in 2019 so far. This gives them much more time to show a pop-up at a reasonable time. But for most websites, full-blown overlays are not only intrusive, but it’s almost never a good time to show them.

Displaying a pop-up before an interaction

This issue is more common than you might think. Many websites display a pop-up when the visitor has just visited the website – sometimes even asking for personal details already.

Mashable using a Chrome notifications popups before users have the chance to interact with the site.
To make things even worse, right after accepting the cookies Mashable asked us if we want to receive notifications in our browser. Two strikes in quick succession.

They didn’t even get time to get to know your business. Whether you’re asking them to sign up to a newsletter or offering a discount, 30 seconds in they haven’t consumed any content yet nor had the ability to browse your store. That pop-up is not only deemed to fail, it will also annoy the visitor.

They feel like advertisements

Here at Nerd Cow, we’re advocates for the content-first approach. Writing for the Web is much different from traditional marketing. Most pop-ups are created by marketing teams struggling to truly understand the difference.

Your visitors can’t feel like your selling to them, rather than solving their problems. Especially if it’s an unwanted interaction, such as an intrusive pop-up.

Nowadays people understand that an email offer isn’t a really a “free” gift. It doesn’t mean they’re not willing to “pay”, though. But if the first thing they see on your website requires payment and it isn’t something they wanted, you can imagine how they’ll feel.

Which pop-ups should you avoid?

Here’s a list of the worst pop-up practices:

  • modal, dimmed, and the combination of the two
  • pop-ups interrupting user journey, i.e. right after logging in or before any interaction
  • forcing medium change, i.e. asking the visitor to download your app rather than showcasing its advantages as a better alternative
  • showing multiple pop-ups in quick succession

Best pop-up practices

Pop-ups aren’t doomed just yet. It will take a collective effort of web agencies and website managers to revert the damage that has been done over the years, but good pop-ups can still deliver results.

And it’s easier than you may think:

  • Keep them relevant – websites were always about the user experience. Make sure your pop-up, its design and copy are consistent with the current page.
  • Give value to the visitors – after ensuring it’s relevant to the context, give your visitors value before asking for personal data.
  • Be mindful of screen space – make sure your pop-ups are not getting in the way of your visitors, especially on mobile devices. Opt for smaller, modal tooltips rather than full-blow overlays.
  • Don’t show multiple pop-ups – ideally at all. If you absolutely need to, make sure they aren’t showing up at the same time. Exit-intent pop-ups can be an example of a secondary pop-up.

Don’t assume you need a pop-up

You really don’t. Your visitors are being attacked by them on most websites already. They’ll be relieved.

Think of alternative methods. Test, test, test. You might find that your pop-ups are great. But never assume they are. Just because everyone is doing it doesn’t mean you have to follow the crowd.

Here’s What You Should Do Next

If you’d like us to work on your website to increase your profits, please get in touch. No matter where you are in the world.

Talk to us

If you are a little unusure whether we are a good fit for each other, head over to this page to learn about our typical clients.

See who we work with