Progressive Web App, l’avenir du web ?
Les Progressive Web Apps tirent profit des progrès faits par les navigateurs web pour proposer la même expérience, que ce soit sur mobile ou Desktop. Poussées par Google, elles sont destinées à être le web de demain.
De grandes marques internationales comme Twitter, Starbucks Coffee et Ali Express, ou françaises comme l’Équipe ont déjà démontré l’intérêt que pouvaient avoir les PWA pour accroître l’engagement de leurs utilisateurs et donc leur rentabilité. En 2018, la comptabilité des PWA s’est accélérée et promet de grandes perspectives pour les années à venir !
LES LIMITES DES APLICATIONS MOBILES
Plusieurs enquêtes indiquent qu’une personne utiliserait moins d’une dizaine d’applications par jour !
Malgré tout, les applications mobiles commencent à montrer ces derniers temps leur limite sur un marché en pleine explosion et un usage d’Internet qui se démocratise de plus en plus. La simplicité d’usage des smartphones et leur puissance se heurtent aujourd’hui aux barrières du développement d’applications mobiles, tant du côté du développement que lors de la publication sur les boutiques d’applications que sont l’App Store d’Apple (iOS) et le Google Play (Android). Cela pose problème aux centaines d’éditeurs qui rêvent tous de se faire une place sur ce marché très lucratif des applications mobiles (800 millions d’euros sur l’année 2017, plus d’un milliard en 20185), qui se retrouvent à devoir payer des sommes toujours plus importantes pour promouvoir leurs applications au sein de l’App Store ou de Google Play.
Autant de chiffres qui confirment une tendance : nos habitudes d’utilisation sont difficiles à bouleverser, surtout pour un nouvel entrant qui souhaite proposer son application mobile à un maximum d’utilisateurs : coûts de développement, processus de soumission et de contrôle etc.
À cela s’ajoute un processus d’installation qui n’a rien d’évident pour le client : si vous ne fournissez pas directement un lien vers la boutique d’applications, votre utilisateur devra au préalable rechercher sur la boutique, trouver votre application dans la liste parmi potentiellement des dizaines d’autres puis la télécharger.
De là surgit une idée : est-il possible de passer uniquement par un site Internet pour proposer une expérience enrichie sur mobile ? C’est ce que proposent les Progressive Web Applications.
Les Progressive Web Apps, un nouvel espoir
Comment définir une PWA ?
Toute une série de critères permet de qualifier de “Progressive Web Application” un site Internet.
RESPONSIVE
La progressive web apps s’adapte à n’importe quel type d’appareil et à n’importe quelle forme d’affichage (écran mobile, écran d’ordinateur plus ou moins grand…).
INDÉPENDANTE DE LA CONNEXION
La progressive web apps s’enrichit pour être utilisable hors-ligne et donc accessible plus rapidement.
COMPORTEMENT D’UNE APPLICATION
La progressive web apps propose un affichage (écran, contenu), une navigation et des interactions dédiées. Elle s’installe sur l’écran d’accueil comme une application mobile classique.
INSTALLABLE
L’application web peut être ajoutée sous la forme d’un raccourci sur l’appareil. Il s’agit ici du critère principal permettant d’identifier une PWA sur un appareil compatible.
À JOUR
La progressive web apps se met automatiquement à jour de façon transparente pour l’utilisateur (pas besoin de télécharger des mises à jour).
SÉCURISÉ
La fiabilité de la progressive web apps est assurée par le protocole HTTPS.
OPTIMISÉE POUR LE RÉFÉRENCEMENT
L’application web est référencée par les moteurs de recherche de la même manière que les sites Internet.
ENGAGEMENT DE L’UTILISATEUR
L’expérience de l’utilisateur est enrichie grâce à des fonctionnalités propres à l’appareil, dont les notifications “push”.
PARTAGEABLE
Au sein de l’application mobile, il est possible de partager, sans friction, une page en particulier à l’aide d’une URL.
Cette liste n’est pas exhaustive et certains critères varient selon les appareils supportés.
Quelques exemples de PWA
En moins de 3 ans, plusieurs grands acteurs du web, dont des français, ont sauté le pas pour transformer leur site Internet en PWA, assurant ainsi leur réussite sur mobiles.
Filiale du géant de l’e-commerce Alibaba, AliExpress commence à s’imposer comme le bazar en ligne accessible à tous les particuliers à travers la planète.
Dès 2016, AliExpress a entamé sa transformation numérique en adaptant son site Internet (https://fr.aliexpress.com/) en Progressive Web Application. Le challenge était important pour eux puisque le commerce sur mobile se développe trois fois plus rapidement que le e-commerce dans son ensemble.
Le résultat est sans appel : le taux de conversion des utilisateurs a progressé de 104% tous navigateurs confondus, et de 82% sur Safari (iOS). Chaque session d’un utilisateur dure désormais 74% plus longtemps et 2 fois plus de pages sont visitées.
Lorsque L’Équipe décide de revoir son site Internet vieillissant (lequipe.fr, 3 à 10 millions de pages vues par jour).
En moins de 3 ans, plusieurs grands acteurs du web, dont des français, ont sauté le pas pour transformer leur site Internet en PWA, assurant ainsi leur réussite sur mobiles.
Cela passe notamment par :
– Une fidélisation des utilisateurs mobiles, habituellement volatiles car provenant des réseaux sociaux ou directement des moteurs de recherche
– Une amélioration des performances, notamment en termes de rapidité et de temps de chargement
À cela s’ajoute l’envie de proposer la lecture d’articles hors connexion et une mutualisation du travail accompli au niveau de leurs applications mobiles déjà existantes. La principale difficulté rencontrée a été dans l’optimisation du chargement de l’application web et notamment l’apparition du premier pixel dont nous parlions précédemment.
Pour cela, les équipes de développement ont revu l’intégration du CSS pour permettre d’afficher rapidement un écran de chargement puis le squelette de l’application, avant de charger les articles à la une du site.
La marque française de cosmétiques de luxe Lancôme a opté en 2017 pour une transformation de leur site Internet mobile en Progressive Web Application.
En effet, bien que son trafic ait davantage pour origine les appareils mobiles que les ordinateurs, les taux de conversion y restaient moins élevés : seulement 15% des paniers étaient transformés en commande sur mobiles contre 38% sur ordinateurs.
Il est important de noter que Lancôme a préféré ne pas développer d’application mobile mais plutôt revoir son site Internet, pour une raison simple : leur client type n’est pas un utilisateur qui reviendrait sur une application dédiée de façon régulière.
De plus, la marque souhaitait construire une expérience utilisateur adaptée à tous les types d’appareil. Leur nouveau site mobile, utilisant les technologies PWA, a permis à Lancôme d’augmenter de 17% leur taux de conversion. De plus, grâce à l’intégration des notifications push sur les appareils Android, Lancôme est parvenu à développer un lien particulier avec les 18 000 personnes ayant accepté de recevoir des notifications relatives à des promotions qui sont envoyées 4 à 5 fois par mois.
Cela permet aussi à Lancôme de relancer des utilisateurs ayant un panier abandonné, avec succès puisque cela leur a permis d’augmenter de 8% leur taux de conversion.
Résolument moderne, la chaîne de cafétérias Starbucks a développé une PWA permettant de commander sa boisson sur son téléphone avant d’aller la récupérer sur place : app.starbucks.com.
L’objectif de cette application était de pouvoir préparer sa commande tout en étant hors-ligne : une fonctionnalité indispensable alors que des zones rurales restent encore mal couvertes par les réseaux mobiles. Étant donné la quantité importante d’options possibles à indiquer lors des commandes, Starbucks a profité du développement de cette nouvelle application web pour revoir les interactions avec sa base de données interne.
Finalement, cette nouvelle application web est 99,84% plus légère que l’application iOS, ce qui en fait le support privilégié des consommateurs : L’application est simple et rapide à exécuter, et permet de prévoir sa commande en étant déconnecté. Une fois en ligne, les prix et les cafétérias aux environs s’affichent et il est dès lors possible de valider sa commande.
Trivago, premier site comparateur d’hôtels, a également pris le virage des PWA pour s’inscrire dans ce que ses équipes décrivent comme étant “la prochaine évolution du Web”.
Pour cela, Trivago s’est concentré sur trois fonctionnalités essentielles à leur stratégie mobile :
– le mode hors-ligne
– les notifications push
– et l’ajout à l’écran d’accueil
Des fonctionnalités clés qui permettent de rendre indissociable l’application mobile (téléchargeable sur le Play Store), de leur nouveau site mobile.
Le succès est là aussi au rendez-vous puisque 500 000 utilisateurs ont ajouté l’application à leur écran d’accueil sur mobile, avec un taux d’engagement en hausse de 150%.
Les notifications push permettent également à Trivago de conserver un lien étroit avec leurs utilisateurs qui préfèrent cette nouvelle forme de contact à celui du mail.
Le mode hors ligne est particulièrement utile lorsque la couverture réseau n’est pas complète comme dans les pays émergeants où Trivago ambitionne de se développer.
Les questions à se poser avant de se lancer
D’où proviennent vos utilisateurs ?
La provenance naturelle des utilisateurs est un élément central dans une stratégie mobile. Si votre positionnement existe déjà sur le web, il est alors préférable d’opter pour une Progressive Web Application afin de proposer à vos utilisateurs une expérience améliorée sans changer leur façon d’utiliser votre produit.
À contrario, si vous êtes uniquement présent sur des applications (ordinateur ou mobiles), il est plus difficile de changer les habitudes de vos consommateurs en leur proposant une PWA.
Quelle solution de déploiement ?
Le déploiement des applications mobiles peut être rendu fastidieux par les multiples contraintes qu’imposent App Store et Google Play, tant pour le développeur que pour le consommateur.
Aussi, rien ne sera plus efficace que de pouvoir partager son application web à l’aide d’un lien qu’il suffira ensuite d’ajouter à l’écran d’accueil de son smartphone.
C’est pour cela que les Progressive Web Applications sont particulièrement recommandés dans le cas des applications Business to Employee (B2E).
| Android |
|---|
|
Sur Android, Google a poussé au maximum la compatibilité des principales fonctionnalités des Progressive Web Applications que ce soit pour Google Chrome ou Mozilla Firefox. Les applications peuvent être installées, et utiliser les Service Workers, la mise en cache et surtout les notifications push. Il s’agit aujourd’hui de la plateforme la plus en avance sur la compatibilité avec les Progressive Web Applications. |
| Processus d’installation d’une Progressive Web Application sur un appareil Android. |
 |
| IOS |
|---|
| iOS a entamé en 2018 sa compatibilité avec les Service Worker. Il est donc désormais possible d’installer une Progressive Web Applications sur son écran d’accueil depuis le navigateur Safari d’iOS.En revanche cette fonctionnalité est encore en cours de développement et des soucis persistent à l’heure où nous écrivons ces lignes.À noter que les notifications push ne sont pas encore prises en charge par Safari ni même par un autre navigateur sur iOS comme Google Chrome. |
| Processus d’installation d’une Progressive Web Application sur un appareil Iphone. |
 |
