Cross-Browser Web Push Notifications
MagicBell's simple API & SDKs let you add an in-app inbox to your app & send browser notifications to all major browsers - Chrome, Firefox, and Safari.
What is a Web Push Notification?
Web push notifications are simply notifications that web applications and websites can send.
The notifications are received by the user's browser client, such as Chrome or Firefox or appear directly on the desktop even when the particular website is not actively used.Go to Docs
How Does Web Push Work?
Step 1: Get permission from the user to send them web push notifications.
Step 2: Make an API call from your server to a push service with all information about how your web push notification should look and feel.
Step 3: When the push service sends a notification, the browser will receive it, decrypt the data and dispatch a push event to your service worker.Web Push Implementation Guide
Browser Push Notifications vs. In-App Notifications
While both browser push and in-app notifications can deliver messages to your users, there are contextual differences you should know about.
Web PushvsIn-App Notifications
Push notifications can reach users even when they’re not using your app.
In-app notifications reach your users only when they're actively engaged with your app.
Web push notifications need a user’s consent before they can be delivered.
In-app notifications require no legal consent. If the user doesn't proactively disable notifications from your app, it will be sent to the device.
Web push has prime real estate right on your users' desktop, but it is limited in the copy length and visuals you can add.
There is no word count or default UI you must consider before designing your in-app notification.
Whether you use web push notifications, in-app notifications, or both, you should always strive to send personalized and meaningful notifications to users.
When to Use Browser Push Notifications?
Web push notifications are used in many different industries with critical events. They're often more visible than other notifications, such as in-app or emails, making web push an excellent way to trigger users and make them act quickly.
Software as a Service
Web push notifications provide a much-needed real-time function for desktop applications to communicate with their users, helping them collaborate and complete workflows more efficiently.
Logistics & Transportation
One of the most prominent use cases and probably most welcomed by users. Web push notifications such as calendar reminders, delivery tracking and flight-related notifications are time-sensitive and critically important.
Blogging & Media
Browser push notifications on the media websites and blogs can engage active users and remind inactive ones of new content and relevant topics.
Users are easily distracted and often find themselves browsing the internet while checking out. A browser notification can remind online shoppers what they intended to buy before forgetting about completing orders, even after closing the browser tab.
Add Web Push to Your Notification Stack
Which Browsers Support Web Push?
As of Chrome version 42, the Push API and Notification API are available to developers.
Using the Push API, a W3C standard, Firefox push notifications can be shown at any time.
Unfortunately, the latest Safari version has not yet implemented the Push API. You'll need to complete a few extra steps required by Apple before you can send Safari web push notifications.
Browser push notifications offer the same functionality as the notifications in mobile applications. They can be sent to the mobile versions of popular browsers too.Explore Mobile Push Notifications
How to Implement Web Push Notifications?
Step 1: Enable the Web Push Channel
Web push notifications are powered through service workers.
A service worker is just a script that your browser runs in the background.
By using service workers, you can send web push notifications to your users even when they don't have your application open in a tab.
We have created abstractions to hide the complexity so you can enable web push notifications without breaking a sweat.Learn More
How to Use Web Push Notifications in a Meaningful Way?
A key to a successful notification strategy is sending customers notifications that help them reach their goals and make their lives easier.
Web push notifications are no exception, web push should always be timely, personal and actionable.Learn More
A Great Browser Push Notification is...
It is essential to send push notifications when they are relevant. The best time will depend on the peak hours of your website usage, so you should try identifying users' pain points with this in mind and adjust accordingly.
Personalization can come in many forms—using the user's name in the title or description, knowing their preferences, or telling them their action had an impact.
Whether you want a user to complete a task or check out a new blog post, creating a sense of urgency lets users know their action or feedback is important.
“A great push notification is three things: timely, personal and actionable.” Noah Weiss, the Head of Search and Learning & Intelligence at SlackLearn More About Mindful Notifications
Why Choose MagicBell to Send Web Push?
Thank you for subscribing!
Choose the topics you'd like to follow.
The budget is low!
Check the status of your campaign.
Andrew left a comment for you.
Click to open the presentation and respond.
MagicBell's web push offers
Extensible, feature-rich API
More About Web Push Notifications
Take a deep dive to understand how web push notifications work.
Web Push + Mobile Push
Build a multi-channel notification experience for your users by combining web and mobile push notifications.