Free HTML to Vous avez un site web et vous voulez qu'il soit sur les téléphones des gens sous forme d'application. Cherchez comment faire et vous tomberez sans cesse sur trois termes : PWA, TWA et WebView. Ils se ressemblent, ils affichent tous des pages web, et ils sont souvent mal expliqués.
En réalité, ils sont très différents, et choisir le bon vous évite beaucoup de travail à refaire. Voici ce qu'est chacun, ce qu'il peut faire ou non, et quand il est pertinent.
Option 1 : une Progressive Web App (PWA)
Une PWA est un site web qui se comporte davantage comme une application. Elle possède un manifeste d'application web (un petit fichier JSON avec le nom, l'icône et les couleurs) et généralement un service worker, un script qui peut mettre des fichiers en cache pour que le site se charge même sans connexion. Lorsqu'une personne visite une PWA dans un navigateur compatible, elle peut l'installer sur l'écran d'accueil. Elle s'ouvre alors dans sa propre fenêtre, sans barre d'adresse.
Les avantages : il n'y a pas d'application séparée à compiler. Vous mettez à jour votre site web et chaque utilisateur a immédiatement la nouvelle version. Avec un service worker, vous pouvez le faire fonctionner hors ligne.
Les limites : les gens doivent d'abord trouver votre site puis toucher Installer, ce que beaucoup ne font jamais. Une simple PWA n'est pas un fichier que vous pouvez importer sur Google Play, ni un APK que vous pouvez donner à quelqu'un. L'accès aux fonctions du téléphone dépend de ce que le navigateur expose via les API web.
Convient bien à : les sites que les gens visitent déjà souvent, où l'installation est un bonus plutôt que l'objectif principal.
Option 2 : une Trusted Web Activity (TWA)
Une Trusted Web Activity est une petite application Android qui ouvre votre PWA en plein écran avec le navigateur de l'utilisateur, comme Chrome. Elle repose sur le protocole Custom Tabs : la page est donc affichée par le navigateur lui-même plutôt que par l'application.
Il y a deux exigences. D'abord, il faut prouver que votre site et votre application appartiennent au même propriétaire. Cela se fait avec Digital Asset Links : vous placez sur votre domaine un fichier à l'adresse /.well-known/assetlinks.json qui indique le nom du package de votre application et l'empreinte de son certificat de signature. Ensuite, la documentation de Google indique que votre site doit remplir les critères d'ajout à l'écran d'accueil, ce qui signifie en pratique une vraie PWA avec un manifeste. L'outil de Google pour créer des TWA est Bubblewrap, un outil en ligne de commande pour Node.js.
Si la vérification échoue, ou si le navigateur ne prend pas en charge les TWA, Google indique qu'elle bascule sur un Custom Tab avec une simple barre de navigateur au lieu du plein écran. C'est la surprise la plus fréquente.
Les avantages : vous obtenez une vraie application Android qui peut aller sur Google Play, et le contenu est votre PWA en ligne : les mises à jour web apparaissent donc instantanément.
Les limites : il vous faut une PWA fonctionnelle et le contrôle du domaine pour héberger le fichier asset links. L'empreinte dans ce fichier doit correspondre à la clé qui signe l'application réellement installée par les utilisateurs, et avec la signature d'application Play, la copie issue de Google Play est signée avec la clé de signature d'application de Google : Google suggère donc d'indiquer les empreintes de cette clé et de votre clé d'importation. Les fonctions du téléphone restent limitées à ce que le navigateur offre via les API web. Et l'application dépend de la présence d'un navigateur compatible.
Convient bien à : les équipes qui ont déjà une PWA solide sur leur propre domaine et veulent la mettre sur le Play Store avec un minimum de code supplémentaire.
Option 3 : une application WebView
Une application WebView est une application Android native qui affiche du contenu web dans sa propre fenêtre grâce au composant WebView d'Android. La WebView est un moteur de navigateur sans le navigateur autour : pas de barre d'adresse, pas d'onglets, juste votre page. La documentation de Google la présente comme le choix pour afficher votre propre contenu web lorsque vous voulez de la souplesse dans l'interface.
La grande différence avec une TWA, c'est le contrôle. L'application décide de ce que fait le bouton Retour, de l'apparence de l'écran de démarrage, de la présence de menus natifs, de ce qui s'affiche quand le réseau est coupé et des liens qui s'ouvrent dans l'application. Android permet aussi à une application WebView de relier JavaScript au code natif avec addJavascriptInterface, pour que votre page puisse appeler de vraies fonctions du téléphone qui ne sont pas disponibles sur le web. La documentation de Google ajoute un avertissement important : n'exposez ce pont qu'à du HTML et du JavaScript que vous avez écrits vous-même.
Les avantages : fonctionne avec n'importe quel site web ou dossier de fichiers HTML, sans PWA, manifeste ni fichier asset links. Les pages peuvent être intégrées à l'application pour s'ouvrir instantanément hors ligne. Les fonctions natives sont accessibles via un pont.
Les limites : l'application a son propre stockage, donc la connexion d'un utilisateur à votre site web dans Chrome n'est pas reprise. Si vous enveloppez un site en ligne, c'est à vous de mettre l'application à jour quand quelque chose de natif doit changer.
Convient bien à : les applications HTML, les jeux, les outils, les sites de petites entreprises, les applications internes d'entreprise et tout ce qui profite de fonctions natives en plus.
Côte à côte
Fonctions du téléphone
- PWA : toutes les API web que le navigateur prend en charge.
- TWA : pareil, puisque c'est le navigateur qui affiche la page.
- Application WebView : les API web, plus tout ce que l'application expose via un pont JavaScript.
Hors ligne
- PWA et TWA : le mode hors ligne fonctionne si votre service worker met en cache ce qui est nécessaire.
- Application WebView : les pages intégrées fonctionnent hors ligne sans service worker ; les applications de site web peuvent afficher leur propre écran hors ligne.
Google Play
- PWA : pas toute seule. Il faut l'empaqueter, généralement sous forme de TWA.
- TWA et application WebView : ce sont toutes deux des applications Android normales qui peuvent être publiées sous forme d'AAB.
Une règle de Play s'applique aussi bien aux TWA qu'aux applications WebView. La politique de Google Play sur le spam n'autorise pas les applications dont le but principal est d'afficher un site web dans une webview sans l'autorisation du propriétaire du site. Enveloppez votre propre site, ou un site pour lequel vous avez l'autorisation. Play n'autorise pas non plus les applications aux fonctionnalités très limitées : donnez aux gens une raison d'installer l'application plutôt qu'un simple favori.
Lequel choisir ?
- Vous voulez juste un bouton d'installation sur votre site : PWA.
- Vous avez une PWA aboutie sur votre propre domaine et voulez la mettre sur Play avec du contenu web en direct : TWA.
- Vous voulez des fonctions natives, du HTML hors ligne, des menus et un contrôle total, ou vous n'avez pas de PWA : application WebView.
Comment Free HTML to APK s'y prend
Free HTML to APK crée des applications WebView. Vous pouvez partir de l'URL d'un site web, de fichiers HTML, d'un ZIP ou d'un dossier, et obtenir un APK signé ainsi qu'un AAB pour Google Play. Le générateur du site freehtmltoapk.com est gratuit, ne demande pas de compte et n'ajoute pas de filigrane, et l'application Android « HTML to APK: Website to App » fait de même sur votre téléphone.
Vos pages peuvent utiliser le pont JavaScript intégré FreeApp pour des fonctions du téléphone comme la vibration, les notifications, l'appareil photo, la lecture de QR codes et de codes-barres, la localisation et le partage de fichiers. Un appel est aussi simple que ceci :
<button onclick="FreeApp.vibrate(30)">Tap</button>
Les applications HTML intégrées fonctionnent entièrement hors ligne, et les applications de site web affichent une page hors ligne conviviale et se reconnectent quand la connexion revient. Comme il s'agit d'une application WebView, il n'y a pas de fichier Digital Asset Links à configurer. Si vous avez déjà une PWA, son service worker continue de fonctionner quand l'application la charge par son URL.
Pour en savoir plus, consultez PWA en APK ou site web en application, et choisissez la voie qui convient à votre projet.