Les Progressive Web Apps ou “PWA”, sont aujourd’hui des outils très puissants qui combinent le confort d’une application mobile ainsi que les fonctionnalités d’un navigateur web. Des avantages et des contraintes qui disparaissent, les PWA sont-elles une révolution pour le web ?
Table
Qu’est ce que les Progressive Web Apps ?
Aux alentours de 2007 c’est l’arrivée des smartphones, et donc du début de la consultation du web depuis un mobile. Les sites internet et la technologie qui les entouraient n’étaient pas encore à la hauteur d’une bonne expérience utilisateur. Ainsi les applications mobiles ont vite pris le dessus. Mais depuis 2010 les navigateurs sont bien plus puissants et c’est en 2015 que né l’appellation “Progressive Web App”.
Une progressive Web App, est à mi-chemin entre une application mobile qu’on trouve sur un store tel que : PlayStore ou encore l’AppStore, et un site web pour mobile que l’on consulte directement dans son navigateur.
Mais alors qu'est ce qu'une PWA concrètement ?
Concrètement, une PWA c’est un site internet, avec toutes ses pages et son contenu. Or elle est spécialement conçue pour être utilisée sur mobile. Ainsi elle offre une expérience utilisateur inégalable, des fonctionnalités supplémentaires et l’affranchissement des stores d’apps, tant d’avantages sur lesquels nous reviendrons plus tard.
Exemples connus de PWA
Plusieurs grandes marques ont déjà développé et tiré parti des PWA, telles que : Spotify la plateforme de streaming de musique en ligne, Pinterest la communauté d’échange de contenu photo et vidéo, ou même Lancôme la boutique de cosmétiques de luxe. Il en existe tant d’autres et bien connu également.
Comment fonctionne une PWA ?
Les PWA sont appuyés par plusieurs technologies et processus. Notamment un “Service Worker”, c’est un script nécessaire à certaines fonctions telles que les notifications push et la mise en cache. Il faut aussi penser à ajouter un fichier manifest json. En effet, lui aussi est très utile, il a de nombreux atouts comme l’ajout d’une description, d’une icône, l’ajout de la barre d’adresse ou non ainsi que sa couleur.
Pourquoi créer une Progressive Web App ?
Les avantages pour l'utilisateur
Les avantages d’utiliser une Progressive Web App pour l’utilisateur sont nombreux. En effet c’est le parfait mélange entre les fonctionnalités d’un navigateur web et le confort d’utilisation des applications mobiles natives. Ils apportent chacun une amélioration à l’expérience utilisateur qu’éprouvera l’internaute.
- Un accès hors ligne, notamment grâce au Service Workers.
- Une immersion réelle, en personnalisant ses interfaces il est possible de désactiver la barre de recherche par exemple, assurant l’impression d’être sur une application mobile.
- Stockage et temps de chargement, en effet pas de téléchargement et pas de mise à jour, pas de stockage requis et des temps de chargement très courts.
- Sécurisé, comme elle suit le fonctionnement d’un site internet on peut la sécuriser comme telle, comme l’utilisation du protocole HTTPS.
Les avantages pour l’entreprise
Il y a de nombreux avantages pour une entreprise à se pencher sur la création d’une WebApp.
- Multisupport, car même si elle est conçue comme une application native, elle est consultable sur un ordinateur et tout autre support.
- Référencement Web, comme les PWA sont indexés par Google, elles sont donc référencés, il est donc possible de mettre en place autour une campagne SEO. Si vous souhaitez améliorer votre référencement sur le web, notre agence peut vous accompagner.
- Icône d’application, grâce au fichier manifest, il est possible de mettre une icône à votre PWA et de l’intégrer sur l’écran d’accueil d’un smartphone.
- Coûts réduits, le développement de PWA est très souvent moins coûteux que celui d’une application native car il prend moins de temps.
- Mise à jour en temps réel, le moindre changement est effectif pour chaque utilisateur sans besoin de mettre à jour.
Alors pourquoi faut-il songer à créer une Progressive Wep App ? Car vous allez proposer une expérience utilisateur adaptée à tout le monde et tout type de supports, vous garantissant une baisse de taux de rebonds, une progression de votre nombre de visites, ainsi que des temps de chargements très réduits. De plus, une utilisation hors connexion permettra même à vos utilisateurs de mettre des produits dans leur panier, car celui-ci sera mis à jour dès sa prochaine connexion à Internet.
Comment créer une Progressive Web App ?
Une des solutions consiste à coder tout simplement, en choisissant votre framework et puis en écrivant toutes ces lignes de code. Il existe cependant quelques outils qui peuvent vous aider dans votre tâche.
LightHouse, est décrit comme étant un Chrome Dev Tool, il est capable d’exécuter votre application et de la tester sous différents angles afin de vous attribuer une note sur 100 basé sur plusieurs critères comme par exemple : si elle utilise HTTPS et redirige HTTP vers HTTPS, si le chargement des pages est suffisamment rapide en 3G, si elle invite bien l’utilisateur à installer l’application, si elle peut être ajoutée sur l’écran d’accueil, …
AMP, est un outil qui permet d’optimiser le temps de chargement de vos images et de votre code JS. De plus, son gros point fort est que Google met en avant les sites qu’ils l’utilisent.
AppyPie et GoodBarber, permettent tout deux de créer des PWA sans coder ! Le tout restant à des prix abordables !
Les PWA se positionnent donc comme des solutions d’avenir très prometteur, que ce soit directement comme alternative ou simplement comme solution complémentaire, elles possèdent une panoplie d’avantages auxquels il est vital de s’intéresser, pour vous comme pour vos utilisateurs.
Trois idées à retenir
C’est quoi une Progressive Web App ?
C’est une application web mais qui est conçue dans le fonctionnement comme un site web avec sa suite de pages. Cependant elle bénéficie de nombreuses autres technologies qui lui permettent de tirer du meilleur parti à la fois des sites internet et des applications
Quels sont les avantages d’une PWA ?
Les avantages d’une PWA sont très nombreux, que ce soit pour l’utilisateur ou le créateur de la PWA. En passant de l’usage de la PWA hors ligne, ou encore le fait de pouvoir cacher la barre d’adresse pour plus d’immersion et enfin l’ajout d’une icône sur l’écran d’accueil.
Comment créer une Progressive Web App ?
Pour créer une progressive Web App, vous pouvez tout simplement la coder en code brut, vous pouvez aussi la créer sans code grâce à des solutions comme GoodBarber. Et pour vous aider dans la conception de ces dernières, il existe aussi de nombreux outils.