Web push

15+ things you need to know about web push notifications [best examples]

Last updated - September 26 2023 12:45 AM
Joanna Worotyńska
Reading time - 26 min
Web push

15+ things you need to know about web push notifications [best examples]

Last updated - September 26, 2023
Joanna Worotyńska
26 min Read

Introduction

Web push notifications, also called browser push notifications, are small permission-based informational messages sent by a given web page. 

They are displayed on both desktops and mobile devices, even when their recipient is browsing other websites when the message is sent. Web push notifications effectively engage recipients without needing their email address or other personal data.

It is also an additional channel of effective lead generation on the website.

Like them or not, you’ve surely seen a web push notification in your favorite online store or news platform or maybe your competition is testing them out. 

How does it work

Start testing web push - always for free up to 500 subscribers!

Whatever the reason, check out this guide with 15+ things you need to know before adding push notifications to your website.

Table of Contents

1. What are web push notifications or browser push notifications?

1.1 Chrome browser push notifications

1.2 Firefox push notifications

1.3 Safari push notifications

2. A one-minute history of web push notifications

3. What do web push notifications look like?

4. How browser push notifications work?

5. Which browsers support web push?

6. Are web push notifications GDPR-friendly?

7. How to enable web push notifications on a website

7.1. Building web push database - double opt-in or single opt-in

7.2 How to transfer a database from another provider

8. Sending a web push notification - mass or triggered?

9. Web push notifications opt-in rate - how effective are they?

10. Web push best practices - how and where should you use the website notifications?

11. The difference between web push notifications and app push notifications

12. The difference between web push notifications and onsite notifications

13. Web push marketing vs email marketing

14. Should I Build My Own Web Push service Or Use A 3rd Party Service Provider?

15. Checklist for selecting a 3rd party web push notification provider

16. Nobody’s perfect - web push limitations

1. What are web push notifications or browser push notifications?

Web push notifications are short messages adapted to browsers in the form of familiar notifications that are sent by mobile applications.

desktop

Thanks to the new notification function that has been introduced in all modern web browsers (Chrome, Firefox, Safari, Opera, Edge), websites can send notifications to their subscribers for desktops and phones.

It is no longer necessary to have a mobile application to do this, which significantly reduces the time and costs of adding this channel to the marketing mix of your company. 

In addition, web push marketing is based on permission marketing, so you can be sure that you only communicate with potential customers who have expressed their willingness to receive your communications. Notifications allow you to permanently build brand loyalty, avoiding the harmful “spray and pray” approach.

Web push notifications are still quite a new online marketing channel that went live in April of 2015. However, they have already proven to have several advantages over traditional online marketing channels.

definitions
  1. Subscribers can sign up with one click. You don’t need any email addresses, cookies or other personal data in order to send notifications to subscribers. One click is enough to complete everything, which makes it significantly easier for new users to sign up. Notifications require minimum effort, don’t ask for personal information and are not associated with spam. Opt-in rates for web push notifications can range from 6% to 12%.

  2. Notifications are very visible. Notifications display directly on mobile and desktop screens, no matter what site users are visiting. It’s hard to miss them because you don’t have to go to, for example, an inbox to view them. The CTR for notifications can even be 15%.

  3. They work on both mobile and desktop. It doesn’t matter what devices you target in your web push campaigns, you just need to design one version. The browser does any adjusting necessary to ensure that your message displays properly on screens of all sizes.

  4. It’s easy to track subscriber behavior on your site. Sure, you can track, for example, clicks on message in an email campaign, but you need to do it through an email marketing platform or some other third party. In the case of web push, your website and notifications are united. Just paste the integration code and you can follow subscriber behavior on your website right away. It gives you more advanced possibilities of verifying their interests, predicting their future behavior and better targeting of campaigns, thanks to personalization, all in real-time.

  5. Adblock is no longer a problem. Your potential subscribers agree to receive notifications and they are saved in their browser. Therefore, no ad blockers will affect the delivery of your messages.

  6. No cookies needed! You do not need cookies to send notifications. To identify a subscriber, the browser uses unique keys for each account, including service workers. Eat cookies if you want, but keep them out of your marketing. 

  7. You don’t need to ask for any personal information. When signing up for notifications, new subscribers don’t need to share any personal data. Of course, if you want, you can make your recipients less anonymous and ask for that data for the purposes of integration after the API with your CRM system. However, web push marketing alone does not use personal data. 

