La crĂ©ation d’une Progressive Web App engageante change la façon de penser une conception visuelle et les interactions habituelles… Pour proposer une expĂ©rience agrĂ©able et unique Ă  chaque utilisateur, les notifications push web gagnent en popularitĂ©. Focus sur ce canal ultra-engageant  !

Que signifient les notifications push Web ?

L’idĂ©e des notifications n’est pas nouvelle, mais dĂ©sormais les Progressive Web Apps (PWA) offrent la possibilitĂ© d’utiliser une fonctionnalitĂ© intĂ©ressante. En fait, il s’agit d’envoyer des notifications push web mĂŞme lorsque le navigateur n’est pas ouvert !

Ainsi, une PWA permet aux utilisateurs de recevoir des messages provenant de sites internet qu’ils aiment via leur navigateur.
Pratique nous direz-vous, puisque l’utilisateur est informé rapidement d’une nouvelle vente, d’un nouveau contenu ou d’une mise à jour importante.

De plus, les notifications Push Web améliorent l’engagement des utilisateurs par le biais d’un contenu personnalisé et pertinent.

Notifications PUSH WEB, un nouveau canal ultra-engageant.
Un lien plus direct avec vos abonnés !

Les notifications push Web sont-elles réellement utiles ?

Aussi, ce nouveau canal de communication est très utile pour de multiples raisons.  C’est une bonne opportunitĂ© pour crĂ©er des connexions en temps rĂ©el avec vos prospects et vos clients. Les notifications push web viennent Ă©galement complĂ©ter votre stratĂ©gie marketing et de fidĂ©liser davantage votre clientèle.
Selon l’un des sondages Google, “85% des utilisateurs de smartphones disent que les notifications mobiles sont utiles”.

De mĂŞme, sur les appareils mobiles, les notifications sont un Ă©lĂ©ment fondamental pour transformer un utilisateur actif mensuel en utilisateur actif quotidien.  Les notifications push Web ne sont pas une nouveautĂ© technologique isolĂ©e.
D’ailleurs, es systèmes d’exploitations Microsoft Windows, MacOS, Linux; ainsi que les navigateurs de Google Chrome, Mozilla Firefox, Opera et Samsung Browser sont dĂ©jĂ  compatibles.


Bonnes pratiques des push web: Créer une expérience positive.

Notifications Push Web

Ensuite, lorsque vous planifiez vos notifications push web, demandez-vous si elles sont suffisamment importantes pour justifier une interruption ? En cas de doute, autorisez l’utilisateur Ă  accepter des types spĂ©cifiques de notifications dans votre application avec leurs propres paramètres de notification.
Par ailleurs, rappelons que les utilisateurs veulent des notifications qui : 

  • contiennent des informations opportunes.
  • offrent suffisamment d’informations pour Ă©viter de visiter l’application.
  • sont personnelles ou contextuelles 
  • changent de jour.

Utilisez les notifications push web principalement pour les Ă©vĂ©nements urgents ! Surtout si ces Ă©vĂ©nements synchronisĂ©s impliquent d’autres personnes. 

Quelques exemples de notifications Push web

Par exemple, un message Chat entrant est une forme de communication en temps rĂ©el et synchronisĂ©e. Un autre utilisateur attend activement une rĂ©ponse. S’il s’agit d’une notification de chat, dites-leur de qui il s’agit directement.

Certes, les Ă©vĂ©nements du calendrier sont un autre bon exemple d’utilisation d’une notification. L’Ă©vĂ©nement est imminent et les Ă©vĂ©nements du calendrier impliquent souvent d’autres personnes. 

Vous voulez Ă©viter de notifier Ă  l’utilisateur des informations qui ne lui sont pas spĂ©cifiquement destinĂ©es, ou des informations qui ne sont pas vraiment sensibles au facteur temps. 

