Icônes PWA : ce qu'il faut à une application installable
Pour qu'un navigateur traite votre site comme une PWA installable, son manifeste doit lister au moins une icône PNG de 192x192 et une de 512x512. Une icône maskable est fortement recommandée pour qu'Android puisse la mettre à la forme du lanceur, et iOS a toujours besoin d'un apple-touch-icon distinct car il ignore le manifeste pour les icônes d'écran d'accueil. Omettez la paire 192/512 et l'invite d'installation n'apparaîtra pas.
Le seuil d'installation
Chrome et les autres navigateurs Chromium ne proposeront pas d'installer une PWA tant que le manifeste ne liste pas à la fois une icône de 192x192 et une de 512x512. Cette paire est une exigence stricte : sans elle, pas d'invite d'installation, quoi que contienne le reste du manifeste.
Le 192 sert aussi le raccourci de l'écran d'accueil, et le 512 alimente l'écran de démarrage et les affichages haute densité. Une version maskable permet à Android de rogner l'icône à la forme qu'utilise le lanceur au lieu de l'encadrer dans une boîte blanche.
Les icônes dont une PWA a besoin
| Icône | Pourquoi elle est nécessaire |
|---|---|
| PNG 192x192 | Exigence d'installation et raccourci d'écran d'accueil |
| PNG 512x512 | Écran de démarrage et affichages haute densité |
| Icône maskable | Permet à Android de mettre l'icône à la forme du lanceur |
| apple-touch-icon 180x180 | Écran d'accueil iOS : le manifeste ne le couvre pas |
FAQ sur les icônes PWA
Quelles tailles d'icônes une PWA nécessite-t-elle ?
Au minimum un PNG de 192x192 et un de 512x512 dans le manifeste, idéalement avec une variante maskable, plus un apple-touch-icon de 180x180 pour les écrans d'accueil iOS.
Pourquoi ma PWA ne s'installe-t-elle pas ?
La cause la plus fréquente est un manifeste dépourvu de l'icône 192x192 ou 512x512 : les deux sont obligatoires avant que le navigateur n'affiche une invite d'installation. Vérifiez d'abord le tableau icons du manifeste.
Les icônes PWA couvrent-elles les écrans d'accueil iOS ?
Non. iOS ignore les icônes du manifeste pour l'écran d'accueil et utilise l'apple-touch-icon à la place, donc il vous faut aussi ce fichier.