Con OS X El Capitan, Apple ha introdotto su Safari 9.0 i Pinned Tabs, dei piccoli riquadri che possono ospitare i nostri siti web preferiti. Basta accorciare una scheda per trasformare la lunga barra in un’icona quadrata.

Ma come si può implementare sul nostro sito l’icona che sarà chiamata a identificare il Pinned Tab? Sul sito ufficiale dedicato agli sviluppatori, Cupertino ha spiegato come implementare l’icona, che deve necessariamente essere in formato svg.

Una volta creata l’icona potete rinominarla website_icon.svg e caricarla sul sito. Ora inserite all’interno del tag head il seguente codice:

<link rel=”mask-icon” href=”website_icon.svg” color=”red”>

Dopo pochi minuti l’icona comparirà sul vostro sito quando impostato in modalità Pinned Site. Potete inserire in “color” il codice colore con il quale volete colorare l’icona quando attiva.

Vi ricordiamo che i siti web impostati come Pinned rimangono sempre attivi, quindi vengono caricati a ogni prima apertura del browser. Questo permette di velocizzare il loro tempo di caricamento.