Comment publier une PWA sur l'App Store et Google Play

Une application Web progressive (PWA) est un site Web qui peut être installé à partir du navigateur. C'est utile, mais la plupart des clients recherchent toujours des applications sur l'App Store et Google Play. Si votre PWA fonctionne déjà bien sur un téléphone, vous pouvez la packager pour les deux magasins sans la réécrire.

Le problème est que les deux magasins traitent les applications Web de manière très différente. Google propose une voie officielle pour les PWA. Apple ne le fait pas, et son équipe d'évaluation attend plus qu'un site Web reconditionné. Ce guide couvre les options réalistes, les règles importantes et une liste de contrôle pour faire passer une PWA en revue.

Pourquoi publier une PWA dans les magasins d’applications ?

Une PWA offre déjà aux utilisateurs une invite d'installation, une icône sur l'écran d'accueil et une expérience en plein écran. Les listes de magasins ajoutent des éléments qu'une installation de navigateur ne peut pas :

• Discovery. Les gens recherchent dans les magasins des produits comme le vôtre, et une liste vous donne une page qui s'y classe.
• Trust. Une fiche Play Store avec des avis et un éditeur vérifié est un signal plus fort que "Ajouter à l'écran d'accueil" sur un site Web.
• Installation fiable. Sur iPhone, l'installation d'une PWA depuis le navigateur est masquée dans le menu de partage. Une installation en magasin se fait en un seul clic.
• Chaînes natives. Une application packagée peut utiliser des notifications push et des liens profonds via la plate-forme plutôt que de dépendre de ce que le navigateur expose.

Rien de tout cela ne signifie que vous devez abandonner la PWA. Le site Web reste le produit ; les applications du magasin sont un autre moyen d'y accéder. Pour les compromis entre une PWA, une application WebView et une version entièrement native, lisez PWA vs natif vs WebView.

Option 1 : activité Web de confiance pour Google Play

Google Play prend en charge les PWA via un Activité Web de confiance (TWA). Une TWA est une application Android qui ouvre votre PWA en plein écran à l'aide du navigateur Chrome installé par l'utilisateur, au lieu d'une WebView intégrée. Selon la documentation de Chrome, l'application et le site Web se vérifient mutuellement avec Digital Asset Links, ce qui prouve que les deux proviennent du même développeur.

Des outils tels que Papier bulle (un outil en ligne de commande) et PWABuilder générez et construisez le projet Android pour vous. Les étapes habituelles sont :

1. Assurez-vous que votre PWA dispose d'un manifeste d'application Web valide, d'une URL de démarrage accessible via HTTPS et d'icônes.
2. Générez le projet Android avec Bubblewrap ou PWABuilder.
3. Publiez un fichier Digital Asset Links sur votre domaine afin que l'application puisse être vérifiée.
4. Créez un ensemble d'applications Android signé et téléchargez-le sur la console Google Play.

Ce qu’il faut savoir avant de choisir cet itinéraire :

• L'expérience dépend de l'installation et de la mise à jour de Chrome sur l'appareil. Si la vérification échoue ou si Chrome n'est pas disponible, les utilisateurs peuvent voir une barre d'outils du navigateur.
• L'application hôte ne peut pas lire directement votre contenu Web, vos cookies ou votre stockage local. La communication avec le code natif est limitée.
• Vous avez toujours besoin d'un compte Play Console, d'une fiche Play Store, d'une politique de confidentialité et des exigences de test que Google applique aux nouveaux comptes personnels. Notre guide de publication les parcourt, y compris la règle du test fermé.

Un TWA est un bon choix si vous êtes à l'aise avec les outils de ligne de commande et que vous n'avez besoin que d'Android.

Option 2 : emballage DIY pour iOS

Apple n'a pas d'équivalent TWA. Pour mettre une PWA dans l'App Store, vous avez besoin d'une application iOS native qui la charge, généralement via WKWebView. La version DIY ressemble à ceci :

