PrestaShop : pourquoi utiliser une Progressive Web App pour votre site e-commerce ?

Publié le , par Xavier Bonnaud

Progressive Web App PrestaShop

L’évolution des usages nous amène à constater que désormais la grande majorité des consultations de site e-commerce s’effectuent depuis un support mobile (smartphone ou tablette). De plus en plus d’achat se font depuis ces supports alors qu’ils étaient encore marginaux il y a 2 ou 3 ans.

Il est démontré qu’un site lent à s’afficher, notamment sur mobile, va amener une grande majorité des utilisateurs à quitter le site prématurément. Nous vous conseillons tout mettre en œuvre pour que votre boutique s’affiche le plus rapidement possible également sur ces supports.

Disposer d’une version responsive de sa boutique PrestaShop est une première réponse à ces besoins. Les technologies web actuelles nous permettent d’aller encore plus loin notamment grâce à ce qu’on appelle le Progressiv Web App.

Comment optimiser l’affichage sur mobile de son site PrestaShop ?

Une fois la version responsive évoquée dans la mise en place d’un projet digital, la notion d’application native est abordée.
Bien que certaines grandes enseignes puissent y trouver un intérêt, le développement d’applications natives est souvent très lourd en termes de développement, de budget, d’entretien…etc..
La technologie AMP peut en partie répondre au besoin des e-commerçants pour disposer d’un site mobile performant.
Son avantage est qu’elle est très rapide. Son défaut est la personnalisation graphique, laissée de côté au profit de la vitesse.
La Progressive Web App (PWA) est la solution technique la plus tournée vers l’avenir du e-commerce. Nous vous expliquons en quoi :

Qu’est ce qu’une progressive web app ?

Le nom de Progressive Web App (PWA) est dans le langage courant du digital depuis déjà quelques années. Cependant, cette technologie regroupant différents concepts est assez floue pour un grand nombre de personnes.

Le cœur du système est relativement complexe à exposer, ce qu’il faut retenir c’est que la progressive web app est, à l’arrivée, un savant mélange de notions d’applications utilisées dans le monde du web. Elle permet d’accéder au site web grâce à un bouton d’application sur son smartphone, en disposant de fonctionnalités applicatives telles que le plein écran.

Comment fonctionne une progressive web app ?

Le navigateur identifie la présence de la progressive web app sur le site et va proposer au visiteur de la mettre en page d’accueil de son smartphone. C’est à ce moment-là, qu’une icône va pouvoir se créer sur l’écran de menu de son smartphone ou tablette.

Pour être éligible à la PWA, votre site doit respecter un certain nombre de normes, comme par exemple :

  • être en HTTPs
  • déclarer une icône
  • déclarer une couleur de fond du navigateur

Quand votre site est compatible PWA, celle-ci se matérialise de différentes manières :

  • La possibilité d’affichage d’un bandeau permettant l’installation de l’application.
installation pwa
Référence client Profileo www.poupepoupi.com
  • L’icône de votre application apparaît sur le téléphone (une fois l’installation faite).
Référence client Profileo www.poupepoupi.com
ajout de l’icône sur l’accueil du téléphone mobile
  • Une couleur de fond du navigateur en accord avec votre site (si l’application n’a pas été installée).
  • Un lancement de l’application en plein écran si celle-ci a été installée. Les barres du navigateur n’apparaissent pas donnant l’effet d’être sur une application native et non un navigateur web.
page de lancement progressive web app
Lancement de l’application Poupe Poupi
ouverture de la pwa sans les barres de navigateur
Affichage sans les barres du navigateur

  • Une mise en cache plus efficace qu’avec un navigateur classique. Cela améliore les temps d’affichage et allège votre hébergement d’autant de ressources à transférer.

Visuellement, la Progressive Web App restitue l’affichage de votre boutique dans sa version responsive, mais encapsulé dans une application.

Les avantages de la PWA :

  • Temps de chargement du site réduit : des performances accrues, un hébergement moins sollicité
  • Affichage simplifié : il n’y a pas de changement de thème PrestaShop à prévoir
  • Accessibilité immédiate pour les mobinautes : le temps de chargement d’une application peut engendrer des pertes d’utilisateurs, de plus la mise en cache de l’application permet des temps d’affichage plus rapides.
  • Coût de mise en place léger

Pourquoi choisir le module PWA de Profileo pour votre site PrestaShop ?

icone module PWA

Le module “Profileo – Progressive Web App” vous permet la mise en place rapide d’une application mobile de votre boutique.
Vous n’aurez pas à implémenter les différentes normes à respecter : le module s’en charge pour vous !
De votre côté vous n’aurez qu’à sélectionner les couleurs, définir le nom de l’application, et personnaliser vos logos.

personnalisation de la progressive web app Profileo
Capture du back office du module Profileo Progressive Web App

Le module « Profileo – Progressive Web App est disponible sur le Addons PrestaShop.

Cliquez ci-dessous pour accéder au détail du module