Favicon Nedir ve Ne İşe Yarar? Siteye Favicon Ekleme İşlemi Nasıl Yapılır?

Sizin için önemli olan şeyleri daha fazla keşfedin

Favicon; web sitelerinin tarayıcılarda ve yer imlerinde görüntülenen küçük simgelerine denmektedir. Favicon kare olarak tercih edilmektedir ve çoğunlukla boyutları 16×16 olmaktadır. Faviconun ilk kullanımı 1999 senesine dayanmaktadır. 1999 yılının mart ayında Internet Explorer’ın yeni sürümü çıktığında, favicon kullanılmaya başlanmıştır. Faviconlar kullanıcıların web sitelerini akıllarında tutabilmelerini ve birden fazla sekme açtıklarında hangi sitede aradıklarını bulabildiklerini daha kolay tespit edebilmelerini sağlamaktadır. Ziyaretçiler siteleri tarayıcıda açtıktan sonra başlıklara bakarak hangi siteyi açtıklarını anlamaya çalışmak yerine, faviconlara bakarak doğrudan siteleri tahmin edebilmektedirler. Uzun bir geçmişe sahip olan favicon, günümüzde oldukça fazla kullanılmaktadır. Eskiden sunucunun ana dizinine favicon dosyasını ekleyerek favicon kullanılmaya başlanabilirken günümüzde kod kullanarak faviconu web tarayıcısına eklemek de mümkün olmaktadır.

Faviconun Tanımı Nedir?

Faviconun anlamına bakıldığında; web sitelerinde başlık kısmında görünen küçük resme verilen isimdir. Sitenin görselliğini artırmanın yanı sıra markalaşmasını da sağlamaktadır. 16 px genişliği ve 16 px uzunluğu bulunan favicon; jpeg, png ya da herhangi bir türde olabilmektedir. Web sitesini temsil eden bir logo ya da markanın baş harfi favicon olarak siteye eklenebilmektedir. Favicon bulunduran siteler elektronik ortamda paylaşıldıklarında, doğrudan bu küçük ikon da çıkmaktadır. Site sahipleri kendileri oluşturabilecekleri gibi hazırlar içerisinden de kullanacakları faviconu tercih edebilmektedirler.

Faviconun Kullanılma Amacı Nedir?

Faviconun işlevine bakıldığında; sitelerin arama motorlarında üst sıralarda olmalarında az da olsa bir etkisi bulunmaktadır. Web sitesini temsil eden bir logo veya görsel tercih edileceği için kullanıcıların bir bakışta siteyi tanımalarını sağlamaktadır. Tarayıcıda çok sayıda sayfa açıldığında, sayfaların bir süre sonra sadece faviconları gözükmektedir ve çok sayıda sayfa içerisinden arananın bulunmasını daha kolay hale getirmektedir. Tarayıcıda boş bir simge olmasındansa faviconun olması, sitenin daha güvenilir ve profesyonel gözükmesini sağlamaktadır. Faviconlar ziyaretçilerin bilinçaltlarına yerleşmektedir ve daha önceden siteden memnun kalan veya diğer sitelerden memnun kalmamış olan ziyaretçilerin web sitesine yönlendirilebilmesinde favicon etkili olmaktadır. Bu yüzden site sahiplerinin mutlaka sitelerine favicon eklemeleri gerekmektedir.

Favicon Oluşturma İşlemi Nasıl Yapılır?

Favicon oluşturmak için site sahipleri kaliteli ve gelişmiş grafik editörlerinden yararlanabilmektedir. Adobe Photoshop gibi programlar kullanarak sitelerine en uygun olacağını düşündükleri faviconu meydana getirebilir ve boyutunu da 16×16 olarak ayarlayabilmektedirler. Oluşturulan çalışmanın png formatı ile kaydedilip sonrasında .ico formatına dönüştürülmesi, çalışmanın kalitesinin düşmemesi açısından önemli olmaktadır. Ancak oluşturulan faviconun .ico formatına dönüştürülebilmesi ve kullanılabilmesi için online çeviri araçlarından birinin kullanılması gerekmektedir.

Web Sitesine Favicon Ekleme Yöntemleri Nelerdir?

Siteye favicon ekleme seçenekleri aşağıdaki gibidir:

  • Tarayıcının faviconu otomatik olarak bulması beklenebilmektedir. Site kodunu değiştirmek gerekmediği için favicon eklemenin en pratik yolu olarak sayılabilmektedir.
  • Eklenmek istenen favicon için site kodunu düzenleyerek tarayıcıya resim dosyası gösterildiğinde favicon eklenmiş olmaktadır.

Faviconu Tarayıcının Otomatik Bulması Nasıl Sağlanır?

