Kako na spletno stran dodati "favicon"

Kaj je favicon? 

Favicon (krajšava za favorites icon) je majhna grafična ikona velikosti 16×16 ali 32×32 slikovnih pik, ki jo spletni brskalniki prikazujejo v zavihku spletne strani, med zaznamki, v zgodovini brskanja in na zaslonih mobilnih naprav.

Čeprav nima neposredne funkcionalne vloge pri samem delovanju strani, je ključna za uporabniško izkušnjo (UX) in identiteto blagovne znamke, saj uporabnikom omogoča hitro vizualno prepoznavanje vaše spletne strani med številnimi odprtimi zavihki.

Kako narediti favicon?

Favicon lahko oblikujete v grafičnem urejevalniku (npr. Photoshop, Figma, Illustrator) ali ustvarite s pomočjo namenskih spletnih generatorjev (npr. favicon.io ali RealFaviconGenerator).

Za optimalen prikaz na vseh napravah in v vseh brskalnikih je treba upoštevati naslednje tehnične zahteve:

1. Format in dimenzije:

   • favicon.ico (16×16 ali 32×32 pik): Tradicionalni format za združljivost s starejšimi brskalniki.

   • favicon.png (32×32 ali 64×64 pik): Standardni format za sodobne namizne brskalnike.

   • apple-touch-icon.png (180×180 pik): Za zaznamke na mobilnih napravah iOS.

   • favicon.svg (vektorski format): Sodobna izbira, ki omogoča prilagajanje velikosti brez izgube kakovosti ter podpira prilagajanje svetlemu/temnemu načinu (Dark Mode).

2. Poimenovanje in shranjevanje: Datoteke poimenujte s malimi črkami (npr. favicon.png ali favicon.ico).

3. Oblikovalske smernice: Ker je ikona zelo majhna, naj bo motiv preprost, visoko kontrasten in prepoznaven (npr. logotip brez besedila ali prepoznavna simbolna črka).

Kako dodati favicon med statične datoteke?

Nalaganje ikone favicon med statične datoteke v urejevalniku poteka po naslednjem postopku:

1. V administrativni plošči v desnem meniju izberite možnost Nastavitve (Settings).

2. V kategoriji Posebne lastnosti (Special Features) poiščite razdelek Statične datoteke strani (Site Static Files).

3. V tem razdelku kliknite gumb Naloži datoteko (Upload File), na računalniku izberite pripravljeno datoteko (npr. favicon.ico ali favicon.png) ter jo naložite.

4. Za uveljavitev sprememb na dnu menija z nastavitvami kliknite gumb Shrani (Save).

Kako dodati kodo za prikaz favicon v glavo vaše spletne strani?

Za uveljavitev ikone favicon na celotnem spletnem mestu sledite naslednjemu postopku:

1. V stranskem meniju urejevalnika spletne strani izberite možnost Nastavitve (Settings).

2. Poiščite in kliknite gumb Uredi kodo strani (Edit Site Code).

3. Odprl se bo urejevalnik izvorne kode.

Opozorilo: Spremembe v urejevalniku kode izvajajte previdno, saj lahko vnos nepravilne sintakse ali nenamerno brisanje obstoječe kode poslabša delovanje ali vizualno strukturo spletnega mesta.

4. Za dodajanje ikone favicon.png na vse strani spletnega mesta prilepite spodnjo HTML-oznako na sam konec obstoječe vsebine v urejevalniku:

<link rel="icon" type="image/png" href="https://mojadomena.si/favicon.png">

V kodi morate niz mojadomena.si zamenjati z imenom vaše dejanske domene:

Za uveljavitev sprememb na vseh straneh in podstranah spletnega mesta sledite naslednjim korakom:

1. V zgornjem meniju kliknite puščico poleg gumba Objavi (Publish).

2. Izberite možnost Celotno spletno mesto (Entire Site).

Opozorilo: Z objavo celotnega spletnega mesta boste javno uveljavili vse trenutno neshranjene ali osnutkovne spremembe – vključno s spremembami, ki se nahajajo na drugih podstraneh. Pred objavo se prepričajte, da so vse vsebine pripravljene za prikaz.

Sprememba ikone favicon bo v zavihku vašega brskalnika vidna v kratkem. Časovni zamik pri prikazu je običajen, saj brskalniki ter strežniška omrežja (CDN) statične datoteke pogosto shranjujejo v lokalni predpomnilnik (cache).