Sign up

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

  • Momentum

    Push notifications can reach users even when they’re not using your app.

    Web Push

    In-app notifications reach your users only when they're actively engaged with your app.

    In-App

  • Consent

    Web push notifications need a user’s consent before they can be delivered.

    Web Push

    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.

    In-App

  • Content

    Web push has prime real estate right on your users' desktop, but it is limited in the copy length and visuals you can add.

    Web Push

    There is no word count or default UI you must consider before designing your in-app notification.

    In-App

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.

  • Ecommerce

    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

Start Now

Which Browsers Support Web Push?

  • Chrome

    As of Chrome version 42, the Push API and Notification API are available to developers.

  • Firefox

    Using the Push API, a W3C standard, Firefox push notifications can be shown at any time.

  • Safari

    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...

  • Timely

    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.

  • Personal

    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.

  • Actionable

    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 Slack

    Learn 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

Full Customization

Extensible, feature-rich API

Smart Delivery

Notification Log

Deep Analytics

Real-time Sync

Web Push + Mobile Push

Build a multi-channel notification experience for your users by combining web and mobile push notifications.

Start Now