Getting started with web push notifications and their guidelines

You are here:
< All Topics

Introduction about Web Push Notifications

Web Push Notifications or browser notifications are notifications that your website visitors can opt-in to receive to stay updated. These clickable rich content messages can be sent to users devices from where they have subscribed to these notification services.

Push notifications can be delivered to user’s desktop or mobile even when the user is not on your website. The main benefit of push notification messages is to update them with latest offers, product launches, or announcement that you would like to share with your subscribed visitors.

Web push notifications are supported by Chrome, Firefox, Safari, Opera and Edge. These web browser notifications are packed with images, buttons, and emojis. The marketers can use these feature to send rich and lucrative messages to their subscribers. The big-sized image is supported by both the mobile as well as the desktop browser.

Guidelines for browser push notifications

The length of notification title and message depends on a number of factors including screen size, width and input language. However, considering these factors there are some common limits that are mostly adopted by all.

Push Message Title: It is recommended that the title of any push notifications is precise and clear. The recommended limit is 40 characters.

Push Message Body: Maximum limit of push notification message body is around 120 characters. Remember, if you use emojis, they take up 2 characters.

Push Icon: The maximum image size for push icon is 192×192 pixel. Mostly, brand logos are used to fill up this place. You can, however, use any icon URL in this place.

Large Image for Desktop Dimensions (Banner Image): For desktop, the minimum width and height of the image must be 360 (w) x 240 (h) pixel. Normally, the image with 1.5:1 dimension works on most of the desktop and laptop screens. The maximum resolutions can be 1080 (w) x 720 (h).

Large Image for Mobile Dimensions (Banner Image): For smartphones, the minimum width and height of the image must be 512 (w) x 256 (h). Normally, the image with 2:1 dimensions works on most of the mobile devices. The maximum resolutions can be 2048 (w) x 1024 (h).

For images, the supported image types are jpg, png, gif, webp, ico, cur and bmp.

Buttons: Additionally, you can add two buttons with lucrative CTAs such as Shop Now or More Collections.

Finally, if you are still facing any issues. Please mail us at support@canishub.com and we will resolve your doubts or query as soon as possible.

Table of Contents