Maskable Icon

Perché i manifest dovrebbero avere una maskable icon

PWA

Perché i manifest dovrebbero avere una maskable icon

Affinché l'icona di una PWA sia ottimizzata sui dispositivi Android, è opportuno utilizzare il formato "icone con maschera": in questo modo si ha la certezza che l'immagine riempia tutto lo spazio disponibile e che non lasci dello sfondo bianco inutilizzato.

Come la maskable icon viene visualizzata nell'audit di SeoChecker

Se la pagina non possiede il supporto per le maskable icon, SeoChecker lo notificherà:

Come posso aggiungere maskable icon?

Se si desidera superare la verifica, è necessario impostare un web app manifest che deve disporre di un array di icone: questo deve contenere un oggetto con la proprietà purpose property che includa il valore  maskable o any maskable.

{
  …
  "icons": [
    …
    {
      "src": "path/to/maskable_icon.png",
      "sizes": "196x196",
      "type": "image/png",
      "purpose": "any maskable"
    }
  ]
  …
}