Vytvoření ikony pro vaši webovou stránku (favicon.ico) může být důležitým krokem k posílení vaší značky a zlepšení uživatelského zážitku. Favicon je malá ikona, která se zobrazuje vedle názvu vaší stránky v záložkách prohlížeče. V tomto článku si ukážeme, jak můžete snadno vytvořit favicon.ico z obrázku ve formátu PNG pomocí bezplatného a otevřeného softwaru GIMP.
Příprava obrázku
Než začneme, je důležité si uvědomit, že favicony jsou obvykle velmi malé obrázky, nejčastěji 16x16 nebo 32x32 pixelů. Z toho důvodu byste měli vybrat nebo upravit obrázek tak, aby byl jednoduchý a rozpoznatelný i v tak malém rozměru.
-
Otevření PNG obrázku v GIMPu
- Spusťte GIMP a otevřete svůj PNG obrázek přes
Soubor > Otevřít.
-
Úprava velikosti obrázku
- Jděte do
Obrázek > Změna velikosti obrázku.
- Zadejte novou velikost obrázku (např. 16x16 nebo 32x32 pixelů) v dialogovém okně a klikněte na
Změnit velikost.
-
Úpravy obrázku (nepovinné)
- Pokud je to potřeba, použijte nástroje GIMPu k dalším úpravám obrázku, aby byl co nejčitelnější i v malém rozlišení.
Export obrázku jako favicon.ico
Po dokončení úprav je čas obrázek exportovat jako ICO soubor, který můžete následně použít jako favicon pro vaši webovou stránku.
- Exportování souboru
- V menu vyberte
Soubor > Exportovat jako....
- Zadejte název souboru s příponou
.ico, například favicon.ico, a klikněte na Exportovat.
- V dialogovém okně
Exportovat jako ICO můžete ponechat výchozí nastavení nebo přizpůsobit dle potřeby. Poté klikněte na Exportovat.
Vložení favicon.ico na webovou stránku
Po vytvoření souboru favicon.ico jej musíte správně vložit do vaší Webové stránky.
-
Umístění favicon.ico
- Umístěte soubor favicon.ico do kořenového adresáře vaší webové stránky.
-
Přidání HTML kódu
- Přidejte následující HTML kód do hlavičky (
<head>) vaší HTML šablony:
<link rel="icon" type="image/x-icon" href="/favicon.ico">
-
Tento krok zajistí, že prohlížeč najde a použije váš favicon.ico soubor.
Vytvoření favicon.ico pro vaši webovou stránku může být rychlé a snadné, pokud použijete GIMP a následujete výše uvedené kroky. Správně navržená favicon nejenže zlepší vizuální identitu vaší stránky v prohlížeči, ale také přispěje k profesionálnějšímu dojmu u uživatelů.
