logo

Cos'è l'icona Apple Touch?

Cos'è l'icona Apple Touch

IL Icona tocco Apple , noto anche come file apple-touch-icon.webp, viene utilizzato come icona di una pagina Web su iPhone, iPod Touch e iPad di Apple, proprio come Favicon. Questo simbolo viene utilizzato ogni volta che un utente aggiunge un sito Web ai segnalibri o alla propria schermata iniziale. Questi prodotti Apple si basano su un'istantanea del sito Web, che spesso è poco più di un quadrato bianco se non è possibile individuare il file.

A meno che la posizione non sia fornita nell'HTML, questo file dovrebbe essere un file.webp con dimensioni 57 x 57 e trovarsi nella directory home. Di seguito è mostrata un'illustrazione del modo in cui questo tag potrebbe apparire nel tuo codice HTML.

|_+_|

Come creare l'icona Apple Touch di un sito Web responsivo?

Un'icona Apple Touch viene utilizzata quando un consumatore salva il tuo sito web alla schermata iniziale del dispositivo touch screen iOS o aggiungerlo ai segnalibri. Apple utilizzerà uno screenshot del tuo sito web come icona se non ne specifichi uno, il che spesso si traduce in un quadrato irriconoscibile. Ti mostreremo come sviluppare un'icona Apple Touch unica per il tuo sito web user-friendly in modo da non costringere i tuoi clienti a vedere un'icona Apple scadente.

Crea un'icona Apple Touch

La tua icona Apple Touch deve essere creata in Photoshop o in un altro editor di immagini nella fase iniziale. Il file deve essere salvato come 'apple-touch-icon.webp' e deve avere una dimensione di 180 x 180 pixel.

Aggiungi il file dell'icona Apple Touch del tuo sito web.

Il passaggio successivo è caricare il documento dell'icona Apple Touch sul tuo sito web. Puoi metterlo dove preferisci, tuttavia, ti consigliamo di memorizzarlo nella cartella delle immagini principali. Dato che lo utilizzeremo nella fase successiva, tieni traccia di dove hai archiviato il tuo file.

Utilizzando un elemento di collegamento, definisci la tua icona Apple Touch.

L'ultimo passaggio è identificare e nominare la tua ultima icona Apple Touch in un elemento collegamento che aggiungi all'elemento HEAD della tua pagina.