Most DTC brands design their popup on a 27-inch monitor. They publish it. They never open it on a phone.

That’s the whole problem right there.

Your visitors aren’t on a laptop.

They’re on a phone, commuting, half-paying attention, one thumb scrolling.

And the popup you spent an afternoon perfecting on a big screen?

It might look completely broken on a 6-inch one — text wrapping weird, buttons too small to tap, close button so tiny you’d need a toothpick.

This issue is about the three mobile design rules that separate popups that actually convert from popups that just get closed.

Each one is fixable in under an hour.

You just have to know what you’re looking for.

Oh, and I've got a free Mobile Popup Fix Brief for you at the end—don't miss it.

OK, let’s get into it.

~

Rule 1: Your CTA button needs to be big enough to tap with a thumb — not a stylus

Why this keeps getting ignored

Designers work at their desks. Visitors shop on their phones.

It’s a completely different interaction model, and most popup builders default to whatever looks good on a desktop preview.

The result is a CTA button that’s too short — somewhere around 30–35px tall — which sounds fine until someone with a normal-sized thumb tries to tap it twice before it registers.

​Apple’s Human Interface Guidelines have recommended a minimum 44×44px touch target since the original iPhone.

That’s not a new standard.

It’s been sitting there for almost 20 years and DTC brands are still shipping 30px submit buttons.

Here’s the behavior that kills you: the visitor taps the button, misses, and interprets it as a broken site experience.

Not a small button.

A broken site.

They close the popup.

Depending on your trigger settings, it won’t show again.

One missed tap.

One lost subscriber.

Here’s how I’d fix it

Open your popup on your actual phone — not the preview, not mobile emulation — and try to tap your CTA button with your thumb while holding the phone naturally.

If you aim carefully before tapping, the button is too small.

Set your CTA button height to at least 44px.

Make the button full-width or close to it.

The tap surface should be impossible to miss.

While you’re there, check the close button too — it needs the same treatment, and it needs to be positioned well away from the CTA so a misfire doesn’t accidentally subscribe someone who was trying to leave.

~

Rule 2: Your popup width shouldn’t go edge to edge on mobile

The full-screen popup problem

A popup that fills the entire screen on mobile doesn’t feel like a popup — it feels like a takeover.

This matters more than it sounds.

When a visitor sees your popup, a subconscious UX signal fires: “Can I close this?”

A small border on the sides tells them yes, this is a contained element, and I’m still in control.

A full-width edge-to-edge popup doesn’t give that signal.

It feels like the page broke.

And a visitor who feels trapped either rage-taps to find the close button or closes the tab entirely.

As a consumer, I’ve been there.

The fix isn’t making the popup smaller in a way that cuts off your copy.

It’s a layout decision.

Here’s how I’d fix it

Set your popup width to 85–90% of screen width, not 100%.

That 10–15% margin on the sides is doing real psychological work.

It signals “this is something you can dismiss” rather than “you’re stuck here.”

While you’re at it, check that you’re using a single-column layout inside the popup.

Two columns on mobile means two cramped columns — and cramped layouts feel broken even when they technically work.

Stack everything vertically: headline, body copy, form field, CTA button.

That’s the order.

That’s the structure.

Don’t make the visitor’s eye work to figure out where to go next.

~

Rule 3: Mobile and desktop visitors shouldn’t see your popup at the same time

The same trigger on every device

Here’s a setup that’s nearly universal on DTC sites: the popup fires five seconds after page load, on every device, every visit.

On desktop, a five-second delay is just obnoxious.

The visitor opened the page on purpose, they have a mouse, and time-based triggers have a long track record.

On mobile, the behavior is completely different.

Visitors scroll immediately.

They’re evaluating.

Five seconds in, they haven’t even seen your product yet — and your popup fires.

The result is an interruption that lands before any interest has formed.

No interest means no reason to give up an email address.

The popup gets closed, the trigger sets a cookie, and that visitor is gone.

Scroll-depth triggers fix this on mobile.

They fire the popup after the visitor has demonstrated actual engagement — scrolled to 50% of the page, seen your product, started forming an opinion.

That’s a meaningfully different visitor than one who got interrupted 5 seconds in.

Here’s how I’d fix it

Most popup tools — Klaviyo, Privy, Omnisend, Justuno — let you set separate trigger conditions for mobile and desktop.

Use it.

Set desktop to your current time-based trigger if it’s working.

Set mobile to a scroll-depth trigger at somewhere between 40–60% of page depth.

Test both.

The mobile visitors who make it to 50% scroll are telling you something.

Your popup should meet them there, not interrupt them before they’ve decided if they care.

~

Three things to take from this

Here are the brand-agnostic lessons from all three rules — applicable to any DTC popup, any category.

1. Touch targets are conversion infrastructure. A button that’s hard to tap isn’t a minor inconvenience — it’s a broken experience. Visitors blame the site, not their fingers.
   ​
2. Width signals trust. A popup that leaves breathing room around the edges communicates respect for the visitor’s attention. A full-screen popup communicates urgency that most visitors aren’t willing to meet.
   ​
3. Timing should match intent, not a timer. The best moment to interrupt a mobile visitor isn’t after a fixed number of seconds — it’s after they’ve shown you they’re interested. Scroll depth is a proxy for interest. Time isn’t.

Most popup problems aren’t copy problems.

They’re not offer problems either.

They’re design and timing problems that nobody caught because the person who built the popup never opened it on their phone.

Pull yours up right now.

Tap the CTA with your thumb.

See what happens.

If you want a one-page doc to fill out and hand to your dev, I put one together.

→ Click here to grab the free Mobile Popup Fix Brief​

Until next time, see ya!

Gannon