.svg)
Depuis quelques années, les progressive web app (PWA) ont fait leur apparition sur le web et permettent désormais aux entreprises de proposer des web app sur l’écran des smartphones de la même manière qu’une application native. Vous vous demandez quel en est l’intérêt ? L’agence Scroll vous explique ici pourquoi faire une PWA grâce à Bubble et quels en sont les avantages.
Qu’est-ce qu’une PWA ?
Une PWA (progressive web app) est une application web développée grâce à différents langages de développement comme le HTML5, le CSS3 ou le JavaScript et exécutée sur un navigateur web. Le fonctionnement d’une PWA est très proche de celui d’une application native que l’on pourrait télécharger sur un store.
Pour être considérée techniquement comme une PWA, l’application doit présenter plusieurs éléments importants : le HTTPS, un ou plusieurs Service Workers et un fichier manifest.
Le HTTPS signifie que l’application est hébergée sur un réseau sécurisé. Cela permet de présenter une application de confiance et sécurisée.
Le service worker est un script exécuté en parallèle de la page ouverte sur le navigateur web et qui permet de présenter des pages rapides, fiables, hors-ligne et des fonctionnalités supplémentaires.
Le fichier manifest est un fichier au format json qui va contenir et contrôler l’affichage des différents éléments nécessaires pour que votre site apparaisse comme une application. On retrouve par exemple le nom de l’application, l’URL ainsi que les icônes.
L’objectif de la PWA est de créer une application qui bénéficie de la visibilité de l’accessibilité d’un site web et des fonctionnalités et de la puissance d’une application.
Pourquoi faire une PWA sur Bubble ?
Il existe plusieurs raisons de transformer votre application en PWA grâce à Bubble. La PWA dispose de caractéristiques précises :
Il s’agit d’une application web donc hébergée et exécutable sur le web mais pensée pour ressembler à une application native.
Une PWA peut proposer différentes fonctionnalités comme l'utilisation du micro, du GPS ou encore de la caméra grâce aux services workers.
Lors de son utilisation, ses fonctionnalités sont mémorisées dans le cache afin de préparer une utilisation future qui pourrait se faire hors-ligne.
Elle est compatible sur tous les navigateurs.
Enfin, elle est téléchargeable par l’utilisateur si celui-ci le souhaite.
Les avantages d’une PWA
Transformer son application en PWA grâce à Bubble permet plusieurs avantages :
La PWA pouvant être utilisée comme un site web et comme une application, elle permet donc d’utiliser certaines fonctionnalités de l’appareil en plus des fonctionnalités web. Il est donc possible d’utiliser le micro, le GPS, les notifications push, la caméra.
L’installation n’est pas requise. Sur une PWA l’accessibilité est plus intéressante qu’une application native car l’application est hébergée en ligne. Elle permet donc d’être accessible instantanément via un URL. Cela signifie aussi que vous ne dépendez pas des conditions d'acceptation des magasins d'applications.
Au même titre qu’un site web classique, la PWA se met à jour très facilement et très rapidement car il suffit de faire une simple mise à jour sur le serveur.
La PWA étant disponible sur différents supports, smartphones, tablettes et ordinateurs, cela permet d’élargir considérablement le nombre d'utilisateurs pouvant utiliser l’application.
Les PWA bénéficient du SEO. Comme pour les sites web, elles profitent des mêmes possibilités de référencement sur les moteurs de recherche et sont donc crawler par Google.
Pour des performances quasiment similaires à une application native, une PWA est beaucoup moins gourmande en ressources et utilise moins de stockage.
Sur smartphone, il est possible de retrouver l'application directement sur l’accueil de son téléphone comme une application native.
5 astuces pour créer sa PWA sur bubble
Pensez au logo
Votre PWA apparaîtra sur l’écran d’accueil d’un smartphone, vous devez impérativement travailler le logo de l’application. Le logo de votre application doit être lisible, impactant et adapté aux différents supports. Votre application devra se retrouver au milieu des autres applications natives et PWA.
Supprimez le footer
Sur mobile, il est rare que les utilisateurs descendent tout en bas des pages. Il n’est donc pas nécessaire d’utiliser un footer. Ici vous pouvez donc le supprimer et afficher différemment dans la page les informations importantes que vous regroupiez auparavant dans le footer.
Imaginez votre PWA comme une app native
Lorsque que vous travaillerez l’UX de votre PWA imaginez là comme une application native ! Évitez d’utiliser des liens classiques comme on retrouve sur les sites web, privilégiez les boutons plus lisibles et adaptés aux écrans tactiles. Pensez aussi à adapter le menu de votre application.
Travaillez les chargements
Pour imiter les applications natives, pensez à travailler les différents écrans de chargement. Ajoutez un écran de démarrage, ajoutez des effets esthétiques aux chargements des éléments comme les images.
N’oubliez pas le desktop
Gardez en tête que votre application est utilisable sur desktop. Attention à ne pas suroptimiser votre PWA pour le mobile et délaisser la version desktop. Même si la priorité reste aujourd’hui le mobile, il est important que l’application soit compatible et adaptée correctement aux différents supports.
Exemples de PWA
Voici 3 exemples de progressive web app que vous connaissez surement tous aujourd’hui :
Agence Bubble : créez votre PWA avec Scroll
Bubble est un de nos outils principaux chez Scroll. Nous l’utilisons quotidiennement dans de nombreuses réalisations. C’est pourquoi, nous avons mis en place l’agence Bubble. Grâce à notre parfaite maîtrise de Bubble et notre savoir-faire dans ce domaine, nous accompagnons nos clients sur des réalisations diverses et variées. Nous utilisons la puissance de Bubble pour proposer des applications inédites et construites sur-mesure, en un temps record.
Vous souhaitez créer une PWA ? Contactez-nous pour estimer votre projet !
.webp)
.svg)
.svg)
.svg)