Personalizzare i font con Typekit

Poche righe di JavaScript sono sufficienti per personalizzare il proprio sito usando font alternativi.

Da diverso tempo sto sperimentando l’uso di Typekit, un servizio che permette di utilizzare font diversi dai soliti noti (Arial, Verdana, Georgia…) in modo compatibile con tutti i principali browser. Il funzionamento è semplice e si basa su font-face e JavaScript, eliminando il problema relativo ai copyright dei font che sono interamente ospitati sui server di Typekit.

I risultati del test

Sono molto soddisfatto dei risultati ottenuti sul mio blog personale, dove sto effettuando le prove. La configurazione è semplice, e l’account trial gratuito permette di fare test senza problemi, mettendo a disposizione più di un centinaio di font (sono oltre 400 negli account a pagamento). La libreria disponibile tra l’altro cresce nel tempo, perché ne vengono progressivamente aggiunti sempre di nuovi.

Quali sono i possibili svantaggi da considerare? Sicuramente il peso della pagina, che a seconda del font scelto cambia notevolmente. Utilizzando il font Droid Serif, nelle sue forme Regular e Italic, ho una pagina che pesa ben 79kb in più del normale. Le cose potrebbero cambiare senza usare il corsivo, ma è necessario comunque fare attenzione a dettagli come questo. Il peso dei font aggiuntivi è comunque sempre visibile nel pannello di amministrazione di Typekit, non è quindi un dettaglio nascosto, da calcolare autonomamente.

Prima di scegliere un font inoltre è bene verificarne l’aspetto sui vari browser: non sempre il rendering è ottimale, soprattutto su Internet Explorer.

Questi però non sono problemi relativi a Typekit, ma fattori da considerare quando si usano font alternativi. L’unico limite del servizio, con l’account trial, è l’inserimento di un piccolo badge in basso a destra sul sito, e la banda mensile di 5Gb per i font.

Scegliere Typekit o usare i CSS?

L’alternativa CSS-only è sempre praticabile: ne avevo parlato nel 2008 quando solo Safari supportava certe proprietà e adesso potrebbe essere la soluzione ideale. Il problema però è l’esistenza di un copyright su quasi tutti i font, spesso anche quelli gratuiti, che non sempre possono essere utilizzati liberamente.

Un altro limite della soluzione autonoma è dato dalle solite differenze tra browser. Firefox supporta Web Open Font Format e TrueType, Safari e Chrome supportano solo TrueType, Explorer supporta EOT, mentre Safari Mobile (iPhone e iPad) usano SVG. Un grande caos, che obbliga lo sviluppatore a includere un font in tutti questi formati per avere risultati coerenti.

Per questo motivo soluzioni come Typekit sono l’ideale: certo, c’è da considerare una minima spesa aggiuntiva se non si vuole usare l’account gratuito con i relativi limiti, ma i vantaggi esistono.

Ci sono anche altre soluzioni alternative, come Typotheque (che concede licenze anche per la stampa) e Kernest, ma non le ho provate personalmente. Ve le segnalo se siete interessati a sperimentare, in attesa di altri servizi come Fontdeck.