Da GIF a ICO (favicon animata)
Trasforma una GIF nei due file di cui ha bisogno una favicon animata: un favicon.ico multi-dimensione tagliato dal primo fotogramma e l'animazione ridimensionata per una scheda del browser.
Rilascia il tuo logo qui
oppure sfogliare i file
GIF •Massimo 10MB
Taglie all'interno di favicon.ico
Costruito dal primo fotogramma della tua GIF
Dimensioni dell'animazione
Dimensione quadrata per la favicon.gif animata
Imparentato
- Vuoi la storia completa sul supporto del browser? Guida animata favicon.
- Hai bisogno anche di dimensioni PNG e di un manifest? Genera un pacchetto completo.
- Partendo da un fermo immagine? Da PNG a ICO.
- Controllare cosa serve il tuo sito live? Verifica favicon.
Prima della spedizione
La maggior parte dei tuoi visitatori non vedrà mai l'animazione. Firefox lo riproduce; Chrome, Edge e Safari eseguono il rendering del primo fotogramma. Considera il movimento come un bonus, non come un messaggio.
Mantieni il ciclo breve e a basso contrasto. Uno sfarfallio di favicon accanto al titolo di una scheda viene letto come una notifica e infastidisce rapidamente le persone.
Carica entrambi i file nella root del tuo sito, quindi incolla lo snippet in <head>.
Domande frequenti
La favicon si animerà davvero?
In Firefox, sì. Chrome, Edge e Safari mostrano invece il primo fotogramma: Chrome ha chiuso la sua richiesta animata-favicon come non pianificato. Ecco perché questo strumento ti offre anche un fallback ICO. IL guida animata favicon copre l'approccio JavaScript per altri browser.
Carichi il mio file?
SÌ. La tua GIF viene caricata in modo che i fotogrammi possano essere decodificati e ridimensionati sul server.
Quale dimensione dell'animazione dovrei scegliere?
32px si adatta alla maggior parte delle schede. Dimensioni più grandi significano un file più grande per un'icona che nessuno vede sopra i 32px circa, quindi vai su solo se la tua grafica lo richiede.
Perché il primo fotogramma è così importante?
Ogni browser che non si anima mostra il primo fotogramma e la Ricerca Google utilizza un'icona statica. Rendi leggibile il primo fotogramma.