Pour prendre un autre exemple, les notifications ne sont pas des e-mails. Le but d’une notification est de taquiner l’utilisateur afin qu’il ouvre votre application ou de le laisser terminer une tâche sans avoir Ă  ouvrir l’application. N’interrompez pas l’utilisateur pour des opĂ©rations techniques de bas niveau ! Tout comme la sauvegarde ou la synchronisation d’informations. Ou bien encore sur la mise Ă  jour d’une application si l’application ou le système peut rĂ©soudre le problème sans impliquer l’utilisateur. 

CREEZ DES NOTIFICATIONS PUSH WEB PERSONNELLES

Ne crĂ©ez pas de notifications si les nouvelles informations pertinentes sont actuellement affichĂ©es Ă  l’Ă©cran. Au lieu de cela, utilisez l’interface utilisateur de l’application elle-mĂŞme. IdĂ©al pour informer l’utilisateur des nouvelles informations directement dans le contexte. Par exemple, une application de Chat ne doit pas crĂ©er de notification système si la fenĂŞtre de chat est dĂ©jĂ  ouverte et que je peux la voir.

Mise en Ĺ“uvre des notifications Push Web

43%*

d’utilisateurs ayant acceptĂ© de recevoir les notifications Push Web

*Taux d’opt-in moyen

La mise en Ĺ“uvre de Push Web et des notifications comporte trois Ă©tapes clĂ©s: 

1- L’ajout de la logique cĂ´tĂ© client pour abonner l’utilisateur, 
2- Votre back-end pour gĂ©rer qui est abonnĂ© et dĂ©clencher l’envoi du message, 
3- Le service worker qui reçoit l’Ă©vĂ©nement push et affiche la notification Ă  l’utilisateur. 

Bien demandez l’autorisation aux utilisateurs

Pour le client, nous devons fournir un moyen facile pour l’utilisateur de s’abonner ou de se dĂ©sabonner de nos notifications.

Et avant mĂŞme qu’ils puissent s’abonner, nous devons obtenir leur permission. Une fois que nous avons leur autorisation, nous pouvons utiliser l’API Push pour crĂ©er un abonnement et obtenir l’objet d’abonnement push. Vous pouvez le considĂ©rer comme un identifiant pour l’appareil de cet utilisateur.

Le fait d’inviter l’utilisateur et de demander l’autorisation d’envoyer et d’afficher des notifications est vraiment important.

La réaction des utilisateurs

Si l’utilisateur voit l’invite d’autorisation sans aucun contexte, il est presque assurĂ© de cliquer sur “Bloquer”. Et si cela se produit, votre application Web ne pourra plus demander l’autorisation Ă  l’utilisateur. Ils devront dĂ©bloquer manuellement votre application en modifiant son Ă©tat d’autorisation, qui est cachĂ©e dans le panneau Paramètres. 

RĂ©flĂ©chissez donc bien Ă  la manière et au moment oĂą vous demandez l’autorisation aux utilisateurs, car s’ils cliquent sur Bloquer, il n’y a pas de moyen facile de revenir sur cette dĂ©cision. 

La bonne nouvelle est que la plupart des utilisateurs sont heureux de donner leur permission tant qu’ils savent pourquoi l’autorisation est demandĂ©e.

Dans certains cas, il est important de demander la permission tĂ´t. Par exemple, des applications de messagerie instantanĂ©e ou un client de messagerie. Dans ce cas, considĂ©rez le modèle de double autorisation. Tout d’abord, affichez une fausse invite d’autorisation que votre site Web contrĂ´le, composĂ©e de boutons permettant d’autoriser ou d’ignorer la demande d’autorisation. 

Si l’utilisateur clique sur Autoriser, dĂ©clenchez la demande d’autorisation en invitant l’utilisateur avec la boĂ®te de dialogue d’autorisation du navigateur rĂ©el.
Avec cette approche, vous pouvez afficher une invite d’autorisation personnalisĂ©e. C’est dans votre application Web qui demande Ă  l’utilisateur d’activer les notifications. En faisant cela, l’utilisateur peut choisir d’activer ou de dĂ©sactiver les notifications sans risquer d’ĂŞtre bloquĂ© dĂ©finitivement.

