Guida apple-touch-icon
Quando un utente aggiunge il tuo sito alla home screen iOS, Safari usa l'apple-touch-icon — non favicon.ico. Pubblica un PNG 180×180 (o un quadrato più grande che si ridimensioni bene) e collegalo nel <head>.
Apple non applica maschere sulle web clip di iOS moderno come fa con le app native, ma l'icona dovrebbe comunque essere quadrata con margini di sicurezza — mantieni il logo rientrato del ~10 % perché gli angoli arrotondati non taglino mai la grafica.
Usa <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">. Un unico file 180×180 copre tutti gli iPhone attuali; le voci opzionali 152×152 e 167×167 migliorano la resa sugli iPad meno recenti.
Come funziona
- 1
Esporta un PNG 180×180
Dal nostro generatore favicon o da un ridimensionatore di immagini.
- 2
Caricalo nella root del sito
/apple-touch-icon.png accanto a favicon.ico.
- 3
Aggiungi il tag link
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"> nel <head>.
Provalo ora
Genera apple-touch-icon
Generatore di FaviconFAQ
Qual è la dimensione di apple-touch-icon?+
180×180 pixel per gli iPhone attuali. Esporta da un master 512×512 o 1024×1024.
PNG o ICO per iOS?+
Solo PNG. iOS ignora i file .ico per le icone della home screen.
Serve comunque favicon.ico?+
Sì — schede e altri browser usano ancora .ico. L'apple-touch-icon si aggiunge a quello.
Strumenti correlati
Generatore di Favicon
Genera un pacchetto completo di favicon (ICO + PNG) per ogni dispositivo e browser.
Ridimensiona Immagini
Ridimensiona PNG, JPG e WebP alle dimensioni esatte desiderate.
Convertitore PNG in ICO
Convertitore online gratuito da PNG a ICO per icone Windows, icone app e favicon per siti web.