6 kitünő @font-face beágyazható betűtípus

A két legnépszerűbb web-es betű stílus a Verdana és a Georgia, ráadásul ezek web-safe típusok. Ha szeretnénk valami egyedi betűtípust alkalmazni, legalább a címsorokban akkor van néhány lehetőségünk, például képként jelenítjük meg. Ezt megtehetjük egy “flash replacement” segítségével (sIFR,FLIR) vagy vannak java-s illetve CSS+PHP DTR megoldások is, azonban SEO szempontból problémás de ez is megoldható csak ki kell tenni “hidden” szövegként is…

Azonban létezik egy CSS tulajdonság a @font-face melynek használata igen egyszerű, sajnos ezt viszont csak az újabb böngészők támogatják. Igen népszerű megoldás, használjuk bátran! Lássuk miként:

Először is meg kell határoznunk a font file helyét illetve ha létezik akkor font-weight (pl: Bold) és a font-style tulajdonságokat!
A definiálás után használjuk mondjuk a h2-es cím sorhoz ezt a betű típust.

@font-face {
font-family: Diavlo;
src: url("betű elérési útja/Diavlo.otf") format("opentype");
}

h2 {
font-family: Diavlo, Helvetica, Verdana, Sans-Serif;
}

Graublau Web

DAYS

PykesPeakZero

Yanone Kaffesatz

Fontin