Betűtípus választási szempontok arculathoz, weboldalhoz

Kivitelezőként elsősorban honlapokat készítek és előfordul, hogy ügyfeleim korábban már készíttettek arculatot mással. Sajnos a legtöbb esetben a grafikusok – tisztelet a kivételnek – kizárólag a logóban található betűtípusokat definiálják. Ezek általában mutatósak, azonban ritka esetben használhatóak hosszabb szövegekhez. Ahhoz, hogy valóban egységes kinézete legyen az arculatodnak, a következetes betűtípus használat épp úgy fontos, mint a saját arculati palettád színeihez való ragaszkodás.

BETŰ TÍPUSOK

Antikva

Az antikva típusú betűkre jellemző, hogy nem azonos a vonalvastagságuk. Ezek a betűtípusok a reneszánsz korból maradtak ránk, amikor még tollal írtak, így a betűk formázása során nem egyenletesen érintkezett a toll a papírral. Ezen belül is két féle betűtípust különböztetünk meg – a ferde vagy átlós (medievális) tengelyű betűket, és a függőleges tengelyű (klasszicista) betűtípusokat. A klasszicista forma már valamivel modernebb időkben keletkezett, amikor a betűk iránya / dőlésszöge már nem követte a lúdtollat tartó kézét, hanem merevebb, pontosabb szerkesztésűek. Ez betudható a folyamatosan elterjedő gépesítésnek, a nyomdaipar fellendülésének is.
 

Talpas, és talpatlan

Az ipari forradalommal, és azon belül is a hirdetések megjelenésével további betűtípusok terjedtek el. A gond ugyanis az volt az antikva típusú betűkkel, hogy nagy méretben messziről csak vonalak látszódtak, nem voltak jól olvashatóak, ezért szükségszerűvé vált, hogy a betűk vastagsága azonos, vagy csak nagyon kis mértékben legyen eltérő. A talp tehát megmaradt, de a vonalvastagság változott.
A talpas betűtípusoknál maradt az azonos vonalvastagság, de már a talp is eltűnt. Ez a betűtípus a 20. században vált csak elterjedté, és ma is inkább a modernebb megjelenést képviselni, míg a talpas változat a hagyománytisztelő,  komolyabb témákat kedvelők használják.
 

Script (kézírást utánzók) és díszbetűk (display)

A kézírást utánzó betűtípuson belül is van több fajta – a cirkalmas, régi korokat idéző betűtípusokon át a hagyományos kézzel írott nyomtatott betűkig sokfélék lehetnek. 
A díszbetűket a legegyszerűbb felismerni, ugyanis alkalmatlanok hosszabb szövegek megjelenítésére. Egyik bohókás, a másik félelmetes, de vannak régi kódexekre emlékeztető, inkább csak kezdőbetűként használt verzió is.

Medievális antikva

Baskerville

klasszicista antikva

Ultra

Talpas

Rokkitt

Talpatlan

Manrope

Írott

Swanky and Moo Moo

díszbetű

UnifrakturCook

SZEMPONTOK A VÁLASZTÁSHOZ

Azon túl, hogy milyen stílus illik a személyiségedhez, illetve a mondandódhoz, az alábbi szempontokat mindenképp vedd figyelembe, amikor betűtípust választasz.

1. Olvashatóság

Egy-egy szó nagyban lehet, hogy jól mutat az adott betűtípussal, de egy szórólapon, vagy egy hosszabb szöveggel már nem. Ne csak azt ellenőrizd, hogy mutat a márkaneved az adott betűtípussal, hanem érdemes hosszabb szövegekkel is kipróbálni különféle méretekben. Szintén érdemes kipróbálni, hogy a nagybetűs verzió hogy mutat. Például a G megjelenése igencsak sokféle lehet betűtípusonként.

2. Variálhatóság

A kiemeléshez nem mindig elég, ha egy szöveget nagyobb mérettel szedünk. Egyszerű szövegszerkesztőkben ugyan tudod vastagítani a betűket, de ha már komolyabb szerkesztő programot, vagy csak a Canvát használod, ez már nem biztos, hogy elég, és lehetséges.

Egy jobb betűtípusnak sok féle variációja van: kis- és nagybetűs, dőlt- és többféleképpen vastagított.  Bár ezeket evidensnek szoktuk venni, meglepően sok betűtípusnál nem alapjárat ez a készlet-gazdagság. 

3. Magyar ábécé

Logó tervezésnél sokan kizárólag a logóra fókuszálnak, és arra figyelnek,  hogy az adott betűtípus ott mutasson jól. Azonban ha a logó tartalmaz egy szlogent is, vagy bármilyen más szöveget, ami nem csupán egy név, akkor bizony ott gyakran felmerül az igény, hogy egyes kiemelt tartalmakat is lehessen azzal a betűtípussal írni. Ekkor szokott kiderülni, hogy a kiválasztott betűtípus nem rendelkezik magyar ékezetes betűkkel.