Comment envoyer un message push ?

En thĂ©orie, l’utilisation du protocole Web Push est simple (mais pas tant que cela) .
Les Ă©tapes consistent Ă  :

  • CrĂ©ez votre message sur votre serveur.
  • Cryptez-le Ă  l’aide de la clĂ© publique de l’utilisateur et de votre clĂ© de cryptage privĂ©e.
  • Puis utilisez les clĂ©s pour le signer avec la clĂ© de sĂ©curitĂ© de votre application privĂ©e. 
  • Ensuite, dĂ©finissez le bon ensemble d’en-tĂŞtes HTTP 
  • Et effectuez une demande de publication HTTP pour l’envoyer au service qui le remettra ensuite Ă  l’appareil. 

C’est pourquoi, au lieu de gĂ©rer cette partie vous-mĂŞme, nous vous recommandons vivement d’utiliser une librairie Web Push. Ou sinon, de passer par un service comme [Notchi] qui gèrent automatiquement ces Ă©tapes pour vous.

Notification Push Web NOTCHI

Comment se passe la gestion d’un message ?

Lorsque le service worker reçoit le push il doit en rĂ©cupĂ©rer le contenu et demander l’affichage d’une nouvelle notification contenant au moins un titre et un texte. En plus d’ajouter un corps de texte, vous pouvez Ă©galement ajouter d’autres propriĂ©tĂ©s Ă  la notification.

  • Le corps est exactement tel qu’il sonne et peut dĂ©finir le texte sous le titre.
  • L’icĂ´ne est une petite image affichĂ©e Ă  cĂ´tĂ© du titre et du corps du texte. Vous pouvez ajouter une image. Ce qui est particulièrement utile pour fournir un aperçu d’image Ă  l’utilisateur. 
  • Et pour Chrome sur Android, vous pouvez spĂ©cifier un badge, une petite icĂ´ne monochrome utilisĂ©e dans la barre de notification. Ainsi vous prĂ©sentez un peu plus d’informations Ă  l’utilisateur sur l’origine de la notification.

Autres propriétés intéressantes

  • Vibreur vous permet de dĂ©finir un modèle de vibration qui s’exĂ©cutera lorsque la notification sera affichĂ©e. 
  • Tag vous permet de regrouper les notifications. Si une notification avec cette mĂŞme balise existe dĂ©jĂ , la nouvelle notification remplacera la prĂ©cĂ©dente. 
  • Renotify : Sans renotify, la notification de remplacement ne vibre pas et ne joue aucun son lorsqu’elle est mise Ă  jour. 

En fait, lorsqu’un utilisateur clique sur une notification, rien ne se passe par dĂ©faut.
Pour gĂ©rer les clics des utilisateurs, nous devons ajouter un gestionnaire d’Ă©vĂ©nements de clic de notification au service worker. Dans ce cas, nous fermons simplement la notification. Mais nous voulons probablement faire un peu plus que cela. De plus, les actions vous permettent de fournir un autre niveau d’interactions Ă  vos utilisateurs en fournissant des boutons supplĂ©mentaires sur lesquels l’utilisateur peut cliquer. 
Par exemple, un utilisateur peut partager ou aimer un message, confirmer une rĂ©servation pour un dĂ®ner ou passer une commande, le choix vous appartient. 

Envie d’utiliser les notifications push dans vos projets ?

Si jamais, vous avez un site wordpress et souhaitez informer directement vos abonnées quand un nouvel article est publié ? Ou bien vous avez plutôt un site ecommerce et souhaitez envoyez vos promotions sans passer par des emails ?

Découvrez comment notre solution NOTCHI peut vous aider à utiliser les notifications push web pour propulser votre communication digitale au niveau supérieur.

Donc, n’hésitez pas à nous contacter pour que nous regardions ensemble les possibilités qui s’offrent à vous.

Retrouvez nos autres articles sur les PWA :