Szolgáltatások
Hirdetéskezelés
Content & SEO
Rólunk
Hasznos
Marketing alapok
Online marketing
Ajánlatkérés
A tipográfia kifejezés alatt a nyomtatott betűk és azokat tartalmazó szövegek vizuális megalkotását, rendezését, tervezését és a felsoroltakkal foglalkozó szakmai területet értjük.
A 15. század közepén Gutenberg forradalmasította a nyomtatást, aminek köszönhetően meghatározó része lett a vizuális kommunikációnak a tipográfiai tervezés. Több száz év alatt rengeteg változáson és fejlődésen ment keresztül, azonban hivatása továbbra is ugyanaz: esztétikus, de célszerű írásképet alkotni.
Művészeti ágnak számít, azonban alapjaiban tudományos kutatásokra támaszkodik. Tipográfiai tervezés során nem szabad csak a szépérzékre hagyatkozni, hanem fontos része az elemzések, tapasztalat és ismereteink alapján meghozott szakmai döntések is.
Grafikusoknak, webdesignerek és fejlesztőknek nélkülözhetetlen a terület ismerete a minőségi projektek alkotásához. Alapjai ismerete azonban mindenkinek hasznos lehet, különösen a digitális világban tevékenykedő szakembereknek, például a marketing vagy tartalomgyártás területén is.
Elkerülhetetlen, hogy ne találkozzunk nap mint nap a tipográfia elveit felhasználó vizuális anyagokkal. Legyen az plakát, újság, reklámtábla, weboldal, okostelefon app: mindegyik alkalmaz valamilyen tipográfiai szempontot és szabályt.
A területen, ahogy a legtöbb vizuális szakmában, folyamatosan új trendekkel és elvárásokkal találkozhatunk, így nem mindegy, hogy mennyire naprakész a tudásunk.
Évtizedekkel ezelőtt, kritikus változást hozott mind a hétköznapjainkban, mind a tipográfia világában a digitális eszközök megjelenése. Új lehetőségeket, elvárásokat, szabályokat és feladatokat jelentett a területen.
Kortárs tipográfiai tervezés során nem elég egy szempontnak megfelelni, több perspektívából kell megközelíteni az adott feladatot.
Weboldal tervezés során triviális kérdésnek tűnhet a betűméret megadása, azonban már ennél a döntéshozatalnál is több szempontot érdemes átgondolni:
Először is figyelembe kell venni, hogy weben pt (points) helyett px (pixel) mértékegység használata ajánlott az abszolút mértékegységek közül.
Az átlagos betűméret törzsszöveg esetén így 16px, ami a 12pt megfelelője.
Ugyanakkor, ha szeretnénk, hogy mindenkinek problémamentesen olvashatók legyenek a szövegek, érdemes relatív mértékegységet használni a px helyett. Betűméret megadása során erre alkalmas a rem (Relative to font-size of the root element), ami a böngésző beállításai alapján jeleníti meg a weboldalon a betűméretet.
A megadott alapértelmezett méret a böngészőkben általában véve 16px, tehát így:
1rem = 16px
Azonban, ha a felhasználó átállította a böngésző alap betűméretét 20px-re, akkor neki a böngésző az 1 rem méretű törzsszöveget 20px méretben jelenik meg. Ez romlott látású személyeknek lehet hasznos, akik nehezebben tudják elolvasni az átlagos vagy kisebb méretű szövegeket.
Címek esetén a reszponzivitásra is ügyelni kell méretek megadása során.
A képernyő jelentős részét elfoglaló főcím látványban megragadó lehet egy széles asztali monitoron, azonban mobil eszközön, ugyanazzal a mérettel megadva könnyen szétcsúszhat vagy kilóghat vízszintesen.
Ahhoz, hogy ezt elkerüld, először is mindenképp érdemes több eszközön tesztelni a tervet.
Ezt a hibát viszont megtudod előzni azzal, hogy több betűméretet adsz meg eszköztől függően. Például:
A tipográfia terület egyik legfontosabb és legismertebb eleme a betűtípus. Gyakran találkozhatsz angol megnevezéseivel is: font vagy typeface.
A betűtípus (typeface) a szimbólumok, karakterek vizuális megjelenésért felelős. Szabályrendszerként is értelmezhetjük, amelynek célja a betűket, számokat és egyéb jeleket vizuálisan egységesíteni.
A font kifejezést, eredeti jelentésében, kizárólag a betűtípus bizonyos változatára alkalmazták, például az “Arial” typeface, az “Arial Bold” (félkövér változat) viszont font.
Továbbá a különböző betűméretek esetén is ezt a kifejezést használták, így a Times New Roman 12pt és a Times New Roman 16pt technikailag 2 külön fontnak számított.
Manapság ez a köznyelvben összemosódott (az írógépek korában volt nagyobb jelentősége, amikor a betűvastagságok és méretek cseréje jóval körülményesebb feladat volt), így gyakran találkozhatunk a font kifejezéssel akkor is, ha az adott betűtípus több vastagsággal, változattal rendelkezik.
A betűtípus választás már a digitális kor előtt a tipográfiai tervezés része volt, azonban a személyi számítógépek megjelenésének hála megszámlálhatatlan mennyiségű opció közül válogathatunk.
Betűtípusokat számtalan módon csoportosíthatunk, de a két leggyakoribb kategória a talpas (serif) és talpatlan (sans-serif).
Egyéb népszerű csoportosítások, amiket érdemes ismerni laikusoknak is:
A talpas betűkön kiegészítő grafikai elemek, úgynevezett betűtalpak találhatók, amíg a talpatlan betűk ezekkel nem rendelkeznek. Általánosságban kijelenthető, hogy a talpatlan (azaz sans-serif) betűtípusok korszerűbbek, letisztultabbak megjelenésükben.
A talpas, azaz serif betűtípusok eredeti népszerűségükből jelentősen vesztettek, elsősorban könyvekben, nyomtatásban találkozhatunk velük. Modern megjelenésük révén a 20. század második felében a sans-serif betűtípusok váltották fel ezeket, elsősorban a digitális eszközökön.
Természetesen ezek a trendek nincsenek kőbe vésve, online felületeken is találkozhatunk kreatív, talpas betűkkel alkotott írásképpel.
Népszerű talpatlan betűtípusok:
Manapság is népszerű talpas betűtípusok:
Nem minden betűtípus használható fel ingyenesen tervezés során. A felsoroltak közül az Arial és Calibri ingyenesen elérhető Microsoft Windows felhasználóknak. A Helvetica, Futura és Gotham azonban nem, ezek prémium betűtípusnak számítanak. A betűképek megtervezése rengeteg időt, szakmai tudást és energiát vesz igénybe, így mint komoly szellemi termék, jelentős értékkel rendelkezik egy-egy betűtípus.
Szerencsére, ha nincs büdzsénk font licensz vásárlásra, akkor is rengeteg lehetőség közül válogathatunk tervezés során, legyen szó akár cégarculatról vagy egy hétköznapi dokumentumról. A Microsoft Windows alap betűtípusait bármely felhasználó alkalmazhatja ingyen, azonban mi azt javasoljuk, hogy érdemes izgalmasabb opciók közül is válogatni, ebben az alábbi oldalak lehetnek segítségünkre:
Amennyiben fontos, hogy cégünket vagy személyünket egy prémium font képviselje (amire a versenytársak se csaptak még le), akkor betűtípus licenszelő webáruházak vagy fonttervező stúdiók munkái közül válogathatunk. Például:
Adobe előfizetőknek pedig elérhető az Adobe Fonts, mely az Adobe szoftverekkel (Photoshop, Illustrator) már a tervezés során biztosít prémium betűtípusokat is extra költség nélkül, továbbá akár weboldalon is használhatók API kapcsolaton keresztül.
A betűkészlet tartalmazza a betűtípusban megtalálható karaktereket: betűket, számokat és jeleket. Egy betűtípus se tartalmazza az összes létező karaktert egyszerre. Ennek az egyszerű oka az, hogy a világ összes nyelvét összeadva szinte megszámlálhatatlan mennyiségű karaktert kapunk.
Kötelező ellenőrizni, hogy az általunk kiválasztott betűtípusban megtalálható-e minden számunkra szükséges karakter!
Magyar nyelvű szövegek esetén olyan betűtípust kell választani, amely tartalmazza az ő és ű betű karakterét is. A kettős éles ékezetet (nemzetközi megnevezése: hungarumlaut) kizárólag a magyar nyelv alkalmazza latin írásmódban, így gyakori, hogy (nem magyar tervező által alkotott) egyedi betűtípus nem tartalmazza. Amennyiben a szoftver nem találja a betűtípusban az adott karaktert, akkor helyettesíti egy másik betűtípussal vagy nem jelenik meg a betű. Ez rombolja a vizuális összhangot és az amatőrség érzetét kelti.
Az ilyen hibák elkerülése érdekében, vizuálisan magas minőséget igénylő szövegképek megalkotása előtt (pl. cégarculat tervezése során), érdemes grafikusra vagy a tipográfiában jártas szakemberre bízni a betűtípus kiválasztását.
A betűtípus választás vagy rövidebben betűválasztás, minden projekt esetén alaposan átgondolt döntésnek kell lennie.
Amennyiben egy új márka vagy website létrehozásába vágod a fejszédet, a betűtípus legyen az egyik első design-beli kérdés, amire a figyelmedet fordítod. Hiszen, ha egyszer már választottál, jó ideig azzal a döntéssel kell dolgoznod a továbbiakban.
Az alábbi szempontok segíthetnek a választásban:
A betűtípus természetesen csak a jéghegy csúcsa. Betűválasztás után nem áll meg a tervezési folyamat. A komplex döntések meghozásához tisztában kell lenni az általános fogalmakkal és a kiemelt irányelvekkel.
A szöveg olvashatósága alatt azt értjük, hogy olvasás közben mennyire könnyen és gyorsan tudjuk felfogni annak a tartalmát. Olvasás során (európai eredetű nyelvekben kifejezetten) nem betűnként, írásjelenként értelmezzük a szöveget, hanem ezeket egy pillanat alatt összeadva, szavakként fogjuk fel.
Rossz olvashatóság alatt azt értjük, ha az adott szöveg esetén a megszokottnál több időre van szükség az elolvasásához egy átlagembernek.
Szimpla információ közlés esetén ez jelentős hiba, de egy kreatív felirat alkalmazásánál elfogadható, amennyiben az egyedi megjelenés a fontosabb cél.
A szöveg tartalmára különösen oda kell figyelni. Az egyik legnagyobb buktató, ha folyamatosan helyesírási hibákkal találkozik az olvasó.
Helyesírás ellenőrző funkció majdnem minden dokumentum szerkesztőben megtalálható, anélkül ne írj szöveget!
Jelentősebb szövegek publikálása előtt pedig érdemes mindenképp legalább egy második személyt megkérni lektorálására. Több szem többet lát.
A szövegértésben elsősorban a tartalom számít. Azonban a hierarchia, formázás és a megfelelő tagolás is sokat segíthet a gyorsabb értelmezésben.
Építsd fel átláthatóan a szövegedet! Érdemes először átgondolni, hogy miről szeretnél írni, és vázlat alapján megalkotni a szöveget.
Szövegek terén a tartalom az elsődleges, ugyanakkor nem csak a belső, hanem a külső is számít. Törekedni kell arra, hogy minden publikált szöveg esztétikus legyen, így gyakran az átlagosnál is több időt és energiát érdemes fordítani erre a célra.
Például egy magazinban értelemszerűen nem egy Word dokumentumból behúzott, tördelés nélküli szöveget vár el az olvasó, hanem egy szakmailag helyesen elrendezett, formázott és kreatív megjelenést.
Szövegszerkesztés és szövegtördelés
Szövegszerkesztésnek nevezzük azt, amikor a szöveg tartalmát és megjelenését formáljuk. Hosszabb szövegek, pl. könyvek, magazinok esetében a szövegtördelés is része a tervezésnek, ami a szöveghasábok belső elrendezésének módosítását jelenti. Tehát az elválasztójelek, sorvégek, térközök, bekezdések esztétikai módosítása történik.
Tipp: Szövegtördelés nélkül nem ajánlott sorkizárt szöveget használni, túl nagy vagy túl kicsi térközök keletkeznek. Esztétikailag és olvashatóság szempontjából is hátrányos a tördelés nélküli sorkizárt szöveg.
Az egalizálás (angolul: kerning) a betűk közötti távolság tudatos megszabását jelenti.
Nem ajánlott, hogy a betűk túl közel vagy túl távol legyenek egymástól, továbbá a távolságoknak összhangban kell lenniük. Amennyiben ez nem valósul meg, rontja az olvashatóságot. Hétköznapi dokumentumok során a betűtípus alap távolságai is tökéletes lehet, nem szükséges kísérletezni a módosításával.
Könyvtervezés, magazinszerkesztés, logók, reklámanyagok esetében viszont ez is fontos része lehet a tervezésnek, ezért ez a feladat a grafikusra vagy tördelőre hárul.
A ligatúra két vagy több karakter vizuális összekötését jelenti, amellyel egy új összetett karakter születik.
Használata gyakoribb, mint, amire valószínűleg elsőre gondolnál, kisebb betűméretű szövegek esetén nem feltétlenül figyeli meg ezt az olvasó.
A leggyakoribb betűkapcsolat az fi pár.
A szöveg megjelenítéséhez felhasznált betűtípustól függ, hogy mely karakter kapcsolódásoknál és számszerint hány ligatúra található meg.
Monogram és tipográfiai logók esetében közkedvelt a ligatúrák használata, kreatív megoldásokra ad lehetőséget.
A szöveg első betűjének vizuális kiemelését jelenti.
Az iniciálé már a tipográfiát is megelőzte évszázadokkal, a kalligráfia területén született.
Elsősorban a történelemből lehet ismerős, kódexekben alkalmazták előszeretettel. Napjainkban gyakran magazinokban találkozhatunk vele.
Online vizuális anyagokban kiemelkedő szempont, hogy a lehető leggyorsabban és legtömörebben közöljünk információt a befogadó felé, anélkül, hogy bármi fontos elveszne belőle.
Bizonyos projektek, feladatok során a hibátlan egalizálás is jelentős figyelmet kell kapjon. Ilyen pl. a logótervezés: mivel több száz, ezer vagy akár millió személy találkozhat a véglegesített logóval, így fontos, hogy szakmailag hibátlanul készüljön el.
A gyárilag megadott betűtípus egalizáláson gyakran javíthatunk manuálisan, ha tökéletes végeredményt szeretnénk kapni.
Tipp: Az Adobe szoftverekben a betűk egalizálásához bekapcsolható az “Optical” mód, amivel a szoftver újrarendezi automatikusan a távolságokat, gyakran egy gombnyomásra jobb eredményt ad, mint ami előtte volt. Azonban ez se jelent mindig tökéletes megoldást, érdemes ellenőrizni a végeredményt.
A Helvetica, Garamond, Bebas és társai mind-mind kiválóan megtervezett betűtípus, azonban rengeteg üzlet, vállalat vizuális kommunikációjában találkozhatunk velük. Így ha fontos, hogy logóddal, márkáddal és kreatív anyagaiddal kitűnj a piacról, ne a legóvatosabb döntést hozd meg betűtípus választásnál!
Az aktuális trendeket nem kell beépíteni minden projektbe, de mindenképp érdemes tisztába lenni velük a szakma művelőinek!
A Google Fonts oldalán, de általánosságban az interneten egyre gyakrabban találkozhatunk “variable fonts” jelölésű betűtípusokkal. Ezek egyszerre ötvöznek több vastagságot és stílust egy betűtípuson belül. A “Regular” vagy “Bold” változat kiválasztása helyett értéket tudunk megadni, ami a két véglet között helyezkedik el.
Kifejezetten hasznosak lehetnek, ha teljesen szabad kezet akarunk kapni a vastagságok beállítása során.
A Google Fonts oldalán elérhető variable betűtípusok: https://fonts.google.com/variablefonts
A 3D megjelenés időről időre újra trendbe kerül. Az utóbbi években rengeteg új funkció érkezett a grafikai szoftverekben, ami meglehetősen egyszerűbbé tette a 3D alkalmazását tipográfiában is. Ebből adódóan egyre gyakrabban találkozhatunk 3D betűkkel közösségi média posztokban, weboldalakon, marketing anyagokban.
A kinetikus tipográfia (angolul: kinetic typography) alatt az animált tipográfiát értjük, amelyet a motion design területén egyre gyakrabban alkalmaznak.
Hatásos megoldás lehet reklámfilmekben, videó hirdetésekben vagy akár weben is.
Az “AI forradalom” betört a tipográfia területére is, egyelőre kísérleti eszközökkel találkozhatunk, mint az Adobe Firefly betűkép generálója, amely segítségével kulcsszavak segítségével generálhatunk különböző megjelenésű betűket.
A cikk kisebb összefoglalója a tipográfia azon részeinek, amit a laikusoknak is érdemes ismernie. Grafikusoknak, a grafikai iparág szakértőinek, UI/UX designereknek és szövegtördelőknek viszont érdemes mélyebben is utána néznie a témának.
Összegyűjtöttünk pár angol nyelvű cikket, amelyek elolvasásával mélyebben is megismerhető a tipográfia területe:
Szerző: Fucsku Dávid, design team lead
