Favicon web sitelerinin küçültülmüş logosu anlamına gelir. İnternet kullanıcılarının aklında kalmak isteyen web siteleri mutlaka bir favicona sahip olmalıdır. Bu sayede kullanıcıların ilgili web sitesinin logosunu herhangi bir yerde gördükleri takdirde hangi web sitesi olduğunu anlamaları sağlanabilmektedir.
Çoğunlukla 16×16 boyutlarında bazen simge bazen harf şeklinde tasarlanan favicon web sayfasının başlığının ve sayfada bulunan URL kısmının hemen önünde görülür. Web sitesinin tanınırlığı için tasarlanan bu sembol web sitesi açısından bir görüntü zenginliği elde edilmesini de sağlar.
Favicon Hangi Boyutta Olmalıdır?
Favicon için ideal boyut 16×16 piksel olmakla birlikte bu oranın katlarının kullanılması da mümkündür. Bununla birlikte boyutların kare şeklinde olmasına özen gösterilmelidir.
Web sitesinin küçük boyutlardaki logosu olma özelliğini taşıyan favicon web siteleri için adeta bir imza niteliğindedir. Web sitesinin tanınırlığını artıran favicon özellikle mobil kullanıcılar açısından oldukça etkilidir. Kullanıcılar herhangi bir web sitesini favorilerine ya da mobil cihazlarının ana dizinindeki siteye eklediğinden sitenin iconu ana görsel olarak ayarlanır. Bu aşamada oldukça iyi tasarlanmış bir faviconun olması web siteleri açısından büyük avantajdır. Önemli olan bir diğer nokta ise ilgili iconun kullanıcıya hitap edecek ve web sitesi ile bağ kuracak şekilde kullanımasıdır.
Web sitelerinin görsel kimliği olan favicon, Favorites Icon’ın kısaltmasıdır. Favicon, web sitesinin logosu ile aynı olabilmekle birlikte logı ile karıştırılmamalıdır. Favicon daha küçük boyutlu olmalıdır. Günümüzde kullanılan tarayıcıların tümü Favicon desteği sağlamaktadır.
Web Sitelerine Favicon Ekleme Yöntemleri
Web sitelerine favicon iki farklı yöntemle eklenebilir. Bunlardan ilki tarayıcının faviconu otomatik olarak bulmasını beklemektir. Bu yöntemde site kodunun değiştirilmesi gerekmediğinden favicon eklemenin en pratik yolu olarak kabul edilmektedir. İkinci yöntemde ise eklenmek istenilen favicon için site kodu düzenlenir. Tarayıcıya resim dosyasının gösterilmesi ile birlikte favicon eklenmiş olur.
Favicon Nasıl Kullanılmalıdır?
Web sitelerine Favicon eklemek için öncelikle 16×16 ya da katlarındaki bir görselin png formatıyla kaydedilmesi ve bu görselin daha sonra .ico formatına dönüştürülmesi gerekir. Bu aşamada gelişmiş grafik editörlerinden faydalanmak mümkündür. Çünkü dönüştürme işlemi sırasında görselin kalitesi düşmemelidir.
Daha sonra, oluşturulmuş olan görsel site sunucusuna ya da herhangi bir dış adrese yüklenir. Bunun için web sitesine ftp ile bağlanılır, ana dizine .ico resmi atılır ve web sitesinin index kısmında yer alan <head> </head> etiketlerinin arasına <link rel= “shortcut icon” href=” /favicon.ico” type=” image/x-icon” /> yazılır.
Oluşturulan bu kod içerisinde bulunan “href” kısmının görevi favicon.ico sembolünün yerini belirlemektir. Bu adımlar tamamlandıktan sonra görsel internet sitesine aktarılır ve sayfa yenilenir ya da yeniden güncellenir. Hazırlanılan görselin görünmediği durumlarda yapılan işlem kontrol edilmelidir. Bunun için tarayıcı geçmişinin tamamen silinmesi, daha sonra tarayıcı yeniden başlatılıp faviconun görünüp görünmediğinin kontrol edilmesi gerekir.
Web siteleri faviconlarını tasarlarken kurumsal renkleri ile uyum sağlayacak bir stil ikonu oluşturulmasına özen göstermelidirler. Bunun nedeni web sitesini hatırlatacak olan bu simgenin kurumsal kimliği ve amacı da yansıtması gerekliliğidir.
Tarayıcının Favicon’u Otomatik Olarak Bulması Nasıl Sağlanır?
Web sitesine favicon eklemenin en kolay yolu hiç tartışmasız, tarayıcının faviconu algılamasıdır. Bununla birlikte birçok tarayıcı web dizininde otomatik olarak favicon dosyasını bulabilmektedir. Tarayıcının otomatik olarak bulacağı şekilde favicon dosyasının oluşturulması ve eklenmesi aşamaları şu şekildedir:
- Favicon olarak kullanılacak resmin kare bir görünüme sahip olması daha profesyonel bir izlenim yarattığından dolayı resmin boyutlarının ve biçiminin buna göre ayarlanmasına özen gösterilmelidir.
- Resmi .ico formatına dönüştürebilmek için online araçların kullanılması tercih edilmelidir. Kullanılacak olan açıldıktan sonra biçimlendirilecek olan resim seçilmeli ve dönüştürme işlemi gerçekleştirilmelidir.
- Online araçlar kullanılarak resmin otomatik dönüştürülmesi işlemi tamamlandıktan sonra resim bilgisayara indirilerek kaydedilmelidir.
- Tarayıcının dosya ismini tanıması için indirilen dosya favicon.ico olarak isimlendirilmelidir.
- Doğru biçime dönüştürülen ve tarayıcının tanıyabileceği şekilde isimlendirilen dosyanın bu aşamada, web sitesindeki dosyaların yer almakta olduğu ana dizine eklenmesi işlemi tamamlanmalıdır.
- Dosyanın ana dizine eklenebilmesi için yapılması gereken işlemler, web sitesinin barındırıldığı ana makineye göre farklılık gösterebilir. Linux ana tabanlı makinelerde public_html dizin bulunurken dosya yöneticisi ya da FTP istemcisi ile yükleme yapma imkanı da bulunmaktadır.
- Dosyanın ana dizine yüklenmesinin ardından, tarayıcı dosyayı otomatik olarak bulacağından dolayı gösterilen görüntü favicon.ico dosyasına eklenen resim olur. Site sahiplerinin faviconu görüntüleyemediği durumlarda tarayıcının önbelleğinin temizlenmesi, yeniden başlatılması ve faviconun görünüp görünmediğinin kontrol edilmesi gerekir.
Favicon Oluşturucu Olarak Kullanılabilecek Online Araçlar
Favicon olarak kullanılacak olan resimlerin .ico formatına dönüştürülmesi için kullanılabilecek online araçlardan bazıları şu şekildedir.
Favicon Generator: Bu online araç görüntü siteye yüklendiğinde ücretsiz bir şekilde gif, jpeg ya da png formatlarından içe aktarır ve resmi .ico formatına dönüştürür. Dönüştürme işleminin tamamlanmasının ardından dosya sitenin kök klasörüne eklenebilir.
favicon.cc: Favicon oluşturmak ve canlandırmak için kullanılabilecek çevrim içi web sitelerinden biridir. Jpg, jpeg, png, gif, cur, bmp ve ico formatlarını destekler.
Dynamic Drive-Favicon Generator: Ücretsiz ve kullanımı kolay olan bu favicon oluşturucu araç oldukça sık bir şekilde tercih edilmektedir. Gif, png, jpg ve bmp formatındaki görüntülerin .ico formatına dönüştürülmesini sağlar. 16×16, 32×32 ve 48×48 boyut seçenekleri vardır.
Genfavicon: Bu online araçta dönüştürme işlemi 3 adımda tamamlanabilir. Jpg, png ve gif formatındaki resimleri dönüştürmesinin yanı sıra faviconun boyutunu ayarlama imkanı da verir. 16×16, 32×32, 48×48, 128×128 boyutları tercih edilebileceği gibi faviconun önden görülebilmesi için yakala ve önizle özelliğine de sahiptir.
Convertico: Convertico favicon dosyasının ana dizine eklenebilmesi için görselin .ico uzantılı hale çevrilmesini sağlayan bir online uygulamadır. Sıklıkla tercih edilmesinin nedeni hızlı ve sorunsuz çalışmasıdır. Görsel yüklendikten sonra otomatik olarak favicon dosyasına dönüştürülür. Dönüştürülen dosyanın siteye yüklenmesi için öncelikle bilgisayara indirilmesi gerekir.
Favicon Kullanmanın Sağladığı Avantajlar
Favicon kullanmak marka bilinirliği oluşturma açısından son derece önemlidir. Bunun yanı sıra kullanıcılara güven veren bir unsurdur. Kullanıcılar favicon olmayan web sitelerinde boş bir site sekmesi görünümüyle karşılaşırlar. Bu durum sitenin güvenli olmadığı izlenimine neden olabilir.
Favicon kullanan siteler daha profesyonel bir görünme sahiptir. Özellikle online sitelerin güvenle kullanılması konusunda ziyaretçilerin müşteriye dönüşmesini sağlayacak en ufak ayrıntının dahi gözden kaçırılmamasına özen gösterilmelidir.
Kullanıcılar bazı siteleri yeniden ziyaret etmek için yer imlerine eklerler. Yer imlerinden yeniden ziyaret etmek istediklerinde faviconları olan web sitelerini kolayca tanırlar. Bu nedenle favicon kullanmanın web sitelerinin kullanıcılar tarafından yeniden ziyaret edilmesinde önemli rol oynayan unsurlardan biri olduğu kabul edilir.
Favicon kullanan web siteleri kullanıcılar tarafından web sitesi yer imlerinden, tarayıcıdan ya da geçmişten çok daha hızlı bir şekilde bulunabilir. Kullanıcı deneyiminin günümüzde ne kadar önemli olduğu düşünüldüğünde web sitelerinin kullanıcı deneyimini artırmak için favicondan yararlanmasının adeta bir zorunluluk olduğu kolayca söylenebilir.
Favicon SEO İçin Önemli midir?
Birçok web sitesi sahibi favicon nedir sorusuna yanıt ararken doğrudan sıralama faktörlerine odaklanır. Teknik olarak favicon, doğrudan bir Google sıralama sinyali olmasa da kullanıcı deneyimi üzerinde büyük bir etkisi bulunur. Arama sonuç sayfalarında sitenizin yanında görünen küçük ikon, kullanıcıların sitenizi diğer sonuçlardan ayırt etmesini sağlar.
Yüksek tıklama oranları (CTR) yakalamak için görsel kimlik kritik bir rol oynar. Markanızın logosunu içeren özgün bir ikon, arama motoru sonuç sayfalarında (SERP) profesyonel bir duruş sergilemenize yardımcı olur. Kullanıcılar tanıdık bir görsel gördüklerinde sitenize tıklama eğilimi gösterirler. Bu durum dolaylı yoldan SEO performansınızı yukarı taşır.
Favicon Dosya Formatları Nelerdir?
Web projelerinde ikon kullanımı için farklı dosya türleri mevcuttur. Geleneksel olarak .ico formatı en yaygın kullanılan standarttır. Bu format, farklı boyutlardaki ikonları tek bir dosya içinde barındırma yeteneği sayesinde tarayıcıların işini kolaylaştırır.
Modern web standartlarıyla birlikte .png ve .svg formatları da oldukça popüler hale geldi. Özellikle yüksek çözünürlüklü ekranlarda netlik sağlamak adına SVG formatı büyük avantaj sunar. Hangi formatı seçeceğiniz, sitenizin hedeflediği tarayıcı uyumluluğuna bağlıdır.
PNG ve ICO Arasındaki Farklar
PNG formatı, şeffaflık desteği ve yüksek renk derinliği sayesinde görsel kalitesi açısından öne çıkar. Modern tarayıcıların neredeyse tamamı PNG dosyalarını sorunsuz bir şekilde işleyebilir. Ancak PNG dosyaları bazen tek bir boyuta odaklandığı için çok küçük ekranlarda bulanıklaşabilir.
ICO formatı ise içinde birduğu çoklu boyutları barındıran özel bir kapsayıcıdır. Bu dosya türü, ikonun 16×16, 32×32 veya 48×48 gibi farklı ölçeklerde aynı anda sunulmasını sağlar. Web sitenizin her türlü cihazda keskin görünmesi için ICO kullanımı hala güvenli bir limandır.
WordPress Sitelerde Favicon Nasıl Değiştirilir?
WordPress altyapısını kullanan kullanıcılar için bu işlem oldukça basittir. Herhangi bir kodlama bilgisine ihtiyaç duymadan, WordPress Özelleştir paneli üzerinden işlemi tamamlayabilirsiniz. Panel içerisinde “Site Kimliği” sekmesini bulmanız yeterlidir.
Site Kimliği bölümüne girdiğinizde “Site İkonu” seçeneğini göreceksiniz. Buraya tıklayarak bilgisayarınızdaki uygun boyutlu görseli yükleyebilirsiniz. WordPress, yüklediğiniz görseli otomatik olarak uygun boyutlara kırparak sitenize entegre eder. Değişiklikleri yaptıktan sonra ayarları kaydetmeyi unutmayın.
Favicon Tasarlarken Dikkat Edilmesi Gereken İpuçları
Küçük bir alanda büyük bir mesaj vermeniz gerektiği için tasarımın sadeliği esastır. Çok karmaşık logolar, favicon boyutuna küçüldüğünde anlaşılmaz bir lekeye dönüşebilir. Temiz hatlar ve belirgin renkler kullanmaya özen gösterin.
Yüksek kontrastlı renk paletleri tercih etmek, ikonun tarayıcı sekmelerinde fark edilmesini sağlar. Ayrıca tasarımın kare bir formata uygun olduğundan emin olun. logonuzun en önemli kısmını merkeze yerleştirerek kenarlardan kırpılma riskini minimize edebilirsiniz.
