Automattic/newspack-popups

Overlay prompt: Allow for single click on article link to dismiss

Opened this issue · 8 comments

For a smaller overlay prompt without a dismiss button, the reader has to click twice to navigate to a story from a page that displays the prompt: once to dismiss the prompt and then again to trigger the link to the story. That makes for clunky UX. Here's an example:

Screen Shot on 2021-12-31 at 12-03-42

That prompt doesn't actually require that I engage directly. So as a reader, I'm inclined to ignore it if I don't choose to sign up, thinking that if I click a story link, that will simply get me where I aim to go. As it is now, I have to click twice on the story link to get there. Most won't understand why and will be confused, perhaps even choosing not to click a second time.

Can we add an option to combine the click away with a click on the story for overlay prompts?

I can definitely see this being confusing for any of the overlays that are not the full-screen really in your face ones. Maybe the default behavior should be different for those vs things like these bottom corner ones that only take up a small portion of the available screen real estate and where a user would expect to still be able to interact with the primary page content without having to dismiss the overlay.

Adding this to milestone 2 since we'll be designing new overlay templates and can likely just factor this into that process

dkoo commented

Would another possible solution be to make it so that if your overlay prompt has a 0% opacity on its "overlay" background, clicks pass through it? Or to make that even more explicit by adding an option to not have a full-screen overlay at all, so that the site can be interacted with underneath the still-open prompt?

see also #849.

@dkoo that solution would probably work in addition to the click on any non-overlay element dismissing the overlay. So if you have an overlay with 0% opacity on the background, a click outside of the overlay (on a link in the article, for example) would still work as expected and the overlay would be dismissed (which would probably be true anyway since they'd be going to a new page...i think?)

dkoo commented

a click outside of the overlay (on a link in the article, for example) would still work as expected and the overlay would be dismissed (which would probably be true anyway since they'd be going to a new page...i think?)

Right, what I'm suggesting is that visible elements underneath the non-content part of the overlay are still interactive, so clicking a link once would navigate to that page. This would result in a dismissal of the prompt based on frequency (once per session or once per day).

Update: Since removing "click to close" because of ease of dismissal on mobile, we may have inadvertently revived this particular issue for desktop users.

Specifically, CT Mirror has requested the ability to have their small corner overlay prompt dismiss-able by clicking on-screen outside of the prompt, which led to an internal discussion (between myself @tmmbecker, @dkoo, Steve Beatty, @margaretschneider) of how best to improve this.

Possible solutions: Enable click to close for desktop only, optionally enable for desktop with a prompt setting (per Kyle @ CT Mirror), or escape key to close.

This functionality was added with Reader Activation and then removed because it was too easy to dismiss via tap on mobile. Some added thoughts that came up:

We could add the ESC button to dismiss, and maybe allow desktop users to dismiss by clicking the overlay (but not on mobile).