Blogbejegyzésünkben a weboldal egy igen meghatározó szeletét járjuk körbe. Megnézzük, milyen szempontokra érdemes odafigyelni a honlap betűtípusainak kiválasztása során, hogy azok az információk közvetítésén túl design funkciót is betöltsenek és még a célközönségnél is célba érjenek.
A betűk nem csak azért fontos alapanyagok, mert információkat tudunk velük közvetíteni – habár ez az elsődleges funkciójuk. Ezek az elemek sok esetben design funkciót is betöltenek, a színekhez hasonlóan érzéseinkre, tudatunkra is hatással vannak, tehát a jól megválasztott betűtípusok is egyszerre nyújtanak vizuális-esztétikai élményt, hangulatokat és érzéseket közvetítenek a célközönség felé. A tipográfiának bizony nagy szerepe van a weboldalakon és a webdesignban is.
Ahogyan a weboldal színvilágának megtervezése, úgy a weboldal betűtípusának kiválasztása sem könnyű feladat, hiszen rendkívül nagy a font-választék. Ennek az “alapanyagnak” a kiválasztásakor figyelembe kell vennünk, hogy az adott betűcsaládnak nem csak a weboldal dizájnjához kell illeszkednie, lényeges az is, hogy az adott fonttal szedett feliratok, címsorok és törzsszövegek, egyéb szöveges tartalmak jól láthatók, könnyen olvashatók legyenek.
Ha már jártasabb vagy a weboldalak világában, biztosan ismerősen cseng: Google webfontok
Bizony, honlapon alapvetően Google webfontokat használunk. Webfontokról, webre szánt betűtípusokról van szó, melyek legfőbb előnye, hogy böngészőfüggetlenek, tehát nem kell aggódnunk, hogy egyik-másik böngészőben más, behelyettesített betűtípusokkal jelennek meg a szöveges tartalmak a weboldalon, további előnyük, hogy a honlapon alkalmazott fontfájlokat nem kell például sem a számítógépünkön, sem a tárhelyünkön tárolnunk.
Nézzük is meg, hogy milyen betűtípusok közül “válogathatunk” a weboldalunkra!
Ismered már őket? : )
talpas (serif) betűtípusok
A talpas fontok nyomtatott szövegek esetében ideális választások, ezért leginkább magazinok, újságok, könyvek szöveges tartalmaihoz használjuk őket. Ez természetesen nem jelenti azt, hogy weboldalon kerülnünk kellene a talpas betűk használatát, sőt, a mai tipográfiai trendek is “diktálják” az alkalmazásukat. Azzal minden bizonnyal számolni kell, hogy talpas fonttal szedett hosszú szöveges tartalmakat nehezebb, fárasztóbb olvasni a képernyőn, azonban egy-egy felirat, címsor esetében bátran használhatjuk – amennyiben a téma is “elbírja” és igazán egyedi tipográfiát szeretnénk kialakítani.
A talpas fontok a múltat, hagyományt, tradíciókat, örökséget, minőséget, megbízhatóságot és stabilitást sugallják. Ilyen ismert betűtípus például a Times New Roman, Georgia, Bodoni, melyek honlapokon, digitális felületeken is jól tudnak működni.
talpatlan (sans serif) betűtípusok
A talpatlan betűtípusokat képernyőn működnek a legjobban, kisebb méretben is könnyű és kényelmes olvasni őket, ezért a weboldalak szöveges tartalmait elsősorban talpatlan betűtípussal szedjük. Ez a fajta betűtípus modern és letisztult megjelenést ad a weboldal designjának is.
A talpatlan fontokat az egyszerűség, letisztultság, elegancia, tudás, minőség, megbízhatóság és modernitás jellemzi. A legismertebb sans serif fontok közé tartozik az Open Sans, Arial, Helvetica és a Montserrat – ezekkel a fontokkal találkozunk leggyakrabban a weboldalakon.
kézírásos (handwriting) betűtípusok
Kézírást utánzó fontok, ahogyan akár egy kisiskolás gyermek vagy egy felnőtt is ír. Ezek a betűtípusok egyszerű kézírás hatását keltik, azonban törzsszövegek, egybefüggő szöveges tartalmak szedésére nem alkalmasak, ugyanis az ilyen típusú fontokkal szedett tartalmak már nehezen olvashatók, nem mellesleg a szemet is fárasztják – nyomtatott anyagon, weboldalon egyaránt. Ez a betűtípus címsorok, egy-egy kiemelt szó/felirat esetében lehet jó választás online felületeken is.
A kézírás jellegű betűtípusok lazák, vidámak, gyermekiek, kreativitást sugároznak, nőies, kézműves témákhoz remekül passzolnak. Weboldalra jó választások lehetnek az alábbi ismert kézírásos fontok, mint például Alex Brush, Amatic, Shadows Into Light – természetesen arculatnak, témának megfelelően.
kalligrafikus fontok
Ezek a betűtípusok rajzolt, míves kézírásra, szépírásra emlékeztető fontok. A kézírásos fontokhoz hasonlóan egy-egy címsor, felirat kiemelésére kiválóan alkalmasak, azonban törzsszövegek, hosszabb szöveges tartalmak szedésére nem igazán ideálisak, hiszen egy csak kalligrafikus fonttal szedett szöveget nagyon fárasztó és nehéz lenne olvasni – még weboldalon is.
Ezt a betűtípust elegancia, nemesség, kifinomultság jellemzi, a minőség, a luxus érzete is társítható hozzá. Weboldalra célszerű vastagabb betűszárral rendelkező kalligrafikus fontot választani, ugyanis a túl vékony, kecses, halvány fontok elveszhetnek a képernyőn. Honlapra kalligrafikus fontként kerülhet például a Dancing Script, Allura, Pacifico font – szintén az adott témával, arculati koncepcióval összhangban.
díszfontok (display)
A díszfontok segítségével egyfajta egyediséget, játékosságot kölcsönözhetünk az adott munkának. Ennek a betűtípusnak számtalan eleme létezik, azonban ezekkel a fontokkal szigorúan tilos törzsszövegeket szedni, valamint címsorok, bizonyos tartalmak kiemelésére is csak jól olvasható díszfontokat ajánlott használni. Témafüggő, de weboldalon kevésbé jutnak szerephez a díszfontok.
Ezek a betűtípusok újdonságot, különlegességet, játékosságot közvetítenek. Fontletöltő oldalakon bőségesen találhatunk adott témához passzoló díszfontokat.
Mit érdemes leginkább figyelembe venni a honlap betűtípusainak kiválasztása során?
# Megfelelően kapcsolódjon a márkához és annak célközönségéhez!
Fontos, hogy olyan betűtípust válasszunk a weboldalunk szöveges tartalmaihoz, amely megfelelően passzol a márkánkhoz és a vállalkozásunkhoz – a logóban látható betűtípus(ok)tól függetlenül. Emellett az is nagyon fontos, hogy ki a célközönségünk, hozzájuk milyen betűtípus “társítható”. Például, ha egy női kozmetikumokat árusító márkáról és weboldalról van szó, nem szerencsés ha férfias, maszkulin, robosztus, talpas fonttal szedett szöveges tartalmakat vonultatunk végig a weboldalon, és mindez fordítva is igaz lenne. : )
Bár alapvetően grafikai munkákkal kapcsolatban gyűjtöttük össze a ma már elcsépeltnek számító fontokat, bizonyos típusokat honlapok esetében sem árt figyelembe venni/kerülni. : )
# Tartalmazza az összes magyar ékezetes karaktert!
Sok esetben a fontválasztás során az a legfőbb feltétel, hogy az adott betűtípus jól nézzen ki, mutasson jól, hűen kapcsolódjon az adott arculathoz, témához. Azonban nagyon fontos, hogy ne csak azt vegyük figyelembe, hogy az adott betűtípus jól néz ki, passzol az arculati koncepcióhoz, hanem minden esetben le kell ellenőrizni, hogy a kiszemelt betűtípus tartalmazza-e a magyar abc összes ékezetes karakterét – sok fejfájástól kímélhetjük meg magunkat. : )
Ha biztosra akarunk menni, hogy az adott betűkészlet tudja-e kezelni az ékezetes betűket, akkor a fontletöltő oldalon még a letöltése előtt gépeljük be az ellenőrző sávba az “árvíztűrő tükörfúrógép” szót. Ez az összes magyar ékezetes karaktert tartalmazza, így rögtön láthatjuk, hogy melyek azok a karakterek, amiket tud/nem tud kezelni az adott betűtípus.
# Határozzuk meg, hogy milyen felületen kívánjuk használni a betűtípusokat!
Az első és talán legfontosabb szempont annak meghatározása, hogy milyen felületre, milyen felhasználásra keressük az adott fontokat. Most elsősorban a weboldalon alkalmazott betűtípusokról ejtünk szót, de fontos szem előtt tartani, hogy egy adott cég/vállalkozás/márka számára kiválasztott betűtípusok nem csak a weboldalon kerülhetnek felhasználásra. Érdemes már az elején abban is gondolkodni, hogy az adott betűkészlet webes felületen és nyomtatásban is egyaránt olvasható legyen és megfelelően mutasson, minden helyzetben “bevethető” legyen.
# Legyen könnyen olvasható!
Bizonyos betűtípussal szedett címsorok, kiemelt szavak remekül nézhetnek ki az adott fonttal, azonban néhány betűtípus hosszabb szöveges tartalmak, törzsszövegek szedésére sajnos már egyáltalán nem alkalmas. Fontos, hogy a kiválasztott betűtípus könnyen olvasható legyen, ne fárassza az olvasó szemét a weboldal böngészése és a tartalmak olvasása közben – tehát a design ne menjen az olvashatóság rovására.
# A kis különbség nem különbség!
Alapszabály, hogy az adott munka során használni kívánt betűtípust mindig különböző kategóriából kell kiválasztani. Ennek legfőbb oka az, hogy az egy kategóriába tartozó betűtípusok között túl sok lenne a hasonlóság, és mint tudjuk, “a kis különbség nem különbség”. A különbözőség mellett azonban a betűtípusok közötti harmónia is alapszabály – weboldalon is.
Az eltérő típusok kiválasztása a tartalmak közötti vizuális hierarchia kialakításában is a segítségünkre van.
A szöveges tartalmakat minden esetben úgy kell kialakítani, hogy az olvasónak szinte azonnal egyértelmű legyen, hogy az adott szöveg miről szól – weboldalon ennek különösen nagy jelentősége van, hiszen a látogatók csak átfutják a tartalmakat, gyorsan meg akarják találni az őket érdeklő/érintő információkat. Ehhez arra van szükség, hogy a szöveg egyes részei között vizuális hierarchiát állítsunk fel. A hierarchia felállításához pedig leginkább arra van szükség, hogy kontrasztot alakítsunk ki. Kontraszt sokféle megoldással kivitelezhető, mint például eltérő betűtípusokkal, méretezésekkel, színezésekkel, stb. A betűk kontrasztja nemcsak esztétikai és vizuális szempontból fontos, hanem a kommunikációt is könnyebbé és hatékonyabbá teszi.
TUDTAD?
A látogatók mindig rohanásban vannak, csak gyorsan átfutják a weboldalt, annak tartalmait, és nagy igyekezetükben szinte csak a címsorokat olvassák el. Éppen ezért fontos megfelelő betűtípussal és kiemelten szedni a címsorokat, és ezeknek a címsoroknak a segítségével minden fontos információt megjeleníteni azért, hogy ha a látogató csak ezeket olvassa össze, akkor is lássa, hogy az adott vállalkozás mit és hogyan szolgáltat, milyen termékeket értékesít, milyen előnyökkel/extrákkal bír. Ebben az információátadásban nagy szerepe lesz a weboldal tipográfiájának.
BÓNUSZ
3 +1 tipp, hogy ne lőj mellé a weboldalon a tipográfiával