Intro to Web Push Notifications

What are Web Push Notifications?

Web Push Notifications are clickable notifications which are sent via desktop or mobile web. Even if the user is not on the website or the website is not open, these notifications will still be delivered over to the user's desktop/mobile.

No contact information such as email, name, number, etc. required for sending web push notifications. Hence even if the user is anonymous, can be shown web push notifications.

Why you need Web Push Notifications?

Web push notifications are a great way to Engage users with meaningful alerts and they come with loaded benefits.

Great way to re-engage visitors once they abandon your website.
No need for the user to be on your website for delivering such notifications.
Deliver these notifications to anonymous users without needing their contact information.
Higher CTRs compared to other engagement channels.
Personalized and contextual targeting based on user activity.

How Web Push Notification's work?

For user's to receive web push notifications, they first have to subscribe to the service by clicking on the allow button of the opt-in message(refer to the image below).

If the user clicks on 'Block', then the service provider will never be able to send any subscription notification in future in the browser where the above notification was blocked.
If clicked on the 'close' icon then the user can receive the subscription notification in the future.

Once allowed, the user will start receiving notifications something like the below image.

Anatomy of Web Push Notification

ANATOMY OF A STANDARD WEB PUSH NOTIFICATION

There are 4 key elements that define a Browser Push Notification.

Title
Description
Landing page URL
Icon, Banner image, Call to Action

To understand the anatomy or structure of a Browser Push Notification, there are 4 elements you need to understand.

Domain - It defines which website domain has sent you the notification

Icon - The default icon is a bell icon. Adding your logo in the icon helps users in building a brand recall. The recommended icon should be 100*100px and should be less than 20kb in size.

Banner Image - Visuals help in impactful communication. Recommended Dimension : 360*240px. Size of the banner image should be less than 240kb or less.

Call to Action - CTA Buttons can be added only to Chrome notifications. You can add upto 2 Call To Action Buttons in a notification.

Browser Support for Browser Push Notifications

The below table explains browsers and the versions which support Browser Push Notifications

DEVICE	OS	BROWSER
Mobile	Android IOS	Chrome 50+, Firefox 50+, Edge, Samsung Internet. Chrome, Firefox, Safari.
Tablet	Android IOS Windows	Chrome 50+, Firefox 50+, Edge, Samsung Internet. Chrome, Firefox, Safari. Chrome 50+, Firefox 50+.
Desktop	Windows Linux Mac OS	Chrome 50+, Firefox 50+, Yandex. Chrome 50+, Firefox 50+. Safari 9.1 +, Chrome, Firefox, Opera, Yandex.

DESKTOP VS MOBILE

PARAMETERS	DESKTOP	MOBILE
Permission	Opt-In Required	Opt-In Required
Character Limit	Depends on Screen Size, Dimension of Notification	Depends on Screen Size, Dimension of Notification
Deep Link Support	Yes	Yes
Image Support	Only Chrome	Only Chrome
Device	Notifications displayed when Delivered	Notifications displayed on Lock Screen
Time to Live(TTL)	Between 1 hour and 28 Days	Between 1 hour and 28 Days

FAQs

For a HTTP domain, can I enable BPN with a single opt-in method?

No, we cannot. BPN technology is designed by FCM & browser tech in such a way that, it collects BPN token over secured website domains only.

Due to this design, we have to go ahead with a double opt-in method to enable BPN capability.

Can I customize the BPN Opt-in Message?

It is possible only to customize double opt-in messages.

In the case of a double opt-in method, we can customize only the 1st opt-in message.

Is it possible for me to migrate my existing browser token ids to Smartech platform?

Yes, we can do this.

If we use existing FCM credentials utilized with another vendor, we will be able to migrate BPN tokens automatically. We don’t need to show opt-in message again to users who have previously opted in BPN communication.

In such a scenario, after successful JS code integration, the BPN tokens are migrated to Smartech platform automatically over the time.

📘
It is not possible to upload Browser tokens via CSV file into your Smartech platform.

Will I be able to use 2 vendors for BPN services at the same time?

No, we cannot.

It is a browser’s limitation that it allows single BPN vendor. Activeness of the vendor will depend upon the position/priority of the vendor’s code placement into the website.

Can I enable BPN capability only for a specific webpage?

Yes, we can enable the BPN capability for a specific webpage by playing with different opt-in rules into Smartech platform.

How can I generate FCM details for BPN?

It is a very simple process.

Please refer this document link

When will my FCM account expire once I create it? Or is there any credibility for my FCM account?

FCM is a free service provided by Google. Once an FCM account is created, it will never expire.

Why is HTTPs recommended over HTTP?

To understand this better, please see this link.

*Is Web Push Notification dependent on Smartech JS?

Smartech JS is required for sending Web Push Opt-Ins and for activity tracking and then doing activity specific Web Push Notifications. You will still be able to send non-personalized and generic promotional Web Push Notifications.

Is the user required to be on my website for showing Web Push Notifications?

No, the user is not required to be on your website to show web push notifications. Though your browser(Which was used for opt-in) is required to be open.

👍
For any queries, please contact [email protected].