Social media timelines are already brimming with chaos: 

Notify your subscribers with updates using push notifications because metrics say that only 0.07% of your Facebook & 0.03% of your Twitter audience interacts with your updates on social media.

Web push notifications are clickable messages that come from a website and alert you on your desktop or device even when the website is not open on your browser.

These notifications are similar to mobile App Push Notifications (notifications sent by a mobile app that land in your notification tray) except that they work on websites instead of apps and can be accessed on all devices (desktop, mobile, tablet, etc). Web Push Notifications work with the same degree of precision and quality across different devices, platforms and browsers. One can subscribe and receive notifications on their desktop or on an Android phone.

This new marketing channel helps re-engage your site visitors without intruding upon their privacy, or requiring them to submit their email and other contact details. All that the user needs to do is to subscribe to notifications from your brand when prompted, putting the ball firmly in his court. Adaptability and reach are also guaranteed as Web Push Notifications already work on over 85% of devices.

What are Website Push Notifications or Browser Push Notifications?

Sending a message

Which browsers provide support for Web Push?

Learn more about push notifications

Nishant Gupta

Anytime when a website wants to send you an update, it appears on your mobile or desktop (i.e. the device you used to susbcribe to notifications). You can click on these notifications and go to the web-page that the notification specifies.

This is how a notification looks like on your desktop or mobile device:


> These notifications work only on SSL sites (https).

> This is a great feature for brands that are still in the process of building their app but have a website up and running.

Why does this require HTTPS? How do I work around this during development?

Service workers require secure origins to ensure that the service worker script is from the intended origin and hasn’t come about from a man-in-the-middle attack. Currently, that means using HTTPS on live sites, though localhost will work during development

What are Chrome push notifications, Safari push notifications and Firefox push notifications?

It depends on the web browser where the notifications are delivered. Chrome push notifications are displayed in the Chrome browser, Safari push notifications on the Safari browser and so on. In principle, they are all Web Push Notifications doing the same job in terms of serving information to the user, albeit on different browsers.

Performance driven: 

You know its too painful to see those beautiful email newsletters stay archived, unread & unattended. Send out this communication with push notifications. These notifications are exactly like the app-notifications & app-notifications have been observed to show a 50% higher open-rate & almost twice the click-rate than emails.

Website Push Notifications are not On-site Notifications

On-site notifications are also messages delivered to a user’s desktop or device for re-engagement. However, unlike Web Push Notifications, the web page needs to be open in the browser. If the user is active on some other tab, he will still get messages from the web page. The website doesn’t need to necessarily be ssl and works fine for both SSL (HTTPS) and non-SSL (HTTP) sites.

Opting in and Opting out for push

Metrics to track push notifications performance:

Why should you use Website Push Notifications?


Push notifications are one of the most valuable capabilities of native apps, and this experience is now available on the web. To get the most out of Web Push Notifications, it needs to be timely, precise, and relevant at a user level.

Timely— I feel I need it and it matters right now

A timely notification is one that appears when users want it and when it matters to them the most. 

Precise— It has specific information that's good to know or act upon  

A precise notification is one that has specific information that can be acted on immediately.

Relevant— It’s from people or sources that matter to me, which make it personal

A relevant message is one about people or subjects the user cares about.

Re-engage your users like never before:

Scale re-engagement and touch base with your inactive users by notifying them with personalized notifications. Send notifications with deals, or offer updates basis their interest & on-site behaviour. Build relationships & improve your earnings.

For example- Re-engage with the users who have not visited your website in the past week. Share unique coupon codes, product details or visited categories to get them back!

Bring your readers back to your website:  

Notify your readers with content updates or offers with personalized notifications. Send notifications with helpful content or updates basis their interest.

Advantage of using Web Push Notifications?

Device Operating System Browser (version)
Mobile Android

Chrome 42+ (Vizury support 50+), Firefox 48+

Desktop Windows

Ubuntu (Linux)

Mac OS
Chrome 42+ (Vizury support 50+)

Firefox ( 44+)

Edge (Latest version)
Tablet Android/Windows

Chrome 42+ (Vizury support 50+), Firefox 48+


Wider market share across browsers:  

Safari, Chrome and Firefox when combined have a market share of about 62-79%. With these browsers providing support for Web Push, the reach of such notifications is immense. (Source: Sitepoint)

Go mobile without an app:

You can go ahead and engage mobile audiences even while you are still building an app. If you have a mobile website, Web Push Notifications will help you build engaging conversations on mobile.

Access to users who are not on your website:

Using web push notifications, you can reach out to users who are currently not on your website.

Ability to re-engage users without knowing their contact details:

Web push notifications don’t need a user to submit email or other contact details.

Higher opt-ins as compared to emails:

Since users don’t need to give their email id or other contact details and they also have the ability to unsubscribe from receiving notification easily whenever they want, the opt-ins for web push notifications are higher than emails.

Lower unsubscribe / opt-out rates:

Studies have shown that less than 10% of the subscribers who opted for notifications from a site, unsubscribed in a year.

Assured content delivery:

The moment you click on “send notification now”, it will be delivered to the users immediately. Unlike emails that sometimes fail to deliver or go to spam folder, these notifications are for sure delivered to the user.

Conversion rates are higher:

Studies have shown that web push notifications have 30 times higher conversion when compared with mail.

Greater mindshare of users:

