How do the Notifications Appear on Mobile Devices?
Used by more than 8 percent of top websites, web push notifications are a widespread and effective communication channel. These messages offer a critical mechanism for websites to reach their users with timely and personalized messages.
Web push are used by companies with websites desiring to connect with users to drive greater engagement and conversions as well as to improve the digital user experience —even after a user has left their website.
These messages are displayed on a visitor’s desktop, tablet, or mobile device when they have their web browser open. When a user clicks on a web push notification, they are sent to a URL the company has defined. When displayed on desktop, web push notifications appear as a popup on the side of a user’s screen and are also stored in a computer’s notification center. On mobile devices, these notifications appear similarly.
Getting Users to Engage on Mobile
Web notifications are sent via a web browser to user’s device. Because web push are sent through a web browser, they cannot be seen by a user unless their browser is open. Mobile push notifications take a different path to delivery than web notifications, as they are sent directly to a device’s operating system (iOS, Android) and are contingent on your company having a mobile application. Mobile push notifications are only viewable on a mobile device, whereas web push notifications can be transmitted via desktop or mobile. However, unlike mobile push notifications, which are delivered to a user’s lock screen regardless of whether they’re active, web push notifications are only seen by users who are currently active on the device In question. Nonetheless, they are a critical way of reengaging users who are active on the device, but may be engaged with or distracted by another activity.
In order to begin sending web notifications, companies must first integrate with a web push service. Generally, companies choose a third-party notification provider to do so. Sending these messages is supported by popular browsers such as Chrome, Firefox, Edge, Opera, and more. The appearance of web push differs across browsers. Some allow more freedom to include images and other elements.
How Does Opt-In Permission Work?
The web push channel is already supported by Android mobile devices, and it’s in the works for iOS devices. Some browsers that currently support mobile push notifications include Chrome and Firefox on OS, Windows, OS X, Safari on OS X, and more.
The protocol for subscribing to mobile web push on supported browsers is the same as it would be for desktop web push, aside from minor differences in the following:
- How custom web permission prompts are displayed
- How the native browser permission prompt displays — it takes up the full screen on mobile
Steps to Send Notifications from Web to Mobile
How to Subscribe
In order for users to actually receive these alerts via their mobile browsers, they must first give their permission to receive your mobile web push communications. Companies can request permission through a brower’s native permission prompt, which appears immediately when users click onto your site.
Delaying the Native Permission Prompt
However, if you’re hoping to be more strategic and tactical in gaining subscribers, you may decide to delay this permission request in order to first demonstrate the value of this channel before users must make their decision.
As such, we recommend that your site adopts a two-step prompting process, if you don’t already have one in place. Doing so will allow you to control the conversation with users before the native prompt comes up. As with any opt-in approach, you want to provide context before making the ask for an opt in.
To leverage a two-step prompting protocol, you’ll first need to implement a soft prompt. A soft prompt displays before the native browser prompt to further convey the value of subscribing to notifications.
Web Push Prompts Types
Here are some types of web push prompts that are available to you through an effective web push service and how they work:
Bell Prompt- a small widget in the bottom corner of your site that brings up the Native Browser Prompt
Native Prompt—the generic prompt for web push subscription; non-customizable
Custom Link— provides prompting for push notification permissions through a link or button you can place anywhere on your site
Slide Down Prompt- customize image, button text, and timing of prompt
Category Slide Down - slide prompt that allows subscribers to opt in or out of notification categories; gives users content that’s relevant to them
What are the Elements of a Web Push Notification?
Web push notifications often include a title, body content, a notification URL, a banner image, a browser icon, the web domain, and action buttons. These messages appear differently across operating systems and browsers. Although these notifications are small in size and content, brands put thought into their notification strategy to convey the right message, visuals, and calls-to-action (CTA’s) at the right moment in time.
Should I Delay Permissions?
If you’re in a high growth phase and are looking for subscribers, there may be less of a reason for you to delay the Native Permission Prompt. However, if you’re a larger company with a substantial userbase, you can be more selective and strategic in building your subscriber list.
If you decide to delay your opt in, you should use this time to showcase your top features and products. Make sure to include a compelling reason for users to subscribe, such as receiving breaking news headlines from your news site.
In addition, make sure to prompt your users at a relevant time, optimizing for their timezone and typical usage patterns. You can also base your timing off of their on-site behavior, like page time or number of pages browsed.
Delaying the web push permission prompt until a visitor has viewed a certain number of site pages can increase the likelihood of opt-in.
Are They Compatible with iOS?
When it comes to supporting the sending of web push via mobile, Apple has been notoriously late to the game. For a long time, web push were not supported for iOS devices. Given Apple’s huge market share, this lack of support severely limited the scope and reach of the web push channel on iOS browsers. However, as of the release of the iOS 15.4 Beta earlier this year, it seems that Apple has finally established a framework for sending these messages. The Beta release foreshadows that Apple will finally enable web push support in Safari on iOS and other iOS browsers such as Chrome and Firefox.
This change would apply to iOS and iPadOS, but it’s important to note that although the API to request notifications permission, subscribe, and receive messages in Safari is there, the feature is disabled by default. However, the existence of these new APIs and these new options are a promising sign that Apple will roll out full-fledged support for mobile web push.
At the Worldwide Developers Conference, or WWDC22 on June 6, the details of push notification support for mobile push notifications through Progressive Web Apps, or PWA’s, will finally be announced.
How to Configure Web Push for Mobile
In order to send mobile push notifications, companies must first install a web-based SDK from a web push service on their site. Generally, you’ll want to ask a tech-savvy member of your team to first register the service worker on the browser in question.
Push notifications make use of two APIs—a notification API and a push API. Every browser uses a different notification delivery service to deliver web push notifications.
Chrome uses Firebase Cloud Messaging (FCM), Safari uses Apple Push Notification Service (APNS), and Firefox uses MDN Servers.
Finding a Web Push Provider
OneSignal is designed to help you send notifications and seamlessly manage your user communication across a variety of channels, including web push. We provide built-in support for Chrome, Safari, Firefox, and other top web browsers, so you can send eye-catching messages to all your website visitors without doing any development work.
OneSignal and Vapronix Web
Our client Vapronix Web, a publisher of online content such as interactive quizzes, games, articles, and videos, was able to foster audience growth through their use of web push notifications.
With OneSignal's help, Vapronix used web push to grow and retain over 7 million subscribers across 200 countries. Some of their key use cases include bringing users back to older quizzes and games in their catalog and increasing ad impressions.
Since implementing OneSignal, the Vapronix team has seen their average retention rate increase to 41.6 percent.
Learn About iOS Mobile Predictions
After the iOS 15.4 Beta Release, our CEO George Deglin gave his take on his predictions around the changing status of mobile web push. Read on to learn more: iOS Web Push Notification Support is Forecasted For 2022
Get Started with OneSignal
With OneSignal, you can send web push notifications for free on desktop and mobile devices. The best part? It's completely free. Create a free account to discover why we're the most popular global messaging solution.
Create a Free Account
