Browser Push Notification: Beginner’s Guide And How to Send Them?

“The effectiveness of communication is not defined by the communication, but by the response,” said Milton Ericsson, the American psychiatrist, famously.

What is Web Push Notification?

Web push notifications are messages that come from a website. You get them on your desktop or device even when the concerned web page is not open in your browser. These notifications can only be sent to users who have opted-in to receive these notifications. They are supported by Chrome, Firefox, Edge, and Safari.  They are a brand new marketing channel to re-engage your visitors without knowing their email or other contact details.

Web Push notifications were first introduced by Chrome in early 2015 in its 42 version. The version included “two new APIs that together allow sites to push native notifications to their users even after the page is closed—provided the user has granted explicit permission.”

The update allowed websites to send notifications just like apps could, so far. It was allegedly the most critical mobile feature that was missing from the web and thus upon release witnessed a tremendous adoption by web publishers.

What are Web Push Notifications used for?

Push Notifications are best used for delivering time bound content and engage users. Some of the popular use cases of push notifications include re-targeting users abandoning a shopping cart, activating dormant users with offers, retaining loyal users with personalized content and more.

Just like native app notifications, web push notifications are meant to facilitate timely flow of information. To subscribe or opt-in to these notifications, users are not expected to download and install an application. Users can simply subscribe to these notifications by clicking on the Allow button on the permission prompt.

History of Web Push Notification

2003- Blackberry OS launched push email. This saved executives and business class from constantly checking their email. Almost everyone believes that this is what that fueled Blackberry’s success.

June 2009- Apple launched APN (Apple Push notification). The first push notification service ever.

May 2010- Google launched Android Cloud-to-device messaging (C2DM). The first notification service by Google, introduced in Android 2.2.

June 2012- C2DM was replaced by GCM to overcome the limitations that C2DM had. This is important because the current delivery of push notifications is facilitated by GCM. It has been added with additional features in its new version as FCM.

April 2015- Chrome launched Chrome 42 with support for native web push notification.

Jan 2015- Firefox extended support to web push with the launch of their version 44. This was not applicable on mobile site.

Aug 2016- Firefox extended support to web push even on the mobile devices.

Feb 2017- Chrome introduced rich web push notifications with Chrome 56.

Where do these Notifications Appear on a Desktop?

The appearance of a browser push varies according to the browser and also according to the OS. Web push notifications are delivered even when the user is not on the website. On Desktop, these notifications are delivered to the browser, right next to the taskbar.

Safari push notifications are delivered directly to the Mac OS Notification center. With Chrome 59, Chrome push notifications became native with OS X notification center. Firefox notifications appear on the right-hand corner of the browser.

On Windows, these notifications are displayed above the taskbar.

On Android, these notifications are displayed in the notification tray.

How do Web Push Notifications Work?

Once you’ve enabled web push notifications on your website, your web visitors will start seeing a subscription prompt. You will be able to send notifications to these users after they have subscribed to your website notifications.

1. Push Notification Service: Each browser, including Chrome, Safari, and Firefox have their own notification delivery service. Chrome uses Google Cloud Messaging ( and now Firebase Cloud Messaging ), Safari uses Apple Push Notification Service ( APNS ) and Firefox uses MDN servers.
2. Service Worker Registration: Developer must register the service worker on the browser. This is only for Chrome and Firefox. Safari does not support service workers.
3. User’s Subscription ID: Subscriber ID is generated when a user opts in to receive notifications from a specific website.

User Subscriptions and Activation

This explains the next steps.

• Users are prompted for notification subscription whenever they visit the website with a default browser prompt. Developers and website owners can choose to trigger subscription prompt conditionally.
• A unique registration key is generated by a browser for every user who subscribes to the notification.
• Notification service provider stores the keys at their end along with any additional data points to identify subscribers uniquely.

Web Push notifications can be targeted and personalized to select segments of your user base, and even personalized for specific users. As compared to email or SMS, in the context of web push, users are not required to do away with their personal information. Segmentation basis a user’s browsing and purchasing pattern ( events and properties ) can be used to create powerful audience segments. Marketers/developers would need an interface for writing messages, selecting the target audience and pushing or scheduling notifications.