Sending notifications even when the users are not on your website, helps you capture their mindshare and then as the saying goes market share follows!

Innovative user base:

Since this is a nascent technology, it is safe to assume that your content will reach to the most tech savvy user base.

Web Push Notifications 101

Receiving a message

Who Should use Web Push Notifications?

Subscribe or opt in:

As you visit a website with support for push notifications enabled, you see a prompt (i.e. an opt-in) asking you to allow the website to send you push notifications. As soon as you click on the "Allow" button, you are added to their subscriber list. Yes, its that subtle. You do not need to give them your email ID anymore!

This is how the opt-ins look like on desktop or mobile:

If you run a business online, you can leverage the power of web push (or, browser push notifications) and grow your business.  While web push gives you an edge and enables you to talk in a better way, it also provides you with an immense number of benefits to help you drive more revenues from your business. Check out several benefits that web push offers. 

Manage or opt out:

  1. Open Chrome. 
  2. In the upper right corner of the browser window, click the Chrome menu . 
  3. Click Settings > Show advanced settings. 
  4. In the "Privacy" section, click Content settings. 
  5. In the dialog that appears, go to "Notifications" and choose one of the following: 
  • Allow all sites to show notifications: You’ll automatically see notifications from all websites. 
  • Ask when a site wants to show notifications: You’ll get an alert from Chrome whenever a site wants to show you notifications. This is the default setting. 
  • Do not allow any site to show notifications: You won’t see any notifications from websites. 

You can also block any sites, apps, and extensions that already have permission to send you notifications. Just click Manage exceptions.

Web Push Notifications For eCommerce:

  • The number of notifications sent
  • Frequency of notifications sent
  • Notification after which the provision was disabled
  • Click-through rate
  • The number of notifications delivered
  • Page visit via push notification 
  • Time on page after a certain notification 
  • Number of sales & total sales revenue
  • Delivery time with respect to re-engagement

Go mobile but without an app: 

Browser push notifications saves you from all the efforts & cash that you'd otherwise need to invest in building an app & more importantly get it installed. 

Web Push Notifications For Publishers/Bloggers :

Web push notifications are one of the best communication channels in entire spectrum. Chrome, Mozilla, and Firefox cover almost 75% of the total browser stack. Browser push notifications are unique in terms of technology and deliverability. They are prompt, relevant and very specific. With little advancement in the technology they can be personalized; for example you can insert individual specific information to make good use of it. 

Web push notifications are game changing medium of communication.

Email doesn't work anymore:

Whether it's a trending deal, a pending message or a new blog post update - with push notifications, your subscribers won't miss on your updates anymore.

Browser Push Notification vs The Potential of Email

How do web push notifications work?

They are two main requirements for browser push notifications to work:

A. HTTPS - Web push notifications can only be implemented on HTTPS enabled domains to prevent man-in-the-middle attacks. But with a little workaround HTTP websites too can implement web push functionality.

B. Service Workers, push and notifications APIs should be supported by the browser else the service won’t work!

Timely updates

Need to send a time-limited deal or announce a sale? You can use web push notifications and instantly reach your users on their desktop, mobile or tablet with push notifications, even when they are not on your website. 

Drive more sales:

It reduces your cart-abandonment rate by pushing instant deals & notifications to users who left the items unordered.

For example- Make user complete the purchase as soon as he drops from the cart or any other time that you may chose like: 15 min , 30 min , 1 hour , 4 hours , 12 hours 

Overall process can explained in 6 simple steps.

  1. Your website should be registered on the notification server like Google Cloud Messaging (GCM) service which will return you the API key. Consider this as a permission to receive user id data on your server when a user subscribes to your web notifications. 
  2. Have a table in your database where you store user ids or tokens along with other data like subscription and unsubscribe date. 
  3. When the user clicks on the ‘Subscribe’ or ‘Allow’ button for granting notification permission, his/her service worker (a script which runs in the background and allows notifications even when browser is closed) is registered and his subscription id is sent and stored on the push notification server and application server as well. 
  4. The subscription id identifies a particular device so that the notifications are sent to the correct device. 
  5. Now whenever you need to send a notification, the user ids are fetched from the application server and sent to the notification server which checks user-agent (device) for permission. If the permission is granted, the service worker sends a fetch request to the application server for message data to be displayed. 
  6. If the user wishes to unsubscribe, a request is sent to the push notification server which clears the user’s id from its tables.

Get more subscriber: 

Subscriber list building is easy with website push notifications. It is a very easy & a simple user experience, your readers are likely to convert really fast & hence, you build an interactive audience very quickly. 

Notify your subscribers with updates using push notifications because metrics say that only 0.07% of your Facebook & 0.03% of your Twitter audience interacts with your updates on social media.

  1. Subscribe SI API 
  2. Subscribe
  3. Monitor
  4. Distribute push resources (URI and ID for sending push messages) 
  5. Push messages 
  6. Push messages
  7. push messages

Time-sensitive communication: 

Do you need to send a breaking news, stock update or weather report? Use web push notifications and instantly reach your users on their desktop, mobile or tablet with push notifications, even when they are not on your website.

Growth Hacker

Subscribing a user

Authored By:

This entire workflow can also be understood by the simple explanation of Pete LePage during Google I/O 2016. He explained the entire process in three steps with three major component (Browser - Endpoint - Server)

Hop onto the browser push bandwagon It's brand new

Start Your Free Trial