Favicon Nedir? Nasıl Oluşturulur?

Favicon, kısaca tanımlamak gerekirse internet sitelerinin logosudur. İnternet tarayıcılarının adres çubuklarında ve sık kullanılanlar listesinde site isminin yanında yer almaktadır. Genellikle 16x16 piksel boyutlarında kullanılmaktadır. GIMP programı favicon oluşturmak için size yardımcı olacaktır:
1) Bir resim seçiniz veya web siteniz için bir logo hazırlayınız ve seçtiğiniz fotoğrafı GIMP programı ile açınız.
2) Favicon oluşturmak için önce seçtiğiniz fotoğrafı 16x16 piksel boyutlarına ayarlamalısınız.
3) Daha sonra menüde File(Dosya) seçeneği içerisinde bulunan Export As (dışarıya aktar) seçeneği ile resmi önce png formatı ile kaydediniz.
4) Dışarıya aktarma işlemini bu kez ico formatına çevirerek yapınız.
5) Oluşturduğunuz resimlerin adını favicon.png ve favicon.ico olarak değiştiriniz.
5) Sayfanızın html kodunun <head></head> tagları arasına aşağıda verdiğimiz kodu ekleyiniz:
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<link rel="icon" href="favicon.png" type="image/x-icon" />
6) Oluşturduğunuz resimleri sunucunuza yerleştiriniz; doğru dizine yerleştirdiğinize emin olunuz. (Yukarıdaki kodlara göre html dosyanız ile resimler aynı dizinde olmalıdır. Birçok tarayıcı, web sitenizin kök dizininde öntanımlı olarak favicon.ico dosyasını arar ve favicon imajının kök dizinde olmasını kabul eder.)
Not: Sadece ilk kodu kullanmak işinizi görecektir. (favicon.ico için yazılan kodu)
Dilerseniz gif formatında animasyonlu faviconlar da ekleyebilirsiniz. Pek çok tarayıcı gif formatındaki faviconu desteklese de animasyonu oynatmıyor. Firefox 42.0 sürümünde ise animasyonumuz oynuyordu. Animasyon oynatmayan tarayıcılar için yazılmış javascript kodlarını Github ve benzeri sitelerden bulabilirsiniz. Gif animasyonları için:
<link rel="shortcut icon" href="favicon.gif" type="image/gif" />
Animasyon destekli GIF formatının MNG gibi bazı alternatifleri mevcuttur, fakat favicon olarak kullanım için yeterince yaygın değiller.

Ayrıca belirtilen koda uygun olacak şekilde çok katmanlı resimler oluşturularak bazı modern tarayıcılarda kullanılabilir:
<link rel="icon" sizes="16x16 32x32 48x48 64x64" type="image/svg+xml" href="favicon.svg"/>
Normal bir resimden nasıl favicon yapıldığını 2 dakikalık videomuzda görmek isterseniz tıklayabilirsiniz: https://www.youtube.com/watch?v=l7i_WLfEpXk


Yukarıdaki işlemler Linux Mint 17 işletim sistemi üzerinde GIMP 2.8.10 sürümü ile yapılmıştır.
Yazı Tarihi: 21 Şubat 2016




ANA SAYFA GNU/LINUX Gimp