Web push notifications and Web notifications (On-site notifications):

Web notifications are also messages delivered to the user’s desktop or device to re-engage him. But unlike web push notifications, here, the concerned web page should be open in the browser. If the user is active on some other tab, he will still get messages from the concerned web page. Also, for this, the website doesn’t need to be SSL. It works fine for both SSL (https) and non-SSL (https) sites.

Pushing a Notification

Let’s walk it through step by step.

1. You can define the notification content using either an interface or APIs exposed by the service provider.
2. You may choose to send the notification immediately, basis action/trigger or at a scheduled time.
3. You can define the audience to whom you would want to send notifications. The audience filters are typically managed by the service provider, and provide options to send notifications to all, to a specific subscriber, to a segment of subscribers.

• Which browsers support web push notifications?

Since it is still in a nascent stage not all browsers and OS support it so far. Below is the latest table of browsers and OSs which support web push notifications.

OS	Supported by
Android	Chrome 42+
iOS	No browser support
Mac OS	Chrome 42+, Firefox 44+, Safari Mavericks
Ubuntu	Chrome 42+, Firefox 44+
Window	Chrome 42+, Firefox 44+

Response to Web Push Notifications?

All the leading browsers – Chrome, Firefox, Safari, Opera and other Chromium-based browsers now support web push notifications. The permission or opt-in process is similar across the browsers. Users are required to grant explicit permission to a website (web app), hence opting-in to receive push notifications. It is important to understand that the capability of web push notifications is only for websites operating on HTTPS protocol with an SSL certificate. Subscription or opt-in rates usually vary from visitors to visitors, depending upon the implementation. Marketers often use a double opt-in process to ensure that users opt for notifications instead of blocking them. To convert your website visitors into subscribers, it is critical to design the right subscription UX with web push notifications.

Targeted Notifications v. General Broadcast Notification

‘One size fits all’ doesn’t work very well with Web Push Notifications. Assuming that all subscribers will have the same preferences can result in a high number of users unsubscribing from notifications. It’s common knowledge that sending targeted notifications can help you engage better and get higher click rates. Also by narrowing your focus and targeting selective segments, your subscribers will find your notifications to be much more relevant and keep them from churning away.

What can you use Push Notifications for?

Push notifications can provide value to both end users and the business. Users can receive convenient updates in real time, such as weather reports, news updates or flight information. Businesses, on the other hand, can communicate directly to the user and encourage him or her to use the app via specific call-to-action messaging. Push notifications can increase click-through rates, promote products or offers and drive users to other marketing channels.

Push notifications provide convenience and value to app users. For example, users can receive:

• Sports scores and news right on their lock screen
• Utility messages like traffic, weather, and ski snow reports
• Flight check-in, change, and connection information

For app publishers, push notifications are a way to speak directly to a user. They don’t get caught in spam filters, or forgotten in an inbox — click-through rates can be twice as high as email. They can also be used to drive actions, such as:

• Promoting products or offers to increase sales
• Improving customer experience
• Converting unknown app users to known customers
• Sending transaction receipts right away
• Driving users to other marketing channels, such as social networks.

Limitations of Web Push Notifications

Finally, it should be noted that web push notification is still in its nascent stage and has several limitations, some of which I have listed below:

• HTTP support only – Web Push Notifications work only on websites that are on HTTPS protocol.
• Notifications are fundamentally personal to a user. The data points that are pushed and received are private and to ensure that privacy, it is supported only on secure websites (HTTPS).
• No rich media – Unlike app push notifications which supports images, videos, gifs, audio, and other interactive elements, web push notifications supports large images (360*240 size starting Chrome 56 and above).
• No notification tray on Chrome Desktop
• Not delivered on the desktop if the browser is not running.

Once upon a time, it was so difficult for users to even be informed of new emails in real time. Today, push notifications, which solved that problem, stand beside email as a legitimate way of user communication. Push notifications have changed the way we interact with smartphones, and its latest avatar is leaving more space in inboxes; at the same time, it is giving marketers a great way to contact interested customers.