Ikone PWA: preprečite odrezan logotip in bele kvadratke
Nameščene spletne aplikacije uporabljajo ikone manifesta. Zaganjalnik lahko uporabi masko oblike.
Pripravite vire
Začnite s PNG 192×192 in 512×512 ter preverite platforme. Relativne poti izhajajo iz URL manifesta. Največ 256px v IcoJet ne nadomesti PNG 512px.
Oblikujte različico maskable
Pomembne dele ohranite v sredinskem krogu s polmerom 40% širine. Ozadje raztegnite do roba. purpose="maskable" uporabite šele po preverjanju zasnove.
Preizkusite namestitev
Preglejte manifest in masko v brskalniku, nato namestite na ciljno napravo. Preverite navadno in maskabilno različico. Staro namestitev primerjajte z novo pred spremembo risbe.
{
"icons": [
{
"src": "/icons/app-192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/icons/app-512.png",
"sizes": "512x512",
"type": "image/png",
"purpose": "any"
},
{
"src": "/icons/app-maskable-512.png",
"sizes": "512x512",
"type": "image/png",
"purpose": "maskable"
}
]
}Viri in dodatno branje
MDN — Manifest icons ↗web.dev — Web app manifest ↗