Spletne strani in uporaba fontov

Obširno temo o uporabi fontov na spletni strani smo pred časom že obdelali tule. Vendar gre tu za uporabo fontov, ki jih ima uporabnik naložene na svojem računalniku, če določenega fonta nima, mu prikaže naslednjega napisanega v vrsti. Naprimer za ukaz (font-family: Trebuchet MS, Verdana, Georgia) mora uporabnik imeti Trebuchet Ms, če ga nima mu prikazuje font Verdano, če tudi tega nima v svojem računalniku pa mu prikazuje Georgio.

Sedaj pa nam Google ponuja uporabo fontov na spletnih straneh za katere ni potrebno, da jih imamo nameščene tudi na računalniku. Na spletni strani http://code.google.com/webfonts si lahko ogledate kako namestiti take fonte. Če ste naveličani uporabe Ariala, Times-a, Georgie ter še posebej Trebuchet-a je to prava stvar. Zaenkrat je teh fontov 18 z različnimi variacijami, verjetno pa je, da se bo spisek dodatno širil.

Kako namestim Google fonte?

Kot rečeno na spletni strani http://code.google.com/webfonts izberete tip pisave, ki ga želite uporabiti na spletni strani. Kar vam odpre dodatno možnost, kjer določite vrsto fonta, italic, bold, itd. Kliknete "PRIDOBI KODO" in to je to. To kodo vstavite na spletno stran pred zaključek glave, se pravi tule </head>.  V vašo .css kodo dodate še ustrezen ukaz, kot naprimer tale za font OFL Sorts - h1 { font-family: 'OFL Sorts Mill Goudy TT', arial, serif; } in na vaši strani prikazuje pisavo s fontom OFL Sorts.

Ko ponavadi, so tudi tukaj s šumniki težave. Medtem, ko vse posebne znake, nemške, ruske, španske prikazuje ima s šumniki težave in prikaže font, ki ga imamo napisanega v .css kot privzetega. Lahko tudi sami uvozite svoj font s šumniki in tako rešite težavo, a postopek ni tako enostaven. Pravtako je možno, da tak font že ima večina uporabnikov naloženega na računalniku in je potem lažje samo v .css kodi uporabiti ta  isti font.

Dobra stvar uporabe Google fontov je predvsem v izgledu spletnih strani. S tem bodo spletne strani postale lepše, prijaznejše in bolj raznolike, saj ne bo imela vsaka druga Trebucheta, ki je kar nekako pometel z ostalimi fonti.


Še nameščanje Google fontov po točkah:

- Kliknemo na povezavo http://code.google.com/webfonts
- Izberemo si željen font in nato vrsto fonta
- Nato predogled izbranega fonta, kjer pridobimo kodo na "Get the code"
- Po "Get the code" uporabimo dve vrstici, ki nam jih ponudi Google in sicer:
<link href='http://fonts.googleapis.com/css?family=Molengo' rel='stylesheet' type='text/css'> Prvo, ki jo vstavimo pred zaključek </head> v html dokumentu, ter

h1 { font-family: 'Molengo', arial, serif; } , ki ga dodamo v naš .css dokument.