Tarayıcının faviconu algılaması, siteye favicon eklemenin en kolay yolu olmakla beraber birçok tarayıcının web dizininde otomatik olarak favicon dosyasını bulabilmesi mümkündür. Tarayıcının otomatik olarak bulması için favicon dosyasını oluşturma ve ekleme aşamaları aşağıda verilmiştir:

  • Favicon olarak kullanılacak olan resmin kare olması daha profesyonel gözükmesi açısından tavsiye edilmektedir. Resmin boyutları ve biçimi buna göre ayarlanmalıdır.
  • Resmin .ico biçimine dönüştürülmesi için online araçlardan biri kullanılmalıdır. Bu araçları açtıktan sonra biçimlendirilecek olan resim seçilmeli ve dönüştürme işlemi başlatılmalıdır.
  • Online araçlar ile resmin otomatik olarak dönüştürülmesi tamamlandıktan sonra indirme seçeneği ile resim bilgisayara indirilmeli ve kaydedilmelidir.
  • Tarayıcının dosya ismini tanıyabilmesi için indirilen dosyanın favicon.ico olarak isimlendirilmesi gerekmektedir.
  • Doğru biçime dönüştürülmüş ve tarayıcının tanıyabileceği şekilde isimlendirilmiş olan dosya, web sitesindeki dosyaların olduğu ana dizine eklenmelidir.
  • Dosyayı ana dizine yüklemek için yapılması gerekenler, web sitesinin barındığı ana makineye göre değişiklik gösterebilmektedir. Dosya yöneticisi ya da FTP istemcisi ile yükleme yapılabilmektedir. Linux tabanlı ana makinelerde ise, public_html dizin olmaktadır.
  • Dosya dizine yüklendiğinde, tarayıcı otomatik olarak dosyayı bulacağı için tarayıcıda gösterilen görüntü de favicon.ico dosyasına eklenen resim olmaktadır. Eğer site sahipleri faviconu görüntüleyemiyorlarsa, tarayıcının önbelleğini temizleyip yeniden başlatarak faviconun gözüküp gözükmediğini kontrol etmelidirler.

Favicon Oluşturucu Olarak Kullanılabilecek Online Araçlar Nelerdir?

Resimleri .ico formatına dönüştürebilecek online araçlar aşağıda örneklendirilmiştir:

  • Favicon Generator: Görüntünün siteye yüklenmesi ile beraber ücretsiz bir şekilde gif, jpeg ve png formatlarından içe aktararak resim .ico formatına dönüştürülebilmektedir. Dönüştürme işlemi tamamlandıktan sonra dosyanın sitenin kök klasörüne eklenmesi yeterli olmaktadır. https://www.favicon-generator.org/ adresi üzerinden dönüştürme işlemi yapılabilmektedir.
  • Favicon.cc: Çevrimiçi favicon oluşturulabilecek ve canlandırılabilecek bir sitedir. Jpg, jpeg, gif, png, bmp, ico ve cur formatlarını desteklemektedir. https://www.favicon.cc/ üzerinden dönüştürme işlemi yapılabilmektedir.
  • Dynamic Drive-Favicon Generator: Kullanımı kolay ve ücretsiz bir favicon oluşturucusu olduğu için sıklıkla tercih edilmektedir. Gif, jpg, png ve bmp formatındaki görüntülerin .ico formatına dönüştürülebilmesine imkan tanımaktadır. 16×16’nın yanı sıra 32×32 ve 48×48 boyut seçenekleri de sunmaktadır. http://tools.dynamicdrive.com/favicon/ adresinden dönüştürme yapılabilmektedir.
  • Genfavicon: 3 adımda dönüştürme işleminin tamamlanabildiği bir online araçtır. Jpg, gif ve png formatındaki resimleri dönüştürebilen Genfavicon aynı zamanda faviconun boyutunu ayarlama seçeneği de sunmaktadır. 16×16, 32×32, 48×48, 128×128 boyutları tercih edilebilmektedir. Oluşturulan faviconun önceden görülebilmesi için yakala ve önizle özelliği de bulunmaktadır. https://genfavicon.com/ linkinden dönüştürme yapılabilmektedir.
  • Convertico: Ana dizine .ico uzantılı favicon dosyasının eklenebilmesi için görseli .ico uzantılı hale çeviren bir uygulamadır. Hızlı ve problemsiz çalışan bir online araç olduğu için sıklıkla en fazla tercih edilen favicon oluşturucudur. Görseli yükledikten sonra otomatik olarak favicon dosyasına dönüştürülmektedir ve dönüştürülen dosya bilgisayara indirildikten sonra siteye yüklenebilmektedir. https://convertico.com/ adresinden favicon dosyası oluşturulabilmektedir.

Site Kodunu Düzenleyerek Siteye Favicon Ekleme İşlemi Nasıl Yapılır?

Site kodunu düzenleyerek tarayıcıya resim dosyasını göstermek, favicon olarak ekleyeceği resmi başka bir formata dönüştürmekte zorlananlar için alternatif bir seçenektir. Bunun için izlenmesi gereken adımlar şu şekildedir:

  • Resim formatının jpg, bmp, gif, png gibi formatlarda ve kare boyutlu bir görüntüde olması gerekmektedir. Normal tarayıcıda sitenin daha iyi gözükebilmesi için görüntünün kare boyutlu olması gerekmektedir.
  • Web sitesinin bulunduğu ana dizine, hazırlanmış olan resim dosyası yüklenmelidir. Web site sahibi hosting sağlayıcısına danışarak ana dizininin ne olduğunu öğrenebilmekte ve ana dizine ekleme işlemi yapabilmektedir. Linux tabanlı ana makinelerde çoğunlukla public_html olmaktadır.
  • Web sitesinin kodunda favicon olarak kullanılacak olan görüntünün belirtilmesi gerekmektedir. Kod eklendikten sonra resim favicon olarak gözükmeye başlamaktadır.

Favicon Eklemek İçin Web Sitesine Eklenmesi Gereken Kod Nedir?

Site koduna favicon eklemek için <head> ve </head> etiketleri arasına <link rel=”shortcut icon” type=”image/png” href=”/favicon.png”/> kodunun yazılması gerekmektedir. Burada type=”image/png” kısmındaki png’nin favicon olarak kullanılacak resmin uzantısı ile değiştirilmesi gerekmektedir. Ayrıca koddaki favicon.png bölümü de favicon olarak eklenecek olan dosyanın ismi ile değiştirilmelidir. Kod bu şekilde eklendikten sonra eğer favicon gözükmez ise; tarayıcının önbelleği temizlendikten ve yeniden başlatıldıktan sonra gözüküp gözükmediğine bakılmalıdır.