1. Créez un projet Xcode sur un Mac.
2. Chargez votre PWA dans une vue Web et ajoutez des icônes, un écran de lancement et une navigation.
3. Inscrivez-vous au programme pour développeurs Apple et enregistrez un identifiant de bundle.
4. Signez, archivez et téléchargez la version sur App Store Connect via la chaîne d'outils d'Apple.
5. Testez avec TestFlight, complétez la liste et les réponses en matière de confidentialité, puis soumettez-les pour examen.

PWABuilder peut générer un projet iOS comme point de départ, mais vous l'ouvrez et le signez toujours vous-même, ce qui nécessite un Mac et Xcode. Nous couvrons ce processus plus en profondeur dans comment convertir un site Web en application iOS sans Xcode ni Mac.

Le plus gros problème n’est pas technique. Il s’agit de savoir si l’application sera acceptée, ce que nous aborderons ensuite.

Ce qu'Apple attend d'un wrapper PWA

Les directives d'évaluation des applications d'Apple indiquent qu'une application « doit inclure des fonctionnalités, du contenu et une interface utilisateur qui l'élèvent au-delà d'un site Web reconditionné » (ligne directrice 4.2). Une PWA chargée dans une vue Web nue est exactement le type de soumission ciblé par les lignes directrices.

Autres points à connaître :

• Ligne directrice 4.2.2 dit qu'à part les catalogues, les applications ne doivent pas principalement être des supports marketing, des coupures Web, des agrégateurs de contenu ou une collection de liens.
• Ligne directrice 2.1 attend une version finale et fonctionnelle et des informations d'identification de démonstration si votre application dispose d'une connexion.
• Ligne directrice 4.2.6 indique que les applications créées à partir d'un modèle commercialisé ou d'un service de génération d'applications sont rejetées à moins qu'elles ne soient soumises directement par le fournisseur du contenu de l'application. Publiez sous votre propre compte de développeur, et non celui d'un fournisseur.

Aucune formule ne garantit l’approbation, et aucun outil ne peut le promettre. Ce que vous pouvez faire, c'est donner aux évaluateurs une raison de voir une vraie application : navigation native, notifications push auxquelles les utilisateurs acceptent, liens profonds fonctionnels et expérience de chargement et hors ligne soignée. Pour une présentation complète des règles de révision, voir Ligne directrice Apple 4.2 : Apple va-t-il rejeter une application de site Web ?.

Option 3 : utiliser un convertisseur pour les deux magasins

Un convertisseur tel que SiteTo.App effectue le packaging pour les deux plates-formes à partir de votre URL. Vous entrez l'adresse de votre site Web, définissez le nom de l'application, l'icône, les couleurs, l'écran de démarrage et la navigation, la prévisualisez sur votre téléphone et demandez une version.

D'après le fonctionnement actuel du produit :

• Les versions Android peuvent être produites sous forme d’APK ou d’AAB.
• Les versions iOS sont signées avec votre compte de développeur Apple et livrées à TestFlight dans votre compte App Store Connect, et vous les récupérez à partir de là pour les soumettre pour examen.
• Les notifications push sont configurées via Firebase.
• Le site Web reste la source de vérité, de sorte que les modifications que vous envoyez sur le Web atteignent les utilisateurs de l'application sans nouvelle version du magasin.
• Le prix est de 29 $ pour Android, de 79 $ pour iOS ou de 99 $ pour les deux. Les frais de compte développeur Apple et Google sont distincts.

SiteTo.App traite votre PWA comme un site Web : il charge votre URL publique dans l'application. Le comportement des fonctionnalités spécifiques à PWA, telles que la mise en cache du service-worker, les pages hors ligne ou l'invite d'installation Web dans le shell de l'application, dépend de la vue Web utilisée par l'application. Testez-les donc dans l'aperçu plutôt que de supposer. Les notifications push dans l'application sont configurées via Firebase plutôt que via le push Web de votre PWA.

