Una favicon è una piccola icona che rappresenta il tuo sito web nelle schede del browser. Per le Progressive Web Apps (PWA), hai anche bisogno di un manifesto web e icone più grandi per le schermate home mobili.
Installa i file favicon e le icone PWA
Lo ZIP Web contiene favicon.ico, PNG da 16/32 px, icona Apple touch da 180 px, icone PWA da 192/512 px, site.webmanifest e og.png da 1200x630.
Contenuto dello ZIP Web
I due PNG PWA sono normali icone quadrate. Nomi e dimensioni corrispondono all'array icons in site.webmanifest; og.png è un'immagine separata per la condivisione.
Collega le icone al sito
- Copia i file di Web nella cartella pubblica del sito e pubblicali nella radice del dominio, oppure adatta i percorsi alla cartella scelta.
- Modifica name e short_name in site.webmanifest. start_url e scope sono relativi al manifest; i percorsi esportati delle icone iniziano con /. Adattali se le immagini sono in una sottocartella.
- Aggiungi i link del manifest, favicon e Apple touch nell'head HTML. Usa HTTPS o localhost. Negli strumenti del browser controlla il manifest e che ogni URL restituisca un'immagine, non una pagina HTML di fallback.
<link rel="manifest" href="/site.webmanifest">
<link rel="icon" href="/favicon.ico">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">Queste icone non sono preparate come immagini maskable. Lo ZIP non aggiunge service worker o supporto offline; le sole icone non garantiscono l'installazione. Prova browser e dispositivo di destinazione.
Leggi la guida di integrazione Web, PWA e Chrome