Netreba si mýliť pojmy favicon a logo - aj keď oba obrázky predstavujú identitu značky, sú to odlišné veci. Hlavným účelom faviconu je zvýrazniť a zviditeľniť váš brand alebo webovú stránku medzi kartami prehliadača. Okrem toho je favicon príležitosťou pre firmy, aby ich značka bola rýchlejšie zapamätateľná pre zákazníkov. Obrázok priťahuje pozornosť a je automaticky spájaný so značkou.
História a Vývoj Faviconu
Favicon bol prvýkrát predstavený v roku 1999 spoločnosťou Microsoft v internetovom prehliadači Internet Explorer 5. Pôvodne mal slúžiť na označovanie stránok v zozname obľúbených záložiek (favorites), odkiaľ pochádza aj jeho názov. Postupne sa rozšíril do ostatných prehliadačov a stal sa štandardnou súčasťou webových stránok.
V súčasnosti sa favicon používa na viacerých úrovniach. Okrem klasického zobrazenia v záložkách je integrálnou súčasťou mobilných zariadení a vyhľadávačov, kde sa môže zobraziť pri vyhľadávaní ako doplnok k odkazu na web. Vyhľadávače ako Google favicon zobrazujú aj pri reklamách, čo môže zvýšiť dôveryhodnosť webu.
Prečo je Favicon Dôležitý?
Napriek svojej malej veľkosti má favicon veľký vplyv na užívateľskú skúsenosť a brand identitu. Správne zvolená a implementovaná favicona pomáha webu lepšie sa identifikovať a zapamätať si ho medzi konkurenčnými stránkami. Mať ju, je v mnohých smeroch výhodou a určite sa oplatí myslieť na ňu pri stavbe webu.
Favicon je vizuálnou reprezentáciou vašej webstránky a tak umožňuje používateľom identifikovať a stotožniť sa s vašou značkou. A čím viditeľnejší váš web je, tým väčšiu šancu máte, že naň používatelia kliknú a zapamätajú si, kto ste.
Viditeľná ikona faviconu na kartách prehliadača, v záložkách, v histórii vyhľadávanie a podobne pomáha vašim používateľom a návštevníkom šetriť čas tým, že im umožňuje bez problémov identifikovať a prehliadať vašu webstránku, čím sa zvyšuje pravdepodobnosť interakcie používateľa s vašim webom.
Favicon síce nemá priamy vplyv na SEO, ale zohráva dôležitú úlohu v rámci brandingu a marketingu. Favicon je totiž nepriamo zodpovedný za vašu optimalizáciu pre vyhľadávače, pretože je dôležitým nástrojom na zlepšenie vášho hodnotenia vo vyhľadávačoch. User-friendly webstránka nepriamo zlepšuje vaše hodnotenie vo vyhľadávačoch.
V súčasných prehliadačoch môžete mať naraz otvorených niekoľko záložiek. Favicona v tomto smere uľahčuje orientáciu používateľa. Skúste nazrieť do histórie svojich prezeraných stránok alebo obľúbených záložiek. Uvidíte, že najpoužívanejšie prehliadače pri adrese a mene stránky zobrazujú aj ikonu favicon.
Formáty a Veľkosti Faviconu
V minulosti obrázky pre favicon museli byť iba vo formáte .ico. Tento formát umožňuje určiť niekoľko veľkostí ikon s rôznou bitovou hodnotou. V súčasnosti medzi najpopulárnejšie formáty súborov pre favicony patria .png a .svg. Väčšina moderných platforiem a operačných systémov podporuje formát .png (okrem Internet Explorer). Okrem iného, na vytvorenie súboru .png nepotrebujete žiadne špeciálne nástroje, vďaka čomu je veľmi užívateľsky prívetivý. Čo sa týka formátu .svg, podporujú ho iba Opera, Chrome, Firefox, MacOS Safari. Čo sa týka formátov .jpeg, .gif a .apng - tieto formáty majú problémy so zobrazením kvôli nedostatku širokej podpory prehliadačov.
Pre správne zobrazovanie faviconu je potrebné ho používať v správnej veľkosti. Vo všeobecnosti sa odporúča veľkosť 16x16px, pretože sa dá použiť vo všetkých prehliadačoch.
Štandardný rozmer favicony je 16×16 px, ale odporúča sa pripraviť aj väčšie verzie, napr. Niektoré služby dokážu generovať celú sériu rôznych veľkostí i keď základná verzia ikony má len 16×16 pixelov. Stretnúť sa s nimi môžeme napr. pri mobilných aplikáciách.
Najčastejšie používaným formátom je ICO, pretože podporuje viacero rozlíšení v jednom súbore.
Ako Vytvoriť Efektívny Favicon
Pri vytváraní favicou pre vašu webstránku je potrebné brať do úvahy niekoľko vecí. Aj keď je favicon malý, má a mal by mať veľký vplyv. Pretože práve podľa faviconu budú používatelia identifikovať vašu značku.
- Favicon nemôže byť vždy len menšou verziou loga. Najlepšie favicony sú tie najjednoduchšie.
- Vzhľadom na malú veľkosť a jednoduchosť použitých tvarov je dôležitým faktorom práve farba. Favicon by mal upútať pozornosť a vynikať spomedzi potenciálnych konkurentov.
- Vyhnite sa však príliš veľa detailom, tie môžu spôsobiť, že favicon bude vyzerať neprehľadne a chaoticky.
Ideálnym podkladom pre tvorbu ikony je logo vo formáte PNG alebo JPEG. Každá dobrá firemná stránka, e-shop či blog by nejaké logo mala mať. Logo si ľudia, ako dôležitý prvok firemnej identity, zväčša dobre pamätajú.
Čo robiť v prípade, že nemáte vlastné logo ani vyhovujúci obrázok? Cestou je ikonu vytvoriť po svojom.
Ako Implementovať Favicon na Webovú Stránku
Ikonu favicon.ico vie väčšina dnešných služieb a prehliadačov automaticky detekovať zo zdrojovej zložky stránok. Ikonu preto stačí nahrať cez FTP rozhranie do root zložky. Využiť na to môžete prístupové údaje vášho webhostingu a správcu súborov, napr.
Tip: Ikona sa dá v niektorých šablónach nahrať priamo v nastavení. Pomocnú ruku vám podajú aj online generátory, ak nechcete hľadať grafika.
Ste na správnom mieste. Teraz môžeme túto ikonu nahrať medzi súbormi. Akonáhle máte ikonku nahranú, je potrebné si skopírovať adresu. Následne budeme musieť upraviť XHTML šablónu - Nastavenia - Upraviť XHTML - Hlavná šablóna. Otvorí sa vám okno, v ktorom vidíte XHTML kód vašej aktuálnej šablóny. Teraz klikneme na Uložiť.
Pre zvedavé: ikona môže mať aj inú obrázkovú príponu, ale v tom prípade sa nemusí zobrazovať vo všetkých prehliadačoch.
Tabuľka: Prehľad Formátov Favicon
| Formát | Podpora Prehliadačov | Poznámky |
|---|---|---|
| ICO | Všetky hlavné prehliadače | Najčastejšie používaný, podporuje viacero rozlíšení |
| PNG | Väčšina moderných platforiem (okrem Internet Explorer) | Jednoduché vytvorenie, poskytuje najmenšiu veľkosť súboru |
| SVG | Opera, Chrome, Firefox, MacOS Safari | Obmedzená podpora |
| JPEG, GIF, APNG | Problémy so zobrazením kvôli nedostatku širokej podpory prehliadačov | Neodporúča sa |
Favicon je neoddeliteľnou súčasťou identity značky a technického standardu každého moderného webu. Netreba ho vnímať len ako malý obrázok, ktorý “ozdobí“ vašu stránku.