Anasayfa » ASP.NET

Favicon oluşturma

 26.01.2011  7.955   1   Paylaş

Bazı web sayfalarının adreslerinin hemen başında özel ikonların bulunduğunu mutlaka fark etmişsinizdir. Siz de kendi sayfanız için bunlardan bir tane hazırlayabilirsiniz.

Favicon nasıl oluşturulur?

Bazı web sayfalarının adreslerinin hemen başında özel ikonların bulunduğunu mutlaka fark etmişsinizdir. Siz de sayfanız için bunlardan bir tane hazırlayabilirsiniz. Bunun için sadece bir fotoğraf düzenleme programı ve biraz yaratıcılığa ihtiyacınız var. Hatta işin yaratıcılık kısmı ile ilgilenmiyorsanız web üzerinde hazır bir çok ikona ulaşabilir ve onlardan beğendiklerinizi de kullanabilirsiniz.

Favicon dosyasının özellikleri

Favicon terimi İngilizce ?Favorites Icon?dan kısaltılmıştır. Bu favicon dosyası siteniz ziyaret edildiğinde adres satırında belireceği gibi adresiniz sık kullanılanlara eklendiğinde de sitenizin adınının baş kısmında görünecektir. Favicon dosyası 16×16 piksel boyutlarında .ico uzantılı bir grafik dosyasıdır. Modern web tarayıcıları artık .gif ve .png uzantılı dosyaları da favicon olarak gösterebilmektedirler.

Nasıl oluşturulur?

Hazırlama işlemini yaygın kullanıma sahip Photoshop kullanarak anlatacağım. Eğer sizde Photoshop kullanacaksanız ve dosyanızı .ico uzantısı ile kaydedecekseniz gerekli plug-in?i aşağıdaki adresten indirmelisiniz;

http://www.telegraphics.com.au/sw/

Favicon dosyanızı .ico dışındaki formatlarda hazırlayacaksanız bu plug-in?e ihtiyacınız olmayacak.

Favicon?un yerleştirilmesi

Oluşturduğunuz (veya internetten bulduğunuz) favicon dosyasını sunucunuzun kök dizinine gönderin. Eğer kendi sunucunuz yoksa, diğer bir ifade ile siteniz ücretsiz bir sunucu üzerinde ise, yine ücretsiz olan grafik sunucularından faydalanabilirsiniz (örneğin; imageshack.us). Ama bu durumda favicon dosyanızı .png veya .gif olarak kaydetmeniz gerekecektir, çünkü ücretsiz resim sunucularının çoğu .ico desteği vermiyor.

Favicon dosyanızı bir suncuya göderdikten sonra adresini alın ve aşağıdaki gibi bir kod oluşturun. Favicon dosyanızı kendi sunucunuza gönderdiyseniz kodunuz şu şekilde olacaktır;

<link rel="shortcut icon" href="/favicon.ico" />

Eğer ücretsiz bir sunucu kullandıysanız (örnekte imageshack.us kullanılmış) kodunuz şu şekilde olmalıdır;

<link rel="shortcut icon" href="http://img381.imageshack.us/img381/2363/favicon0nx.png" />

Son işlem olarak oluşturduğunuz bu kodu kopyalayın ve tasarım şablonunuzun HTML kodu içerisinde <HEAD> etiketinin altına yapıştırın ve kaydedin. Şablonunuzu güncelledikten sonra favicon?unuz adresinizle birlikte görünmeye başlayacaktır.

Favicon oluşturabileceğiniz siteler

Kolay gelsin.

Kaynaklar;

#favicon