{"id":7535,"date":"2019-09-09T21:39:55","date_gmt":"2019-09-09T19:39:55","guid":{"rendered":"https:\/\/stephaniewalter.design\/fr\/?p=7535"},"modified":"2019-09-09T21:48:36","modified_gmt":"2019-09-09T19:48:36","slug":"guide-de-bonnes-pratiques-pour-les-notifications-push-web-et-mobile","status":"publish","type":"post","link":"https:\/\/stephaniewalter.design\/fr\/blog\/guide-de-bonnes-pratiques-pour-les-notifications-push-web-et-mobile\/","title":{"rendered":"Guide de bonnes pratiques pour les notifications push (web et mobile)"},"content":{"rendered":"
Ce contenu a \u00e9t\u00e9 r\u00e9dig\u00e9 il y a 7 ans. Il se peut qu'il ne soit plus \u00e0 jour.<\/div>

TLdNR : les notifications push sont devenues un moyen de r\u00e9engager artificiellement les utilisatrices et utilisateurs. H\u00e9las c\u2019est aussi devenu le moyen facile de nous gaver de contenus. C’est sans doute pour \u00e7a que tant de personnes les d\u00e9testent autant Il y a pourtant des cas d\u2019usage int\u00e9ressants. Voici quelques conseils pour arr\u00eater de tout faire n\u2019importer quoi et g\u00e2cher les notifications pour les sites qui voudraient les utiliser tout en respectant leurs utilisatrices. Alerte spoiler : commencez par arr\u00eatez de demander la permission au chargement de la page (et rendez-les utiles)<\/em><\/p>\n

La semaine derni\u00e8re, je suis tomb\u00e9 sur un site parodique : Should I Add Push Notifications To My Website? \u2013 No<\/span><\/a>. (Est-ce que je dois faire des notifications push ?\u00a0 No!)\u00a0 C\u2019est fun, et je comprends le but de ce site et pourquoi il existe. Mais je ne serais pas aussi cat\u00e9gorique. Il y a des cas d’utilisation int\u00e9ressants pour les notifications de push, MAIS, comme d’habitude une grande partie des sites web en ont us\u00e9 et abus\u00e9 pour \u201caugmenter l\u2019engagement\u201d. Les utilisatrices sont d\u00e9sormais exasp\u00e9r\u00e9es, bref, comme \u00e0 chaque fois. \u00c7a fait plusieurs fois que j\u2019exprime mon opinion sur le sujet sur Twitter ou LinkedIn. Je me suis dit que la condenser dans un article pourrait vous \u00eatre utile.<\/p>\n

L\u2019avidit\u00e9, ou pourquoi on ne peut pas avoir de jolies choses\u201d.<\/h2>\n

Les notifications push \u00e9taient jusque-l\u00e0 r\u00e9serv\u00e9es aux applications natives (sur les t\u00e9l\u00e9phones et ordinateurs. Vous aviez donc besoin que les utilisatrices t\u00e9l\u00e9chargent votre application pour ensuite pouvoir leur pousser du contenu. Mais les choses ont chang\u00e9. Gr\u00e2ce \u00e0 quelques API comme Push<\/span><\/a> + Service Workers<\/span><\/a>, les navigateurs ont maintenant \u00e9galement la possibilit\u00e9 d’envoyer des notifications <\/strong>. Cela fonctionne aussi bien sur mobile (Android Chrome et Firefox) que sur bureau (Chrome sur Mac et Win, Safari sur Mac et Edge sur Win10). Fort heureusement, la permission est requise avant de pouvoir les envoyer. Et c\u2019est le nerf de la guerre cette permission. C\u2019est l\u00e0 que les choses commencent \u00e0 devenir exasp\u00e9rantes pour vous et moi : \u00e0 peine arriv\u00e9e sur le site, que ce dernier nous bombarde de la demande de permission.<\/p>\n

\"\"

Diff\u00e9rentes demandes d\u2019acc\u00a0\u00e8s aux notifications sur safari et chrome desktop et mobile<\/p><\/div>\n

Au nom du ** hum hum\u00a0 **\u00a0 \u201cgrowth hacking\u201d (un joli terme qui veut souvent dire augmenter son nombre d\u2019utilisatrices \u00e0 tout prix avec n\u2019importe quelle m\u00e9thode quantitative), tout le monde est devenu avide. Les propri\u00e9taires de sites consid\u00e8rent d\u00e9sormais les notifications push comme un moyen facile de gaver les utilisatrices de contenus<\/strong>. \u00c7a permet d’augmenter artificiellement le nombre de pages vues<\/strong> et au passage les b\u00e9n\u00e9fices, de vendre plus de chaussures \u201cGummistiefeln\u00a0\u00bb (cette r\u00e9f\u00e9rence est expliqu\u00e9e plus bas). Ne vous m\u00e9prenez pas, il n’y a rien de mal \u00e0 gagner de l’argent. Mais pas au d\u00e9triment de l’exp\u00e9rience utilisateur.<\/p>\n

De nombreux sites demandent cette permission d’envoyer des notifications (et de g\u00e9olocalisation) directement au chargement de la page lors de la premi\u00e8re visite. Et c\u2019est bien l\u00e0 le probl\u00e8me. Ces sites sont \u00e0 la fois avidit\u00e9 et paresseux. La plupart des utilisatrices ne connaissent pas ce site en particulier, son contenu, sa valeur. Pourtant leur offriraient-elles l\u2019acc\u00e8s aux notifications. Pourquoi leur offriraient-elles leur temps d\u2019attention et l\u2019autorisation de venir les importuner \u00e0 n\u2019importe quel moment, l\u00e0, de suite, sans rien en retour ?\u00a0 Ces sites ne donnent absolument pas le temps \u00e0 celles et ceux qui le visitent de comprendre la valeur de leur contenu. Et bien s\u00fbr tout le monde en a ras le bol. C’est tellement exasp\u00e9rant que certains navigateurs comme Firefox essaient maintenant de prot\u00e9ger les utilisatrices de ces d\u00e9rangements et offrent une option pour les bloquer tous pour une fois<\/a>.<\/p>\n

Selon Chris Wilson au Chrome Dev Summit en 2018<\/a> : \u00ab\u00a090% des demandes de permission sont rejet\u00e9es ou ignor\u00e9es<\/strong>\u00ab\u00a0. Et c’est pour \u00e7a qu’on ne peut pas avoir de jolies choses. Chaque fois qu\u2019une nouvelle fonctionnalit\u00e9 arrive sur le web, certaines personnes trouvent le moyen ruiner l\u2019exp\u00e9rience pour le reste d’entre nous<\/strong>. Et c’est exactement ce qui se passe avec les notifications push. Le gros \u201cprobl\u00e8me\u00a0\u00bb ici n’est pas la technologie, mais ce que nous en faisons. Les humains sont \u00e0 la fois avides et paresseux.<\/p>\n

Les notifications apportent une vraie valeur ajout\u00e9e dans certains cas d\u2019usage<\/h2>\n

Si vous pensez que je suis contre les notifications, d\u00e9trompez-vous, ce n\u2019est pas le cas. N’oublions pas que de plus en plus d’outils et de services sont maintenant en ligne. Nous avons beaucoup d’outils Sass, d\u2019outils dans le navigateur, etc. Et pour pas mal d\u2019outils et services, les notifications apportent une r\u00e9elle valeur ajout\u00e9e. Et c’est un peu pour \u00e7a que je suis d\u2019autant plus exasp\u00e9r\u00e9e contre les blogs et autres sites qui en abusent et qui ruinent tout pour le reste d’entre nous. Il y a beaucoup de choses vraiment sympas qu’on pourrait faire avec des notifications push. Voici quelques exemples, n’h\u00e9sitez pas \u00e0 partager les v\u00f4tres dans les commentaires.<\/p>\n

Rendez-vous, r\u00e9unions et \u00e9v\u00e9nements<\/h3>\n

Je d\u00e9teste appeler les m\u00e9decins. Je prends mes rendez-vous sur Doctena<\/a> d\u00e8s que je peux. Ils proposent une application, mais honn\u00eatement, je n’ai jamais pris la peine de la t\u00e9l\u00e9charger. Pour le moment (et j\u2019esp\u00e8re encore pendant longtemps), je n’ai pas besoin d’aller chez le m\u00e9decin tr\u00e8s souvent. On pourrait imaginer des notifications push sur ces sites pour des rendez-vous par exemple<\/strong>. Quelque chose comme \u00ab\u00a0nous vous rappelons que vous avez un rendez-vous dans 1 heure + l’adresse\u00a0\u00bb, directement dans le navigateur sans avoir besoin d\u2019installer une application mobile.<\/p>\n

J’utilise \u00e9galement la version web de Outlook chez mon client. Je re\u00e7ois des notifications dans l\u2019interface au sujet de mes r\u00e9unions. Mais si je ne suis pas sur l’onglet (ou si l’onglet \u00e9tait ferm\u00e9) je les rate. Il serait possible ici d’avoir des notifications de push navigateur pour les r\u00e9unions<\/strong>, m\u00eame quand la personne est sur un autre onglet (ou l\u2019a ferm\u00e9).<\/p>\n

Enfin, et ce n’est pas le moins important, les notifications pourraient \u00eatre une fonctionnalit\u00e9 int\u00e9ressante pour les sites de conf\u00e9rences. Certaines conf\u00e9rences ont une configuration super complexe avec de nombreuses salles o\u00f9 on peut planifier o\u00f9 on veut aller. Envoyer des rappels au sujet des s\u00e9ances qui commenceront bient\u00f4t<\/strong> pourrait \u00eatre une r\u00e9elle valeur ajout\u00e9e pour certaines personnes.<\/p>\n

Lorsqu’il s’agit d’outils en ligne professionnels ou personnels, les notifications push li\u00e9es aux rendez-vous et aux \u00e9v\u00e9nements peuvent \u00eatre une fonction int\u00e9ressante<\/strong>.<\/p>\n

Retards de vol (train) sur les navigateurs mobiles<\/h3>\n

Si vous me suivez un peu sur les r\u00e9seaux sociaux, vous savez dans doute que je voyage beaucoup. Je voyage avec beaucoup de compagnies a\u00e9riennes diff\u00e9rentes. Comme beaucoup de personnes que je connais, je ne prends pas la peine d’installer l’application native de chaque compagnie a\u00e9rienne avec laquelle je voyage. M\u00eame sans installer ces applications, les voyageuses souhaitent \u00eatre inform\u00e9es des retards de vols (ou de trains). Certaines entreprises comme KLM vous permettent d’\u00eatre averti par SMS ou WhatsApp.<\/p>\n

Les notifications push fonctionnent \u00e9galement pour certains navigateurs mobiles<\/strong> comme Android Chrome (pas encore dans Safari la derni\u00e8re fois que j’ai v\u00e9rifi\u00e9). Sur Android, elles s’int\u00e8grent au syst\u00e8me comme des notifications natives<\/strong>. Elles fonctionnent \u00e9galement lorsque le site est ferm\u00e9 gr\u00e2ce \u00e0 l’aide d\u2019un Service Worker.<\/p>\n

\"\"

Les notifications push dans le navigateur int\u00e9gr\u00e9es au syst\u00e8me<\/p><\/div>\n

Des notifications peuvent \u00eatre envoy\u00e9es depuis les sites de la compagnie a\u00e9rienne vers les navigateurs mobile pour donner des informations sur les arriv\u00e9es, les d\u00e9parts, les portes et les retards de vol<\/strong>.<\/p>\n

Si vous voulez en savoir plus sur ce type de fonctionnalit\u00e9s et d\u00e9couvrir tous les petits secrets dont sont capables nos navigateurs mobiles aujourd\u2019hui, vous pouvez aller jeter un coup d\u2019\u0153il aux slides de ma conf\u00e9rence sur le sujet\u00a0:<\/p>\n

Super Secret Powers of Mobile Browsers <\/use><\/svg><\/span><\/a><\/p>\n

Livraisons<\/h3>\n

La livraison est un autre cas d\u2019usage int\u00e9ressant pour les notifications. Les marchands en ligne pourraient envoyer des informations sur l’\u00e9tat et la livraison des colis<\/strong> directement depuis leur site web. Pas besoin d’installer une application.<\/p>\n

Messageries instantan\u00e9es (slack, etc.)<\/h3>\n

L’un des cas d’utilisation les plus \u00e9vidents pour les notifications de push est bien s\u00fbr les services de messagerie instantan\u00e9e. Je n’entrerai pas dans les d\u00e9tails que \u00e7a peut poser \u00e0 certaines utilisatrices en termes de FOMO (Fear Of Missing Out, ou la peur qu\u2019il se passe quelque chose et qu\u2019on le rate) qui peuvent parfois arriver avec la sur-utilisation des notifications. Encore une fois, nous vivons dans une \u00e9poque o\u00f9 beaucoup d’outils de communication sont disponibles directement dans le navigateur. Si vous regardez slack, vous pouvez t\u00e9l\u00e9charger leur application pour votre ordinateur, mais vous pouvez aussi acc\u00e9der \u00e0 vos canaux slack avec les URLs des navigateurs. Les clients de messagerie instantan\u00e9e sont donc un bon candidat pour des notifications push<\/strong>.<\/p>\n

Comment NE PAS g\u00e2cher votre exp\u00e9rience de notifications push<\/h2>\n

Comme vous l’avez lu, les notifications push peuvent apporter dans certains cas une r\u00e9elle valeur ajout\u00e9e. Mais pour cela, nous avons besoin de demander la permission au bon moment et cr\u00e9er des notifications int\u00e9ressantes et respectueuses des personnes \u00e0 qui nous allons les envoyer.<\/p>\n

Vous n’avez qu’une seule chance de demander la permission d\u2019acc\u00e8s, faites-en bon usage.<\/h3>\n

Les utilisatrices peuvent refuser d’accorder l’acc\u00e8s aux notifications. Si elles changent d’avis, il h\u00e9las tr\u00e8s compliqu\u00e9 de trouver comment redonner l\u2019acc\u00e8s dans le navigateur.<\/p>\n

Sur Android et Chrome, ce param\u00e8tre est cach\u00e9 profond\u00e9ment quelque part dans les param\u00e8tres du navigateur sur t\u00e9l\u00e9phone et le bureau. Tr\u00e8s peu de personnes vont savoir comment faire. Croyez-moi. J’ai refus\u00e9 d’accorder l’acc\u00e8s au microphone une fois, j’en ai eu besoin plus tard pour un appel et il m’a fallu 10 minutes (et lire la documentation de Chrome) pour trouver comment accorder \u00e0 nouveau l’acc\u00e8s. Pas grand monde se donnera une telle peine. Une fois l\u2019acc\u00e8s refus\u00e9, consid\u00e9rez qu\u2019il est refus\u00e9 dans ce navigateur \u00e0 dur\u00e9e ind\u00e9termin\u00e9e.<\/p>\n

\"\"

Un exemple de o\u00f9 redonner l\u2019acc\u00e8s en allant chercher dans des param\u00e8tres masqu\u00e9s sous le cadenas dans Chrome<\/p><\/div>\n

Sur iOS Safari, la derni\u00e8re fois que j’ai v\u00e9rifi\u00e9, si l\u2019acc\u00e8s est refus\u00e9 la 1e<\/sup> fois, vous pouvez demander une deuxi\u00e8me fois. Apr\u00e8s cela, il va \u00e9galement falloir aller quelque part dans les param\u00e8tres (du syst\u00e8me d\u2019exploitation).<\/p>\n

Je n’ai pas d’ordinateur avec Windows et Edge donc je n’ai aucune id\u00e9e de ce qui se passe en cas de refus. J’ai v\u00e9rifi\u00e9 cet article<\/a> qui explique un peu comment les activer et d\u00e9sactiver, il semble aussi qu\u2019il faille aller dans les param\u00e8tres. Si vous avez Edge et savez ce qui se passe lorsqu\u2019on refuse l’acc\u00e8s aux notifications, vous pouvez commenter \ud83d\ude42<\/p>\n

Au moment de la r\u00e9daction de cet article, tout cela signifie qu\u2019en cas de refus d\u2019accorder au site l’acc\u00e8s aux notifications, ce sera tr\u00e8s compliqu\u00e9 pour revenir en arri\u00e8re et redonner l\u2019acc\u00e8s<\/strong>. Comprenez ceci : vous avez donc UNE SEULE CHANCE de demander ces permissions<\/strong>. Et une seule<\/strong>. Et cela vaut aussi pour le microphone, la g\u00e9olocalisation, etc. Alors, choisissez judicieusement quand et comment demander.<\/p>\n

Quand et comment demander la permission d\u2019acc\u00e8s aux notifications<\/h3>\n

Tr\u00e8s peu sont susceptibles de vous accorder l’acc\u00e8s d\u00e8s la premi\u00e8re visite, encore moins si vous site leur est pour le moment inconnu. Encore moins ces gens sont arriv\u00e9s chez vous en suivant un lien via un moteur de recherche, un blog ou des m\u00e9dias sociaux. Nous ne vous connaissons pas, pourquoi voudraient-on (d\u00e9j\u00e0) cr\u00e9er un engagement avec vous et votre contenu ? La plupart de ces utilisatrices n’ont aucune id\u00e9e de ce que vous allez leur apporter. ARR<\/strong>\u00caTEZ d\u2019essayer d\u2019obtenir l\u2019acc\u00e8s aux notifications lors de la premi\u00e8re visite : ne demandez pas de permissions lors du chargement de la page.<\/strong><\/p>\n

\"Yeah,<\/p>\n

Pour accorder l\u2019acc\u00e8s aux notifications push, encore faut-il comprendre quel en est l’avantage. En tant que site, vous avez besoin de 2 choses :<\/p>\n