Betűtípus csere a weboldalon

Hogyan kell az alap betűtípusoktól megválni, és egyedi betűfajtával ellátni a weboldalunk szövegeit? Mint oly sok dologra, ennek is van a Google-nek (ingyenes) szolgáltatása.

Néhány lépés az egész:

1. Fel kell keresni a Google Fonts oldalt.
2. Kell keresni egy tetszetős betűtípust.
3. A betűtípusok alatt van egy nagy kék „Add to Collection” gomb. Emellett balra a 2. gomb egy „Quick-use” feliratú. Erre kell kattintani, majd követni kell az ott leírtakat, az ottani 3-as ponttól kezdve:
4. A megadott kódsort a weboldal fejlécébe kell tenni.
5. A betűtípust integrálni kell a weboldal stíluslapjába (css fájl), a megjelölt módon.

A fentiek elvégzése után a stíluslapon megjelölt elemek a kiválasztott betűtípussal fognak megjelenni.

Mire kell figyelni?
Az ékezetekre. Ugyanis nem mindegyik betűtípus tudja kezelni pl. az ű és ő betűket. Ugyan a betűtípusoknál van egy olyan „Pop out” gomb, amellyel megnézhetjük az adott betűtípus karakterkészletét, de ez sajnos sok esetben eltér a tényleges felhasználáskor kapott megjelenítési módtól.

Hogyan győződhetünk meg arról, hogy minden karaktert képes megjeleníteni a kiválasztott betűtípus?
Hozzon létre egy tesztoldalt, a korábban már bemutatott tesztszöveggel!

Megújult a Google Fonts!

A Google ingyenes betűtípus-gyűjteménye, a Google Fonts arculatot váltott, így még felhasználóbarátabb lett, mint eddig volt. Az elérhetősége nem változott, továbbra is a https://fonts.google.com/ címen érhető el.

Egy gyors videó a használatáról, és egy tipp: hogyan találjunk olyan betűtípust, ami támogatja az ékezetes (pl.: ű,ő) karaktereket:

Ui.: Fontos, hogy a meta charset=”UTF-8″ meta-elem szerepeljen azon weboldal fejlécében, ahová a betűtípus integrálva lesz!

Letöltés:
A videón látott minta-forráskód letöltése.