CSS Tip #13 – Google Font Directory
Scritto da Salvo il 29 agosto 2010 con 0 commenti
Tags: css tip , tipografia , webdesign
Da poco tempo Google ha rilasciato in beta un nuovo servizio che prende il nome di Font Directory, lo scopo è quello di permettere ai webdesigners di utilizzare nuovi font oltre alla solita cerchia, ospitandoli sui propri server… e il tutto aggratis!
Prima di partire in quarta per vedere come funzione questo semplice servizio facciamo un attimo il punto della situazione per la questione “tipografia web” e vediamo cos’hanno da dire i CSS3 a riguardo, visto che come anticipato dallo scorso tip ora se ne parlerà un po più spesso!
L’attuale problema dei font
Con gli attuali standard Css tramite la proprietà “font-family” possiamo indicare un qualunque font da utilizzare sulle nostre pagine web… c’è solo il big problema che vengono utilizzati i font presenti sul nostro computer, che come si sa non sono necessariamente quelli presenti sul computer degli utenti che visitano i nostri siti! Obbligandoci cosi a lavorare con un gruppo ristretto di font…
Il miraggio dei CSS3
I Css3 introdurranno la proprietà “font-face” per permetterci di utilizzare tutti i font che vogliamo, previo upload di quest’ultimi sul server dove risiede il nostro sito (un po’ come delle immagini…), tuttavia questa futura possibilità non è ancora alla mano di tutti i browser, e il fatto di che questa nuova tecnologia installi in automatico i font sulle macchine dei visitatori dei nostri siti non piace a chi i font li vende…
Ma ora…. Google Font Directory!
Ok ora vediamo questo nuovo servizio di Google all’opera, ho preparato un breve video (circa 5 minuti) dove vi mostro come utilizzarlo:
…e qui una pagina di esempio!
Non c’è altro?
Beh da molto più tempo di Font Directory esiste TypeKit, che ha un catalogo di font moooolto più vasto e offre un servizio più completo… anche se la dinamica è simile , tuttavia TypeKit è a pagamento! (con un piano di prova gratuito comunque)
Dov’è il codice!
Gli esempi li potete tranquillamente copiare/incollare dal sito di Google Fonts, tuttavia se proprio volete un bel sommario nel CSS Tips - File di riferimento trovate parte dell’esempio del video!
Articoli correlati:
- 15 estensioni di Chrome per webdesigners! Per un web designer il browser è il suo pane quotidiano, da quando poi è arrivato Firefox introducendo le estensioni questi software hanno compiuto un enorme passo in avanti diventando [...]...
- CSS tip #1 – Angoli arrotondati Nel realizzare la nuova versione del mio sito ho voluto utilizzare una proprietà CSS un pò avanti sui tempi, (infatti la troveremo “ufficializzata” con i CSS3), ma che 2 motori [...]...
Riguardo Salvo...
Web designer/developer (aka Interactive Designer) dal 2006, ho lavorato in varie aziende che operano dall'e-commerce alla comunicazione multimediale, sono stato speaker a conferenze come Better Software, Codemotion e due WordCamp. Dal 2010 insegno linguaggi web alla scuola Mohole di Milano.
Se ti e' sembrato utile perche' non mi offri un caffe'?
Tutto quello che trovi su MoebiusMania.net puo' essere utilizzato liberamente e gratuitamente, se magari hai trovato qualcosa di particolarmente utile puoi mostrare il tuo apprezzamento con una minuscola donazione con Paypal o cliccando sui banner!
Quanto silenzio qui... pare che non ci siano commenti! Perche' non scrivi tu il primo?