Napraviti i postaviti favicon

Favicon je mala sličica (ili animacija) koja se pojavljuje pored vaše internet adrese i bookmarksa baš poput ove na slici:

Većina web stranica ih ima tako da sad već favicon predstavlja i nekakav zaštitni znak weba, nešto poput loga. Evo kratki tutorijal kako napraviti favicon i postaviti ga na web stranicu:

U Photoshopu otvorite New File 16 x 16px.

Dizajnirajte svoj favicon, no obratite pažnju da imate tek malenu površinu za rad, dakle napišite neko slovo, zaštitni znak, logo, sličicu ili što god već, što će predstavljati vašu stranicu:

Sad odaberete File > Save for web, a ako imate PS CS3 onda save for web and devices:

Iako su faviconi .ico file, u photoshopu ih ne možete tako spremiti, zato ih spremamo kao .gif i koristimo neki drugi software da ih konvertiramo u .ico file.

Kad ste spremili favicon kao .gif, idete na Favicon from Pics, napravite upload svoje .gif slike na njihovu stranicu, ovako:

Na browse pronađete svoju sliku na svom kompjuteru, idete na generate favicon.ico i

nakon toga pritisnete download favicon i dobijete folder koji treba unzipovat. U tome folderu imate favicon.ico file

koji treba postaviti između HEAD tagova na svaku stranicu na kojoj želite da vam se favicon pojavljuje. Što bi izgledalo ovako:

<link rel=”Shortcut Icon” href=”/favicon.ico”/>

Ako vam se favicon ne pojavljuje, vjerojatno će te trebati postaviti cijeli link do slike, npr. ovako:

<link rel=”shortcut icon” href=”https://www.ri-web.org/images/favicon/favicon.ico” / >

Želite li imati animirani favicon, napravite animaciju i samo još uz ovaj link dodajte i link s animacijom, to bi izgledalo ovako: