Favicon (z anglického favorite icon, oblíbená ikonka) je malý obrázek, který prohlížeč zobrazuje u názvu webu – na kartě, v seznamu záložek, v historii i na ploše mobilu, když si stránku uložíte jako zkratku.
Je to drobnost, která má nečekaný vliv. Když má návštěvník otevřených patnáct karet, název se scvrkne na pár písmen a jediné, co je pořádně vidět, je právě ikonka. Bez ní se zobrazí anonymní šedý list papíru a Váš web mezi ostatními zapadne.
Na co při přípravě myslet:
- Jednoduchost – ikonka se zobrazuje často jen jako čtvereček 16 na 16 bodů. Celé logo s textem se v té velikosti slije v šmouhu, lepší je jeden výrazný znak nebo symbol.
- Více velikostí – kromě klasické ikonky se hodí i větší varianty pro mobilní plochy a dlaždice, aby nikde nebyla rozmazaná.
- Formát – historicky ICO, dnes běžně PNG nebo SVG. JPEG se nehodí, protože neumí průhledné pozadí.
- Světlý i tmavý režim – ikonka s tmavou kresbou zmizí na tmavém pozadí karty, proto se vyplatí ji ohraničit nebo podložit.
Technicky se soubor nahraje do webu a odkáže se na něj v hlavičce HTML značkou link. Prohlížeče ho navíc hledají i automaticky v kořenovém adresáři pod jménem favicon.ico. V redakčních systémech jako WordPress se ikonka nastavuje přímo v administraci a systém si potřebné velikosti vygeneruje sám.
Častý zádrhel: po výměně ikonky pořád vidíte tu starou. Může za to cache prohlížeče, která si favicony drží obzvlášť dlouho. Pomůže obnovení stránky přes Ctrl+F5, vymazání cache nebo nahrání souboru pod novým jménem.