novartstudio.hu
Font -os font
Böde Kriszta
2022.11.12.

Azaz tipográfia a webdesignban

Miért ilyen fontos a betűtípus? Azért, mert az arculati színeid után a második legfontosabb tényező abban, hogy a honlapodra látogató közönség hogyan dolgozza fel az eléje tárt tartalmat.

A tipográfia a hagyományos és a digitális nyomtatásban egyaránt használt kifejezés. A megfelelően megválasztott betűtípusok feldobják a dizájnt, és kellemesen olvashatóvá teszik a tartalmat.

Minden betűtípusnak egyedi stílusa, mérete és súlya (vastagsága) van. Emiatt a különböző betűtípusok, ugyanazzal a betűmérettel bizony eltérő magasságúak lehetnek.

Ahhoz, hogy az általad képviselt arculathoz a megfelelő betűtípusok kerüljenek kiválasztásra, számtalan dolgot kell figyelembe venni. Úgy hiszem, hogy nem létezik egy általános, mindenki számára elfogadható és minden esetben jól működő „font meghatározási képlet”. Most mégis kísérletet teszek arra, hogy egy bárki számára használható útmutatót készítsek a tipográfia kérdéskörében.

9+1 tipp a helyes font megtalálásához

1.

Ékezetek – Árvíztűrő tükörfúrógép: ebben a mondatban minden magyar ékezetes betű szerepel. Tehát érdemes mindjárt azzal kezdeni, hogy a választott fonttal leírod ezt a mondatot, hogy lásd, valóban megfelel-e az elvárásaidnak.

2.

Szín – Általánosságban elmondhatom, hogy a webes felületeken, honlapokon, website-okon fehér, vagy világos színű háttér előtt, sötét színű fonttal írt szövegeket olvashatunk. (Mint például itt, ezen az oldalon is így van.) Az olvashatóságot megkönnyíti, hogy ha a betűszín nem fekete, hanem sötétszürke. Itt konkrétan a #0D1015 színű szürkét használom.

3.

Méret – Fontos szempont a szövegek olvashatósága. A túl kicsi betűtípust mindig nehézkes olvasni. Ha szeretnél remek UI -t (felhasználói élmény) biztosítani a weboldaladra látogatóknak, akkor mindig teszteld, hogy a választott méret nem rontja-e az olvashatóságot. Ahogy fent olvashattad, a különböző betűtípusok méretei is eltérőek.

4.

Hiearchia – Egy-egy hosszabb szöveg akkor a leginkább befogadható az olvasó számára, ha részekre tagoltan, a részek pedig címekkel ellátva kerülnek eléje. Vannak betűtípusok amelyek kiválóak címsornak, de testszövegként olvashatatlanok, és az a betűtípus ami remek választás testszövegnek, unalmas címsorként.

5.

Háttér – Nem tudom, hogy találkoztál-e már olyan webes felülettel, ahol a szöveg vagy egy képen, vagy egy mintás háttér előtt volt. Ez egy borzasztóan rossz megoldás! Rontja a felhasználói élményt, hiszen az ilyen szövegek nehezen olvashatóak, megerőltetik a szemet.

6.

Igazítás – A papírra nyomtatott (pl. könyvek, újságok) szövegek esetén a sorkizárásos igazítás a szervezettség és az elegancia benyomását kelti. Ugyanez a weboldaladon már a káosz határait súrolja: hézagok keletkeznek a szövegekben, ami természetellenessé teszi azt. Ezért a weben megjelenő szövegeket mindig balra igazítjuk! (Kivéve, ha a design a jobbra igazítást kívánja.)

7.

Hangulat – Milyen lesz az oldal hangulata? Komoly vagy inkább játékos? Hivatalos vagy laza? Modern vagy hagyományos? Más hangulat más betűtípusokat kíván.Természetesen a weboldal céljának, és a célközönség meghatározása segít neked eldönteni ezt a kérdést.

8.

Egy – kettő vagy három? – A webes megjelenésben nem ajánlatos sok betűtípus használata, mert átláthatatlanná teszi a weboldaladat. Általánosan elfogadott a fontpárok alkalmazása, azaz két különböző, de egymást jól kiegészítő és összeillő betűtípus alkalmazása. Emellett elfogadott egy harmadik, általában kalligrafikus vagy kézírásos, betűtípus alkalmazása, ha a dizájn, vagy az illusztráció megkívánja.

9.

Licenc – Ugyanúgy, mint a felhasznált fotók, képek, illusztrációk esetében, itt is felhívom a figyelmedet, hogy mindig vizsgáld meg az adott font licencére vonatkozó feltételeket. Légy körültekintő, és csak olyan fontot használj, ami engedélyezett számodra, vagy megvásároltad.

+1.

Font lelőhelyek – Az interneten rengeteg helyen találhatsz inspirációt a választáshoz. Kedvenceim: FontsInUse, Typ.io, GoogleFonts, FontPair, Typewolf. Tessék itt egy elég részletes Canva tutorial a fontválasztáshoz.

Ezt a kilenc támpontot érdemes figyelembe venned, ha saját magad szeretnéd az online megjelenésed fontjait kiválasztani. Amellett, hogy a webes megjelenésekben valóban nagy szerepe van a kiválasztott betűtípusoknak, nem árt azt is észben tartanod, hogy a dizájn soha ne menjen az olvashatóság rovására. Az egyszerűség gyönyörködtet!

Merj különbözni!

Kriszta a NovArt Stúdiótól

Arculattervezésben és webdesignban is egyaránt tapasztalt webdesigner vállalkozást keresel?
Böde Kriszta
Webdesigner

A kreativitás mindig is az életem részét képezte. Igaz, egy kis vargabűvel jutottam el a webdesign szakmához, hiszen előtte évekig gazdasági vezetőként dolgoztam.

Erősségem a komplett rendszerben való gondolkodás, a problémák gyors felismerése, és azok eredményes kezelése.

Hiszem, hogy kellő alapossággal és odaadással minden esetben megtaláljuk a lehető legjobb megoldást!

Dolgozzunk együtt!