A következő tanfolyam indul

2017. szeptember 21.
1-flat-design-fonts

Tipográfia trend 2014

A múlt heti bejegyzésben írtunk a 2014-es év webdesign trendjeiről, most pedig leszűkítve a témát a tipográfiai trendekről olvashattok egy összefoglalót.

De mi is az a tipográfia?

A tipográfia a betűk, a szöveg beállításának a művészete. Magában foglalja a szöveg elhelyezését, méretét, tagolását, betűtípusát és minden egyéb paraméter kezelését ami a szöveg megjelenítéséhez kapcsolódik.

Azonban tipográfia nem csak papír alapon létezik, hanem weben is, hiszen ott is szöveg van amit az emberek elolvasnak. A webdesign-nak nagyon fontos eleme a tipográfia, hiszen a webdesign lényege a tartalom megfelelő tálalása, amivel segítünk az oldalon tartani az odalátogatókat és így vevőket, partnereket tudunk szerezni. Ebben azonban nem csak a képeknek, webergonómiának, tartalomnak és a színeknek van szerepe (ez utóbbiról itt olvashattok), hanem a tipográfiának is. Egy jól megválasztott font (betűtípus) teljesen egyedi hangulatot tud kölcsönözni az oldalnak.

Ne feledd! A tipográfia mint látvány hamarabb gyakorol hatást az olvasóra mint maga a szöveg, a tartalom.

Nézzük most mik lesznek a tipográfiai trendek 2014-ben.

Handwritten fonts – Kézírás jellegű fontok

A mai világban, ahol minden a közösségi médiákon keresztül zajlik, minden mozdulatukat, tevékenységüket publikálják az emberek  ahol minden olyan futószalagszerű és tömegjellegű, ott valahogy be kell csempészni az egyediséget, a személyiséget. Ennek kiváló eszköze a handwritten font vagyis a kézírás jellegű fontok használata. Ezek lehetnek ténylegesen egyszerű kézírás fontok, vagy már-már rajzolt, akár skicc szerű fontok, vastag duci, vagy elnyújtott keskeny betűk.

Íme néhány hely ahol szuper jó handwritten fontokat találhattok:

http://blog.spoongraphics.co.uk/freebies/30-free-handwriting-fonts-every-designer-should-own

http://www.1001fonts.com/handwritten+script-fonts.html

http://www.fontspace.com/category/handwritten

 

Flat Design Tipográfia

A Flat designról már beszéltünk múlt heti Webdesign trendek 2014 bejegyzésben. Mint ott is írtuk, a Flat design lényege gyakorlatilag – ahogy a neve is mutatja (“lapos” design), –  hogy elhagy minden külcsínt és effektet mint a vetett árnyék, színátmenetek, ragyogás effektek, stb. Nem térbeli megjelenítésre törekszik, hanem szó szerint lapos. Egy teljesen letisztult, színeket és tipográfiát előtérbe helyező irányzat. A grafika is nagyon kezdetleges jellegű.

A Flat fontokra jellemző, hogy letisztultak, általában egyszerű vonalúak, könnyen olvashatóak.

Itt találhattok ilyen Flat fontokat:

http://www.hongkiat.com/blog/flat-design-free-fonts/

http://smashinghub.com/free-fonts-for-flat-design.htm

http://onlinetechguru.org/35-free-flat-design-fonts-for-you/

 

Mix & Match tipográfia – a fontok profi keverése

Szintén írtunk erről a 2014-es webdesigntrendekről szóló cikkünkben. A lényege a különböző fonttípusok és fontok mesteri keverése úgy, hogy a végeredmény egy kompakt, egységes kép legyen.

Igen ám, de hogyan keverjük úgy a fontokat, hogy az eredmény ne egy nagy katyvasz legyen? Hogy csinálják a profik?

1. Először is jó, ha tisztában vagy a tipográfiai alapokkal. Hogy mik a legfontosabb betűtípus családok: pl. talpas (serif), talpatlan (sans serif), vastagított (blackletter). Ezeken belül is vannak csoportok. Aztán vannak például írott (script) típusok, ezen belül lehetnek például (handwritten, school, calligraphy…)

2. Hogyan válogassuk a fontokat össze? Alaphelyzetben az az általános elfogadott szabály, hogy maximum 3 típust használjunk és az írott keverhető a talpas vagy talpatlan fonttal, de a hármat együtt már ne használjuk. Nos azért ezeket a szabályokat is meg lehet szegni, ha jól csináljuk.

Nézd csak:

 Azonban nem csak a fontcsaládokkal, font típusokkal lehet játszani, hanem a méretekkel, a betűközökkel, illetve azzal is, hogy egy adott fontot normal (normál), bold(vastag), italic (dőlt) módban használunk. Sőt nyújthatjuk, lapíthatjuk vagy azzal is variálhatunk, hogy NAGYBETŰVEL ÍRUNK (verzál) vagy kicsivel :) …stb.

 

Nagy betűk

Ez egyrészt takarja azt, hogy az normál szövegnél sem a 11-12-es betűméretet használjuk, hanem nagyobb méreteket. (És nem csak Arial, Times New Roman és társait használjuk a kitöltő szövegeknél, hanem bármilyen egyedi Google webfontot.) Fontos a jól olvashatóság és átláthatóság.

Másrészről nagy fontokat használhatunk kiemeléseknél is például egy főoldali Slidernél, vagy képnél, mint azt a fenti példa is mutatja.

 

Ikon fontok

Az ikonok használata pár éve – főleg a közösségi média megjelenése óta – már elterjedt, megjelentek az ikon fontok. Mikor elkezdték gyártani a vektoros ikonokat, lehetővé vált azok fontként való felhasználása, és így gyakorlatilag ugyanazokat a színeket, effekteket alkalmazhatjuk rájuk, mint a normál fontokra.

Itt találhattok pár letöltőhelyet:

http://sixrevisions.com/resources/free-icon-fonts/

http://webdesignledger.com/freebies/10-super-useful-free-icon-font-sets

http://speckyboy.com/2013/02/20/free-icon-font-sets/

 

 

 

 

Hozzászólások

  • Andi

    “Hogy mik a legfontosabb betűtípus családok: pl. talpas (serif), talpatlan (sans serif), vastagított (blackletter). ”

    Egy helyesbítés: a Blacletter az nem általában jelenti a vastag betűket, hanem kifejezetten az olyan stílusú betűt jelöli, amit Gutenberg használt az első nyomtatott könyvben. Ilyen betű pl. a New York Times fejléce.

    • Cziráki Barbara

      Köszönjük Andi, mi is pontosan erre a betűcsaládra gondoltunk.

      • Sachiko

        from szerint:Me1r csak az a ke9rde9s, hogy mi ezen a neetvse9ges. Valahogy csak ki kellett te1masztani, hogy ne dőljf6n el.Szerintem rosszabbul is ne9zne ki ane9lkfcl. Valahogy a ve9kony oszlopok hfclye9n mutatne1nak azon a vaskos heddon.Vagy nemtudom.