Vous pouvez comparer les convertisseurs dans notre meilleur guide de conversion de site Web en application, et voyez le côté coût dans combien coûte la transformation d'un site Web en application. Si votre site fonctionne sur une plateforme spécifique, le pages de la plateforme expliquez quoi vérifier pour cette pile.

Quel itinéraire faut-il emprunter ?

• Android uniquement, à l'aise avec la ligne de commande : un TWA via Bubblewrap ou PWABuilder est une bonne voie officielle.
• iOS et vous disposez d'un Mac et d'un développeur à l'aise avec Xcode : un wrapper DIY donne un contrôle total, mais vous êtes propriétaire de chaque reconstruction et des mises à jour du SDK.
• Les deux magasins, sans posséder de projets natifs : un convertisseur représente le moindre effort et vous conservez le site Web comme produit.
• Une PWA qui dépend fortement du comportement hors ligne ou de la synchronisation en arrière-plan : testez attentivement avant de vous engager, quelle que soit la voie que vous choisissez.

Préparez votre PWA avant de l’emballer

Une fiche Play Store expose les faiblesses cachées par un onglet de navigateur. Avant d'emballer :

• Vérifiez que chaque écran est réactif et utilisable avec le toucher et le geste de retour du système.
• Assurez-vous que la connexion, le paiement et les téléchargements de fichiers fonctionnent dans une vue intégrée, y compris toute authentification tierce qui ouvre une fenêtre contextuelle ou une redirection.
• Ajoutez une page de politique de confidentialité et une page d'assistance accessibles sans vous connecter.
• Décidez quels liens externes s'ouvrent dans l'application et lesquels ouvrent le navigateur.
• Gérez les états hors ligne et d’erreur avec un message clair plutôt qu’un écran vide.
• Supprimez tout message demandant aux utilisateurs d'« installer cette application » puisqu'ils l'ont déjà fait.

Le liste de contrôle de préparation et planificateur des coûts peut vous aider à repérer les lacunes avant de construire.

Liste de magasin et liste de contrôle d'évaluation

• Les comptes de développeur appartiennent à votre entreprise et non à un entrepreneur.
• Le nom de l'application, l'icône et les captures d'écran affichent la véritable application et correspondent à la version.
• La politique de confidentialité et les réponses à la confidentialité du magasin couvrent le site Web, les analyses et les outils de paiement chargés dans l'application.
• Les informations d’identification des évaluateurs fonctionnent et sont incluses dans les notes d’évaluation.
• L'application ajoute une valeur native au-delà du site Web, comme la navigation, les notifications ou les liens profonds.
• Les deux versions ont été testées sur des appareils réels sur une nouvelle installation.
• Quelqu’un est chargé de regarder les messages d’évaluation et de répondre avec des détails.

Questions fréquemment posées

Puis-je publier une PWA sur l’App Store sans wrapper natif ?

Non. L’App Store distribue uniquement des binaires d’applications natives. Une PWA doit être regroupée dans une seule et l'application packagée doit respecter les directives d'Apple.

Une PWA est-elle autorisée sur Google Play ?

Oui. Google prend en charge les PWA via Trusted Web Activities et vous pouvez également publier une application wrapper.

Ma PWA continuera-t-elle à fonctionner hors ligne dans l’application ?

Cela dépend de l'itinéraire et de la vue Web. Testez le comportement hors ligne dans l’aperçu ou dans une version de test au lieu de supposer qu’il se répète.

Ai-je besoin d’un Mac ?

Pour une version iOS DIY, oui. Un convertisseur crée l'application pour vous, même si vous avez toujours besoin d'un compte de développeur Apple pour App Store Connect.

La publication garantit-elle l’approbation ?

Non. Apple et Google décident de chaque soumission. Une meilleure liste et une expérience plus proche d'une application améliorent vos chances mais ne peuvent pas garantir le résultat.

Prochaines étapes

Si votre PWA est prête, prévisualisez-le en tant qu'application avec SiteTo.App et testez-le sur votre propre téléphone avant de décider d'un itinéraire. Une fois que vous êtes satisfait, révisez prix et suivez le créer et publier un guide.