1.1 Chrome browser push notifications 

Chrome browser push notifications are messages sent through the Chrome browser. All notifications you send are collectively referred to as web push notifications, but different types give you different communication options.

Notifications on Google Chrome offer marketers the most extensive functionalities, including:

  • rich push - campaigns with a dedicated large image, which also links to the landing page and is shown prominently on the recipient's screen.

Mediamarkt

Source: MediaMarkt.gr

  • call to action with buttons -  this notification gives you the option of including up to three different links to your landing pages or, for example, a short survey of your audience because the click on the action button is counted separately.

notification example

Source: NeilPatel.com

  • required action - a function thanks to which the notification will not disappear from the recipient's screen until he or she closes it or clicks it.

1.2 Firefox push notifications

Firefox push notifications are notifications displayed through the Mozilla Firefox browser. As you can see below, they are quite standard for this communication channel.

The options that this browser offers are much more limited than those sent via Google Chrome. You only have a standard rectangular message without any additional features.

How to disable web push notification

Source: hacks.mozilla.org

1.3 Safari push notifications

Safari push notifications are sent through the Safari browser. I must admit that this web push implementation seems to me the least polished and sparks the least interest in the sender.

The message contains a very small picture and little room for text that you can use.

web push on safari

Source: PushPushGo, web push notification example on Safari

2. A one-minute history of web push notifications

You've probably read in the first part of this post that the inspiration to create push notifications in browsers were just notifications sent by mobile applications.

That’s essentially true but here’s a more detailed history of how we got to where we are today.

notification history

The foundations for a completely new form of application-based communication started with BlackBerry devices.

This revolution took place at a time when even such ordinary activities as checking email required some effort. Introduced in 2003 by the creators of the BlackBerry push email function, businessmen did not have to re-download email from the server every time. 

Emails were displayed in the form of a pop-up window and you could view them instantly from the phone, without spending time downloading them.

This user experience became a model for the use of mobile devices that we know today. This innovative convenience powered the huge popularity of BlackBerry devices among companies that bought phones that allowed employees to be more productive and efficient. 

Another big step in the history of mobile notifications was taken by Steve Jobs and Apple. The breakthrough achievement of BlackBerry and its huge potential could not escape the attention of the innovator from the Silicon Valley.

In 2009, Apple introduced a solution based on the 1-to-1 mechanism used today. Thanks to Apple Push Notification Service, alerts sent by applications on mobile devices entered the mainstream. Their goal was to attract the user's attention, inform him about important events on the device and get him to take a certain action.

In 2010, Google also introduced mobile notifications in their Android operating system. However, for the next step in the process had to wait until 2013. That’s when Google Cloud Messaging was created, which is known today as GCM. It allowed sending notifications in the very popular Google Chrome browser.

Over time, all other internet browsers followed and in 2017 notifications were adopted as a standard functionality for all of them in the future.

Today web push notifications are used by Facebook (which incidentally shocked users when it first displayed notifications in the browser, not applications), Youtube and Gmail. They’ve also been embraced by bloggers, online stores, banks, telecoms and all other companies for whom the website is a very important touchpoint with potential clients.

At PushPushGo, we're proud to be part of this revolutionary story as one of the evangelists of web push notifications in Europe.

3. What do web push notifications look like? 

Web push notifications are always displayed as a rectangular window on the recipient's screen, however, their appearance varies depending on the operating system and the web browser in which the message is displayed.

Notifications differ in the number of characters used or the size of the displayed image. This is due to the different implementation of web push technology among various platforms and the marketer sending notifications does not affect the appearance of the window on the end device.