Ha nem logóban gondolkodunk, még fontosabb, hogy amikor betűtípust választunk, akkor ne ragadjunk le az ajánlott szövegeknél. A font gyűjtő oldalak külföldi weboldalak, így az általuk hozott példákból ritkán derül ki, hogy létezik-e ékezetes változata is.

Így tudod ellenőrizni, hogy egy adott fontnak milyen készlete van:

Általában minden font gyűjtő portálon van lehetőség egy teszt szöveg beírására. Ahhoz, hogy ne kelljen több kört futnod, a teszt szöveged az alábbiakat tartalmazza:

  • A neved vagy a márkád nevét, vagy egy húzó szolgáltatásod nevét – tehát egy olyan szót, amit jó eséllyel gyakran fogsz leírni ezzel a betűtípussal.
  • Írd be ezt a műszót:  árvíztűrő tükörfúrógép – ez ugyanis tartalmazza az összes magyar ékezetes  betűt.

Ha nem találod a lehetőséget műszó beírására,  ott mindenképp keress rá a betűt bemutató leírásokra (glyphs), képekre, hogy lásd, valóban megvan-e minden szükséges karakter a készletben.

4. Párosítás más fontokkal

Az sem mindegy, hogy az általad kiválasztott betűtípus(ok) hogyan variálhatók egymással. Weboldal készítésnél általában két nagy csoportot különböztetünk meg: a cím típusú szövegeket és a szövegtest szövegeit. A cím típusú a Headline H1, és ennek variánsai: H2, H3 – H6. H1-gyel van szedve általában a WordPress beépített logó szövege, az oldal címe stb. H2-vel szokás jelölni a nagyobb címeket, blog címét stb. 

 Azt szoktam javasolni, hogy a headline típusú szövegek legyenek egy fajta betűtípussal szedve és inkább a méretet variáljuk. Ha nem elégszünk meg egy típussal, akkor is maximum a H1-es típusú címeknek találjunk ki más betűtípust, de a többi H2-H6-ig egy fajta betűtípus méret-változatai lehetnek. H1-es szöveg ugyanis viszonylag kevés szerepel az oldalunkon és az is nagyban olvasható, tehát egy merészebb betűtípust is elbír. Míg a H2-től lefelé lévő címekben már hosszabb szövegeket írunk, így a design szempontot felülírja az olvashatóság.

A szövegtestben (body) elhelyezett tartalom a legterjedelmesebb, így itt már elengedhetetlen az olvashatósági szempont – akár a formáról, akár a betű méretéről is legyen szó.

Célszerű a választott betűtípusokat egymás alá tenni és teszt szövegeket írni velük, hogy lássuk, hogy mutatnak együtt, de vannak kiváló eszközök is, amelyek segítenek a betűtípusok variálásában.


FONT PÁROSÍTÓS OLDALAK

A teljesség igénye nélkül itt van néhány font párosítás:


FONT LELŐHELYEK

 
Főleg fizetős fontok, de vannak ingyenesen elérhetőek is:
 

FONTOK, AMELYEKKEL NEM LŐHETSZ MELLÉ

Az egyszerűség és az összehasonlíthatóság kedvéért MINDEN betűtípus Regular (400-as vastagság) és 18 px betűmérettel van szedve, normál stílussal, azaz átalakítás nélkül. (Ebből is láthatod, mennyire nem evidens, hogy egy betűtípusnak vannak nagy- és kisbetűs változatai is, illetve a betűk vastagsága és mérete sem azonos ugyanazon beállítás mellett sem.)

A talpas és talpatlan betűtípusok tökéletesen hosszabb szövegek megjelenítéséhez is, azonban a kézírásos, és a display típusúakat inkább rövidebb, címsor típusú szövegekhez ajánlottak. A display típusú betűtípusnál érdemes azt is figyelembe venni, hogy általában kevésbé variálhatóak. Míg egy  Robotonak akár 12 stílusa is lehet (thin-től az extra boldig bezárólag normál és dőlt verzióban is), addig a comfortaa-nak csak 5 stílusa van vastagság szerint, dőlt verziója nincs.

TALPAS BETŰTÍPUSOK

Roboto Slab

Merriweather

Playfair Display

Lora

Vollkorn

Old Standard TT

TALPATLAN BETŰTÍPUSOK

Roboto

Oswald

Open Sans

Montserrat

Raleway

Quicksand

Írott betűtípusok

Pacifico

Dancing script

Sacramento

Parisienne

Allura

Italianno

DISPLAY

Comfortaa

Lobster

Abril Fatface

Poiret One

Sansita

Bevan

Még több tudásanyag és a inspiráció a Pinterest oldalamon:

Még több tudásra vágysz?

Akkor a márkaépítés e-book és munkafüzet Neked való!

Ebben az online is kitölthető kiadványban gyakorlat-orientáltan vesszük végig a márkaépítési alapokat – a vágyakon át a stratégán keresztül a vizuális megjelenésig.

Az alapok lefektetésén túl meghatározzuk ideális célközönséged, valamint márkád stílusát, nyelvezetét, útmutatót kapsz az arculati színeid meghatározásához is. 

Csak megvalósítóknak!

Bővebben…

Márkaépítés e-book és munkafüzet