Corsi on-line

Google Font API: usare font non standard

Sei stanco di Verdana, Arial e Times New Roman? Vorresti creare pagine web con font originali senza ricorrere a @fontface di CSS3 (non supportato da IE)?
Il buon vecchio Google si è messo una mano sulla coscienza ed ha deciso di venire incontro a noi webmaster offrendo un servizio – attualmente in fase Beta – che ci consente di utilizzare font non standard in modo davvero semplicissimo!
Il servizio in questione si chiama Google Font API ed è disponibile a questa pagina all’interno del Google Labs.

Vediamo come funziona: per prima cosa diamo un occhiata ai vari font disponibili. Una volta trovato il carattere che ci piace dovremo inserire, nell’header della nostra pagina web, il semplice richiamo allo speciale “foglio di stile” che svolge tutto il lavoro, avendo cura di specificare (nell’unico parametro family) il nome del font prescelto (nel mio caso “lobster”).

<link href='http://fonts.googleapis.com/css?family=Lobster' rel='stylesheet' type='text/css'>

A questo punto, all’interno del nostro foglio di stile, potremo utilizzare questo font come siamo soliti fare per i font standard:

h1 {
  font-family: 'Lobster', arial, serif;
  font-size: 60px;
  color: #FF6600;
}

Questo è uno screenshot dello stile applicato alla scritta “Mr.Webmaster”:

Si noti che i codici qui proposti vengono generati automaticamente dal servizio: dopo aver cliccato sul font prescelto si aprirà una pagina con un’anteprima, charset e descrizione del font. Per ottenere il codice pronto da usare basta cliccare sull’ultima etichetta “Get the code”.

Post correlati
I più letti del mese
Tematiche