Crearea unui favicon pentru pagina web

[sightlessGraphic Designer]

Crearea unui favicon pentru pagina web

Favicon provine de la Favorites Icon.
Este un mic icon asociat unei pagini HTML, sau unui site întreg, care este afişat în Address Bar înaintea adresei vizitate, fiind utilizat pentru particularizarea afişării unui site sau pentru promovarea unui logo de firmă.

Favicon este de fapt un fişier de tip icon cu anumite caracteristici:
1. denumirea trebuie să fie favicon.ico
2. dimensiuni acceptate sunt 32x32 sau 16x16 pixeli
3. 265 culori maxim.

Înainte de a adăuga un favicon paginilor asiguraţi-vă că sunt acceptate pe server astfel de fişiere.

Pentru adăugarea unui favicon sunt necesare două operaţii.
1. se inserează următoarea linie în pagina HTML în zona head:

Cod:

<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">

2. se încarcă (upload) pe server în acelaşi folder cu pagina asociată.

De obicei favicon-ul se încarcă în rădăcina domeniului (nu în alte foldere ale site-ului).
Dacă dorim utilizarea câte unui favicon pentru fiecare subdomeniu în parte vom adapta eticheta de mai sus particularizand calea către fişierul favicon asociat. (Recomand să specificaţi toata calea către fişier, nu calea relativă)

Acest fişier este afişat de browserele: Mozilla, Firefox, Opera dar nu şi de Internet Explorer.
Pentru realizarea unui favicon se poate folosi un program de grafică specializat, de exemplu Adobe Photoshop la care trebuie adăugat un plug-in care permite salvarea în format .ico, sau online la:
FavIcon from Pics
FavIcon Generator

De la una din adresele de mai sus puteţi transforma un fişier imagine (gif, jpg, bmp, png) aflat pe calculatorul Dvs. în favicon:
1. selectaţi imaginea care doriţi să o transformaţi în Favicon folosind butonul Browse
2. apăsaţi butonul Generate Favicon.ico sau Create Icon
3. În câteva momente sunteţi anuntaţi că puteţi descărca fişierul icon apăsând butonul Download Favicon.

Puteţi verifica online fişierul favicon şi modul cum a fost inserat în pagină la adresa:
Favicon Validator

Vă mai recomand şi programul IrfanView cu plugin-urile aferente (este gratuit) cu care de asemenea puteţi salva orice poză în fişier icon.

Favicon animat
Puteţi asocia unei pagini şi varianta de favicon animat cu menţiunea că în acest caz linia inserata în codul HTML în zona head va fi:

Cod:

<link rel="icon" href="favicon.gif" type="image/gif">

Un astfel de favicon se poate obţine online la FavIcon from Pics, prin transformarea dintr-un fişier imagine în gif animat. Acest tip de icon nu este însă compatibil cu majoritatea browserelor, de aceea recomand doar icon static.

sursa