construction

Despite these small differences, all web push notifications have 4 common elements

  • distinctive graphics for attracting the attention of recipients;

  • title or a substitute like emoticons;

  • main text that expands on the title;

  • link to a website to send recipients exactly where you want them to go.

neil patel example

Source: NeilPatel.com

It is worth mentioning that Google Chrome offers some extra functions regarding web push. 

These are:

  • rich push notifications - messages with an additional large image that offer the possibility of adding a larger image of the product or dedicated graphic call-to-action (their CTR is higher by 3% on average).

  • notifications with action buttons -the notification contains editable call-to-action buttons at the bottom, directing users to different landing pages.

what is it

In addition, the web push notification received on the Windows 10 operating system has a unique appearance:

subscription

Linux:

linux

macOS user? Take a look:

macOS user

4. How browser push notifications work?

Web push notifications are supported by the internet browsers used by your recipients. This means that your campaign is delivered as soon as you hit “Send” and you don’t need to worry about cookies, anti-spam filters or ad blockers.

Just like email marketing newsletters, web push notifications are sent only to those who have expressed their desire to receive them. 

A unique registration key is generated by the browser for every user who subscribes to notifications. Subscribers decide what kind of notifications they would like to receive, meaning that your message can reach exactly those customers who are most likely to be interested. 

In order to enable web push notifications on your site, it’s enough to paste a small piece of integration code script into the page’s source code. 

You can also determine the frequency with which the signup form is displayed to particular users and after how much time it appears when a session is initiated.

web push work

To resign from further notifications, all anyone has to do is go to the browser settings. There is no threat from spammers! The only way to receive web push notifications is by explicitly asking for them.

After signing up through a subscription form, recipients can also receive an automatic welcoming message. These are frequently used in e-commerce to offer discount codes or other incentives to make a first purchase as well as exclusive content available nowhere else. Information about the benefits of signing up for web push notifications can help to boost the number of new subscribers. 

Also, all the messages you send can be can stored in a dedicated inbox on your site. 

Marketers know that subscribers often return to newsletters in their email inboxes. Now, your customers can do the same with discounts and other offers sent through web push notifications. 

Sign up form

Build up a GDPR-friendly database of subscribers twice as fast as a newsletter!

Thanks to the functionality of web push automation, you can also send in targeted campaigns based on the behavior of subscribers on your website. You can find more information on this subject in paragraph 8.

5. Which browsers support web push?

As I mentioned earlier, the notification function became standard in 2017 for all browsers going forward.

Web push notifications are supported by:

  • Google Chrome,

  • Firefox,

  • Opera,

  • Edge.

Unfortunately, it is still not possible to receive web push notifications on devices with the iOS operating system.

compatibility browser

6. Are web push notifications GDPR-friendly?

Collecting web push subscribers and sending them notifications does not require collecting and processing any personal data at all. Web push notifications are therefore very GDPR-friendly.

Please note, however, that the provider of the web push platform does not collect additional information about your subscribers without your knowledge. It is always your responsibility to maintain their privacy.

Familiarize yourself with the information that we have prepared especially for clients, for whom GDPR restrictions have a significant impact on their business.

Unfortunately, for the marketing industry, the legal activities of the European authorities are in this aspect more and more restrictive. Personal information is considered to be all information about a person who you can identify as the data controller. 

At the same time, "identification" is not necessarily the determination of personal data such as name and surname. If you are able to "isolate" one of the users in a group and assign specific features or information to that person, this constitutes personal data.

If you use tools that allow you to track one user on the web and match advertising messages this behavior, this constitutes the processing of personal data. Therefore, if you use web push automation or combine web push data with data from, for example, a CRM system, some restrictive legal interpretations may consider you are dealing with profiling and personal data.

Learn more about web push and GDPR from free ebook 

7. How to enable web push notifications on a website 

To enable web push notifications on your website, just paste the small integration script (a web-based SDK) into the <head> section of the source. 

