Ikonografija

Ikonografija je skup ikona koje firma koristi, zajedno s pravilima kako izgledaju i gdje se koriste. Na sajtu su to sličice u meniju, uz usluge, u formama i na dugmadi. Na štampi su to piktogrami na tablama, ambalaži i uputstvima.

Ikona ima jedan posao: da čovjek nešto brže prepozna ili nađe. Kad to ne radi, postaje ukras koji traži pažnju, a ništa ne daje.

Šta ikona zaista radi

Nekoliko ikona ljudi prepoznaju bez teksta. Lupa je pretraga, kućica početna, tri crte meni, korpa kupovina, iks zatvaranje. To su znakovi koje su ljudi naučili na hiljadama sajtova.

Sve ostale ikone su manje jasne nego što izgledaju dizajneru koji ih je birao. Zupčanik može biti postavke, servis ili proizvodnja. Štit može biti sigurnost, garancija ili osiguranje. Zato uz ikonu gotovo uvijek stoji tekst, a ikona služi da se taj tekst brže pronađe pogledom.

Jedan set, jedna pravila

Ikone se razlikuju po stilu: debljini linije, zaobljenosti uglova, tome da li su obrisi ili popunjene, i mreži na kojoj su crtane. Kad se na istoj stranici nađu ikone iz tri različita seta, to se vidi i kad posjetilac ne zna zašto mu nešto smeta.

Zato se bira jedan set i drži. U dizajn sistemu se zapiše koji je to set, u kojim veličinama se koristi i koje boje ikone smiju imati. Kad zatreba ikona koje u setu nema, crta se u istom stilu, umjesto da se uzme prva slična s interneta.

Uz vizuelni identitet ikone treba uskladiti s ostalim: zaobljeno pismo traži mekše ikone, oštar i tehnički identitet traži ravne linije. Pravila idu i u knjigu standarda, da ih poštuje i štamparija i onaj ko pravi sljedeću prezentaciju.

Gotov set ili vlastiti

Većini firmi je dovoljan dobro izabran gotov set. Postoje besplatni setovi s hiljadama ikona u istom stilu, koji pokrivaju sve što trebaju sajt i aplikacija. Prije upotrebe se provjeri licenca, naročito za komercijalnu upotrebu i za štampu.

Vlastiti set ima smisla kad ikone nose prepoznatljivost: u aplikaciji koju kupci koriste svaki dan, na ambalaži linije proizvoda ili na signalizaciji u većem objektu. Tada je to dio identiteta, i pravi se zajedno s njim.

Format i tehnika

Na sajtu ikone idu kao SVG, jer su vektorska grafika: oštre na svakom ekranu, male po težini i mogu mijenjati boju kroz kod. Fontovi s ikonama, koji su se nekad koristili, danas se izbjegavaju, jer se učitavaju sporije i lošije se čitaju pomoćnim alatima.

Ikona koja je i link ili dugme treba površinu dovoljno veliku za prst, čak i kad je sama sličica mala. Na telefonu se to najviše osjeti u navigaciji i u formama.

Mala ikona za karticu pregledača i početni ekran telefona je poseban slučaj. O njoj više piše pod pojmom favicon.

Ikone i pristupačnost

Za čovjeka koji koristi čitač ekrana ikona bez opisa ne postoji, ili se pročita kao naziv fajla. Ikona koja nešto znači, recimo dugme sa samo lupom, dobija tekstualni opis. Ukrasna ikona pored naslova se za čitač sakrije, da ne smeta.

Ikone koje nose značenje trebaju i dovoljan kontrast prema pozadini, po pravilima o pristupačnosti najmanje 3:1. Svijetlosiva ikona na bijelom, koja jedina pokazuje da se polje može obrisati, većini ljudi ostaje nevidljiva.

Boja ne smije biti jedini nosilac poruke. Zelena i crvena kvačica izgledaju isto čovjeku koji ne razlikuje te dvije boje, pa se razlikuju i oblikom.

Ikone koje ništa ne govore

Najprepoznatljiviji obrazac na generičkim sajtovima su tri ili šest kutija, svaka s ikonom, naslovom i dvije rečenice. Ikone su tu raketa, sijalica i štit, i ne govore ništa o firmi.

Takve ikone se ne pamte i ne pomažu da se nešto nađe. Bolje rade fotografije stvarnog posla, brojevi ili jednostavno dobar naslov. Ikona ima smisla kad stvarno označava nešto što se ponavlja, recimo vrstu usluge ili korak u postupku.

Primjer iz prakse

Ugostiteljski objekat s apartmanima iz Čitluka ima sajt s ikonama iz tri izvora: obrisi za sadržaj sobe, popunjene ikone u podnožju i šarene sličice za aktivnosti u okolini. Gosti pitaju porukom ima li parking, iako ikona za parking stoji na stranici.

Ikone se zamijene jednim setom, svaka dobije natpis uz sebe, a lista sadržaja sobe postane kratka tabela s ikonom i riječju. Ista pravila se primijene na table u objektu. Pitanja o parkingu prestanu, jer stoji napisano.

Kad ovo nije vaša briga

Sajt od nekoliko stranica s gotovom temom obično već ima jedan set ikona. Dovoljno je ne dodavati nove iz drugih izvora i provjeriti da svaka važna ikona ima natpis.

Greške koje najčešće viđamo

Najčešće su to ikone iz više setova na istoj stranici.

Česta su i dugmad sa samo ikonom, bez natpisa i bez opisa za čitač ekrana.

Viđamo ukrasne ikone koje ništa ne govore o firmi.

Tu su i ikone preuzete bez provjere licence.

Na kraju, svijetle ikone na svijetloj pozadini koje se jedva vide.

Lista za provjeru

• Koriste li sve ikone isti set i isti stil?
• Stoji li uz svaku važnu ikonu tekst?
• Imaju li ikone koje se klikću opis za čitač ekrana?
• Jesu li ikone u SVG formatu?
• Piše li negdje koji set se koristi i u kojim veličinama?

Pojmovi koje ćete čuti uz ikonografiju

• Icon set: skup ikona nacrtanih u istom stilu.
• Outline i filled: ikone iscrtane linijom i popunjene ikone.
• Piktogram: ikona za javni prostor, table i uputstva.
• Stroke: debljina linije kojom je ikona nacrtana.
• Aria-label: tekstualni opis koji čitač ekrana pročita umjesto ikone.