Ako poželite da uđete dublje u tematiku o fontovima i kako se uopšte fontovi u web dizajnu koriste, garantujem da će vas zaboleti glava. Ne možete ni zamisliti koliko detalja, informacija ima o nečemu što će se laiku na prvi pogled učiniti kao potpuno preterivanje, jer će većina nas pomisliti da možemo sa velikom sigurnošću reći šta je čitko, a šta nije, već pri prvom pogledu na ekran. A čitkost jeste najvažnija ukoliko je cilj da na sajtu, svojim klijentima i potencijalnim kupcima, pre svega, pružite korisne informacije. Naravno uvek ima izuzetaka i tada možete na sajtu imati i manje čitak font jer teksta nema mnogo i jer je izgled, lepota slova u tom slučaju važnija.
Mi ćemo vam u ovom tekstu pisati o mogućnostima izbora fontova kao i o postavljanju fontova na WordPress i HTML sajtove.
Ako vas, međutim, interesuje da se više udubite u temu, možete početi ovde.
Veb tipografija
Tipografija ili slovoslagarstvo, kako reč kaže, se bavi slaganjem slova, bukvalno rečeno, odnosno koji oblik slova će biti izabran, kako će se slova organizovati na štampanoj stranici, koji će biti razmaci između slova, između reči, koliki će biti razmak između redova, dužina redova, veličina margina i tako dalje i tako dalje.
Do digitalizacije, tipografijom su se bavili posebno obučeni slogoslagači, tipografi… ali danas, upravo zbog uznapredovale digitalizacije, mnogo lakše i dizajneri i laici mogu koristiti različite fontove pri izradi stranica na webu, ali i za štampani materijal.
Veb tipografija podrazumeva izbor slova za web stranice, a ne za štampani materijal.
Mogućnosti prilikom izbora fonta u web dizajnu
Kao i u svemu, imate mogućnost za besplatnu i plaćenu varijantu. Ali kod izbora fonta za web sajt, korišćenje besplatnih fontova ZAISTA zadovoljava 99% slučajeva. Osim ako ste veliko ime, bukvalno veliko kao Coca-Cola ili McDonalds, poznati u celom svetu, onda je u redu da za vas poseban tim dizajnera crta poseban font, koji ćete samo vi koristiti. Inače, ZAISTA nema potrebe da plaćate font, jer Google fontovi u ponudi imaju čak 1.455 porodica fontova.
Ako pak želite da budete malo drugačiji od drugih, a nemate novca da platite dizajnere da naprave novi font samo za vas, možete pogledati fontove koje u ponudi ima Adobe. Fontovi se ne naplaćuju posebno ali da bi im pristupili treba da se pretplatite na Adobe Creative Cloud. Naravno, i ovde postoji besplatna opcija, ali onda je broj fontova ograničen. Takođe, uvek možete guglati i pronaći plaćene fontove na drugim mestima. Jedno od njih je i Creative market.
U web dizajnu se preporučuje korišćenje najviše tri različita fonta. Najbolje dva, jedan za naslove i/ili podnaslove, a drugi za većinu teksta (tzv. paragraf/pasus tekst) i podnaslove. Naravno sve zavisi od toga koju poruku želite da prenesete vašim sajtom, da li je u pitanju npr. osiguravajuća kuća ili sajt neke medicinske ustanove ili neki umetnički sajt. Prilikom izbora fontova zaista treba voditi računa o mnogo stvari i zato je uvek bolje sve prepustiti profesionalcima. Jer ako mislite da se izbor fonta svodi samo na to da vam slova na web stranici izgledaju lepo, možete dobiti sajt koji je nečitljiv, sa nečitkim slovima i koji umesto da privuče samo odbije potencijalne klijente. Kao na primer sajt kompanije Pacific Northwest X-Ray Inc.
Postavljanje fontova na WordPress sajt
U zavisnosti koju WordPress temu koristite, broj fontova koji vam je po difoltu dostupan varira. Naša preporuka je Divi Theme koja koristi Google fontove. Pri tome, neovisno o temi, uvek možete aplodovati custom font koji ste kupili ili našli besplatan na nekom od sajtova sa besplatnim fontovima.
Proces se ukratko sastoji od:
- pronalaženja fonta
- download-ovanja fonta
- potom font treba da prilagodite za web, kako bi osigurali da će se prikazati u svakom browser-u i na svim uređajima
- nakon toga treba da ga zipujete u jedan fajl, aplodujete u odgovarajući folder na websajtu koristeći neki od FTP client-a
- ostaje da u css fajl vaše teme ubacite nekoliko linija koda i time pozovete font da se prikaže na stranicama sajta i uradite css stilizaciju
- ili da sve ovo preskočite i instalirate neki plugin za ubacivanje custom fonta. No treba da imate na umu da svaki dodatni plugin instaliran na WordPress sajt dodatno usporava vaš sajt i najbolje je izbegavati dodavanje previše dodataka tj. stavljati ih samo kada su neophodni
- naša preporuka je da ukoliko želite custom font, angažujete profesionalce koji će ovo uraditi umesto vas, jer su mogućnosti za greške velike
Postavljanje fonta na HTML sajt
Za HTML sajtove je potrebno dosta više znanja da bi ih menjali, uređivali pa i postavljali font. Za razliku od WordPress sajta, potrebno vam je poznavanje i HTML-a i CSS-a. A proces postavljanja custom ili besplatnog fonta iz Google biblioteke fontova je sličan postavljanju fontova na WordPress sajt:
- prvo treba da izaberete ili pronađete font
- ako nije Google font onda treba i da ga download-ujete
- skinuti font treba da prilagodite za web, kako bi osigurali da će se prikazati u svakom browser-u i na svim uređajima. Sa Google fontovima ovaj korak možete da preskočite jer ćete font pozvati direktno iz Googlove biblioteke (ne morate ga imati na serveru gde je vaš sajt, u nekom folderu)
- ako nije u pitanju Google font, custom font treba da aplodujete u folder napravljen samo za font koristeći neki od FTP client-a
- poslednji korak je ubacivanje nekoliko linija koda u css fajl kako bi se custom font prikazao na stranicama sajta (bukvalno treba da ga pozovete da se prikaže na stranicama sajta).
- i na kraju je potrebno uraditi CSS stilizaciju za sve tekstualne elemente (pasus, naslov, linkove itd.)
Uputstvo za biranje besplatnog Google fonta
Kada odete na sajt Google fontova prvo izaberite koju kategoriju od ponuđenih 5 želite da pregledate. Možete birati između sledećih kategorija:
- serif fontovi – oni su više klasični, formalni, neki kažu i elegantni. U tipografiji, serifi su detalji na krajevima nekih slova, pa font koji ima serife se zove serif font. Češće se koriste za štampani materijal, pošto mogu izgledati nečitko na ekranima, posebno ako su slova sitna. No možete ih koristiti za naslove, kojima je font-size veći od veličine za običan pasus tekst. Treba imati na umu da je sa povećanjem rezolucije ekrana koje danas koristimo moguće da serif fontovi odlično izgledaju i budu čitki na velikim ekranima čak i kada je veličina slova manja.
- sans-serif fontovi – to su fontovi bez detalja na krajevima slova, i oni su više moderni, minimalistički. Češće se koriste za Web. Međutim uz digitalnu štampu mogu odlično da izgledaju i na štampanom materijalu.
- display fontovi – to su fontovi koji su pravljeni pre svega za naslove, u kojima su slova mnogo veća od slova u dugačkim pasusima, sa mnogo teksta. Tradicionalni display fontovi se ponekad zovu dekorativni. Oni služe da se privuče čitaočeva pažnja, da izazovu određeno osećanje, da njime objavite nešto veoma važno.
- handwriting fontovi – to su fontovi koji izgledaju kao da je neko rukom pisao tekst. Oni su više ukrasni i preporuka je da se koriste kao i display fontovi, za kraće naslove, kako bi privukli pažnju čitaoca i preneli poseban osećaj.
- monospace fontovi – to su fontovi u kojima svi pojedinačni znakovi ili slova imaju istu širinu
Pošto ste izabrali kategoriju, birate jezik odnosno, za naša slova birate između:
- Latin Extended – latinična slova čćšđž
- Cyrillic Extended – ćirilična slova шђжчћљњ
U delu gde piše Sentence izaberite Custom i potom ukucajte naša slova na latinici (čćšđž) ili ćirilici (шђжчћљњ), u zavisnosti od toga da li ćete praviti sajt na ćirilici ili latinici.
Kada sve ovo uradite, ispod će vam se izlistati unet tekst ispisan različitim fontovima, u izabranoj kategoriji. Tako ćete imati pregled koji font podržava naša slova i lakše ćete izabrati font za svoj projekat.
Kad pregledate sve ponuđene fontove, kliknite na one koji vam se najviše dopadaju i pregledajte detaljno kako izgledaju sva slova, brojevi i ostali znaci (glyphs) ispisani njime. Ovde imate dodatnu opciju biranja kontinenta (birate između: svi kontinenti, Afrika, Amerike, Azija, Evropa i Okeanija) i jezika (birate između: svi jezici ili pojedinačan jezik među kojima možete izabrati bosanski, bosanski-ćirilica, hrvatski, srpski i srpski-latinica).
Zatim možete izabrati težinu tj. debljinu slova (font-weight) i tu birate između regular, bold, light itd. u zavisnosti od fonta.
Zaključak
Trudili smo se da ne komplikujemo stvari mnogo i da što jednostavnije opišemo kako teče proces biranja i postavljanja fontova na web sajtove. Bez ulaženja u mnogo tehnikalija, tek toliko da naslutite o čemu se radi, a da se ne smorite čitajući tekst. Nadamo se da smo uspeli o tome.
Nikolina Mihaljević