If you want to quickly build a subscriber base thanks to the sing opt-in model, you will also need to paste two files on the root path of your server (this might sound challenging, but it’s about 30 seconds of work for a programmer).

Integration scripts do not slow down the operation of your website in any way. 

You can immediately check the detailed instructions on the web push website integration, which you can pass to, for example, the person responsible for maintaining your website.

otification html script

To send web push notifications, your website does not need to have an SSL certificate, but if you have one, you can use additional functionalities such as:

  • single opt-in (subscribing to notifications with one click),

  • export your subscriber base to another web push service provider in the future.

So let's think about it, especially since the lack of an SSL certificate on the site has a significant impact on its reputation on Google and thus the position in the SERP.

7.1. Building web push database - double opt-in or single opt-in

Subscribers can sign up to web push notifications through single opt-in or double opt-in processes. These two methods differ in important ways. 

If your website has an SSL certificate, the potential recipient will immediately see the native signup form from the browser, as below. Users recognize it, in the same way, for example, that Google Chrome asks if it can track your location.

sign up form defoult

Pluses

  • only one click divides the user of the page from becoming a subscriber, therefore this subscription form has the highest opt-in rate,

  • website visitors often trust native browser messages more than, for example, pop-ups displayed on the page. They are not rejected in advance like an advertisement.

Minuses

  • unfortunately, because it is a form from the browser, you have no influence on its appearance and you can not modify its content,

  • subscribers can automatically reply to "allow" in the form and do not even know that they subscribed to your notifications,

  • if a user clicks "block" in this form, he will no longer be displayed on that particular device in this browser account.

Double opt-in web push gives you completely different possibilities to personalize the subscription forms and to collect additional information from subscribers. The process for signing up for notifications takes place in two stages.

First of all, the recipient's chosen form is displayed, which you can freely personalize, like this one:

sign up form centered

Only after clicking "Subscribe" will he see the native subscription form from the browser, which will actually sign him up to notifications:

push notification

You can freely personalize the form, which can be modified using CSS.

It can be, for example, a pop-up with the possibility of marking the content the recipient wants to receive:

category

A standard form displayed in different parts of the page, such as the top bar:

Follow notification

Pluses

  • you have an influence on the appearance of the first opt-in form, so you can add, for example, information about the benefits that people who subscribe to your notifications will receive,

  • subscribers are aware of the whole process and will not be accidentally signed up,

  • you can immediately offer subscriptions to specific content from your site.

Minuses

  • there is a risk that some potential subscribers will not trust the process enough to finish it,

  • the first message displayed can be immediately dismissed as an intrusive ad and closed.

In both forms of opt-in you can select:

  • how often the subscription form will be displayed to visitors to your site,

  • if it will be displayed on all subpages or only selected ones,

  • after how much time on the site it will be displayed.

7.2 How to transfer a database from another provider

As with email marketing, you can transfer a subscribers database to another web push provider at any time. However, this process is a bit more complicated and requires an SSL certificate on the website and corresponding keys (GCM, FCM).

If you are not sure if this is possible in your case, contact us at support@pushpushgo.com  and we will explain everything and help transfer your recipient base to PushPushGo.

8. Sending a web push notification - mass or triggered?

You can send web push campaigns both to a mass audience at once (at a selected time to a selected segment of recipients) and by using web push automation scenarios.

Notifications can be sent automatically based on the data being read from your website at the moment when it has the best chance of conversion. 

The most effective web push notifications are the ones that are sent based on the interests of the recipients and triggered after they perform a specific action on the website. The CTR of such notifications can even reach 14.77%.

automation vs manual campaigns

Thanks to the integration of your website with the web push platform, all the behaviors of your subscribers on the website can be tracked, which will allow you to create an effective web push strategy.

This can be information be related to:

  • the products and services they search for on the website,

  • clicked categories of information or products,

  • products added to the cart, abandoned baskets, unfinished transactions,

  • the colors of products that the recipients are interested in,

  • time and duration of their last visit.

what information it collects

Read also: 5 ingenious ways to use web push notifications

9. Web push notifications opt-in rate - how effective are they? 

The opt-in rate of web push notifications is from 6% to 12%, which means that it can be even four times higher than in the case of building a customer base using a traditional newsletter. Like web push or not, so the facts speak for themselves.

subscription rate

*Source: PushPushGo client’s results (based on data collected in 2018/19)

This channel has a wide reach in the market. 

Web push notifications are supported by all modern internet browsers and mobile platforms and can reach about 80% of all internet users on the planet

This makes them an ideal marketing channel to complement your sales efforts, particularly with customers who avoid newsletters out of concerns about spam.

market coverage

Because of its highly visible presentation, web push can create a strong sense of urgency. Reactions to notifications take just a couple of seconds - closing or clicking - and that’s why web push can achieve CTRs of up to 15%, five times higher than email marketing. 

Of course, you can also manually send massive web push campaigns to your subscribers, but the CTR of triggered web push campaigns is almost 3% higher! (Source: PushPushGo client’s results (based on data collected in 2018/19)

Oh, and did I mention that all delivered notifications are automatically opened? 

web push campaigns

*Source: PushPushGo client’s results (based on data collected in 2018/19)

Of course, the CTR is not everything. You are probably most interested in what return you can get from the investment in web push and the numbers will surprise you. The ROI on web push notifications can reach 3500%, which means that $1 invested in notifications brings an average of $35 of profit. 

notification roi

*Source: PushPushGo client’s results (based on data collected in 2018/19)

Read also: Should you use web push notifications?

10. Web push best practices - how and where should you use the website notifications?

You can use web push notifications to support all processes that usually take place on your website. They can be related to both ongoing communication with potential clients as well as increasing repeat visits or optimizing conversions.

The most popular forms of using web push notifications are:

automation scenarios

How do you create effective web push notifications? The rules for creating effective web push notifications are very similar to those known primarily from newsletters. We have collected them in one place under our own special ABCDE Principle:

  1. Audience - if the message is of interest to only a selected group of recipients, don’t send it to everyone, especially if, for example, different time zones are involved

  2. Benefit - does the message contain real value for the recipient or prompts to take some action?

  3. Content - did you optimize the notification content so that it displays correctly and the graphic attracts attention?

  4. Direct - direct from the notification straight to the destination. If you offer a discount code for dresses, do not direct the recipients to some other product—deliver what you promise! 

  5. Engagement - would you click on this notification? Make it attractive if you want results.

how to create perfect web push notification

11. The difference between web push notifications and app push notifications

The difference between web push notifications and app push notifications is where the notification is sent from.

Web push notifications are browser-based, so you can send notifications by pasting and integration script into your website. Your recipients can sign up for subscriptions through both desktop and mobile browsers.

In the case of the push notifications app, you must have your own mobile application and push message engine to send messages. 

level by industry

Source: Localytics, Push Messaging Drives 88% More App Launches

Web push notifications are based on messages sent through mobile applications due to their high efficiency, so the notifications sent in both channels are very similar and perform similar functions. 

However, some work through websites and others on the basis of the behavior of the recipient in the application. In both cases, the recipient must agree to receive them.

12. The difference between web push notifications and onsite notifications

Onsite notifications do not require the prior consent of the recipient to receive them. They are, in a sense, an integral part of the website, so they can only be sent when the recipient is currently on it. 

They are intended to use social proof or the impression of urgency to encourage the recipient to finalize the transaction. They are sent through the recommendation engine connected to your website and not via the browser.

Web push notifications are therefore permission-based, so they allow communication even when the subscriber is not currently viewing your website because they are sent through the browser itself. 

13. Web push marketing vs email marketing

Like most marketers, you probably use a newsletter to communicate with your subscriber database. 

I mention this because it’s often said that web push notifications are the successor to the newsletter. Personally, I support using both as part of a larger communication strategy but some facts speak for themselves.

Web push, despite being a rather new communication channel, is characterized by high efficiency. The average CTR of web push notifications is 12%, about 4 times higher than email marketing.

The same about the ROI web push, as you can see in the chart below:

newsletter vs web push

See what one of our clients—Boris Upelj, Managing Editor of the online edition of Dnevnik.si—says about the role of web push in the marketing mix of his company:

14. Should I Build My Own Web Push service Or Use A 3rd Party Service Provider?

Above all, creating a platform for web push notifications requires the relevant know-how in the IT industry and the appropriate resources, both in the form of programmers and servers. The application should be maintained at all times, which also generates costs.

Creating a platform for your own use, you can take advantage of ready-made tools from Google, such as Firebase. 

However, without the proper know how, they will only allow you to send mass notifications, without the benefits of automation and personalization that make them so effective. Sent this way, they require the implementation of more complex solutions.

Ultimately, owning and developing your own web push platform (this requires constant tracking of the development of web push technology and implementation of changes in the application) may not pass a cost-benefit analysis. The monthly cost of using a web push platform in a SaaS model is lower than the cost of employing one programmer. 

While building your own solution, you also have to count, for example, the costs of server infrastructure and the processing power sufficient to handle all traffic from your website.

big travel

Send effective and engaging communications directly to the users' desktops. Get started for free!

15. Checklist for selecting a 3rd party web push notification provider

If creating your own tool for sending web push notifications seems like it may be more complex or expensive that makes sense for you right now, you can take a deeper look at providers who specialize in this service. 

what customers expect

Source: www.slideshare.net/thorleifhallund/why-service-matters

These are the criteria you should look at when evaluating your choices:

  • available functionalities (personalization and automation of notifications)

  • data security of your subscribers and your company (there are web push providers on the market that read data from client websites and sell it to third parties.)

  • 24-hour customer service and available know-how - support will help you create your own web push strategies and help when you have a problem with a campaign

  • future export of subscriber databases

  • an integration script that doesn’t slow down your website

  • ease of implementation - most or all functions should be available immediately after pasting the integration code into your site. 

See our checklist of how to choose a web push notification application.

16. Nobody’s perfect - web push limitations

Unfortunately, we all know that there are no perfect tools that can be applied to everything and solve all our problems. Every marketing channel has its pluses and minuses. Let's take a look at the limitations of web push notifications.

1. It’s short-form communication

Web push notifications can contain a maximum of a few dozen characters, including emoticons. 

This challenge forces you to get creative about the content and call-to-action in the notification and make sure you get your message across. 

The number of photos and links that you place in your web push campaign is also limited—a maximum of 2 photos and 3 links

Of course, you can put a lot more in the newsletter, but due to the fact that the notification is much smaller, it is easier to scan it at a single glance. This is what helps notifications to effectively engage and motivate recipients to act.

2. Notifications come and go quickly

You could say that notifications are like the leaflets of the internet. If subscribers don’t have an inbox enabled for notifications, there is no place to go back and view them again. 

This is part of what helps them create a sense of urgency. 

In the case of Firefox, the web push message is only displayed for a few seconds on the recipient's screen. Only Google Chrome has the required interaction function so that the notification will not disappear unless it is clicked or closed.

3. It’s not for iPhone lovers 

Unfortunately, there is still no support for web push notifications on iOS devices, which can reduce the reach of your marketing activities.

---

I hope that you found answers to all the questions that you are asking about web push notifications! 

If this is still not enough and you’re still wondering if web push notifications are for you, we’re happy to answer any other questions you might have. Just write to us at support@pushpushgo.com

Start testing web push - always for free up to 500 subscribers!


author photo
Joanna Worotyńska

Co-owner & CMO @ PushPushGo

Web push marketing evangelist. Dynamic PR and employer branding enthusiast and communication manager with knowledge and experience of many industries. Fan a new media and online communities.

Try out push notifications from PushPushGo

Create an account and start testing!

Push your business forward with PushPushGo

Test for free Start a 14-day trial!