Favicon Nedir?
Güncelleme notu: Favicon anlatımı sadeleştirildi; kanıtsız SEO etkileri çıkarıldı, ekleme ve doğrulama adımları kaynaklandırıldı.
Öne Çıkanlar
Favicon, tarayıcı sekmesinde, yer imlerinde ve arama sonuçlarında sitenizin yanında görünen küçük simgedir. Bu yazıda faviconun ne işe yaradığını, doğru boyutlarını ve siteye nasıl ekleneceğini adım adım anlatıyoruz.
Favicon, tarayıcı sekmesinde ve yer imlerinde sitenizi temsil eden küçük simgedir. Arama sonuçlarında da gösterilebilir. Birden fazla sekme açıkken sitenin tanınmasına yardımcı olur; logo ne kadar küçük gösterilirse gösterilsin ayırt edilebilir kalmalıdır.
Favicon ne işe yarar?
Kullanıcının doğru sekmeyi bulmasını ve kaydettiği sayfayı tanımasını kolaylaştırır. Bu faydadan hareketle sitede kalma süresinin veya sıralamanın mutlaka artacağı sonucu çıkarılamaz. Faviconu, sitenin görsel kimliğinin küçük fakat işlevsel bir parçası olarak değerlendirin.
Hangi boyut ve biçimi kullanmalısınız?
Kare, sade ve küçük ölçekte okunabilen bir simge hazırlayın. Tarayıcıların küçük sekme görünümünü ve açık/koyu arka planı birlikte test edin. Çok ince çizgiler veya uzun marka metni küçültüldüğünde kaybolabilir. PNG, ICO veya SVG seçiminde sitenizin altyapısını ve hedef tarayıcıları dikkate alın.
Google arama görünümü için simge kare ve en az 8 × 8 piksel olmalıdır; Google 48 × 48 pikselden daha büyük dosya önerir. Örneğin 96 × 96 piksel bir PNG hazırlayıp küçük görünümünü test edebilirsiniz. Google'ın desteklediği biçimlerden PNG veya ICO kullanın; tarayıcıda kullanılan SVG için arama uyumluluğunu ayrıca kontrol edin. Dosya ve ana sayfa taranabilir olmalıdır. Google'ın favicon gereklilikleri Tarayıcıda görünmesi, Google'da hemen gösterileceği anlamına gelmez.
Siteye nasıl eklenir?
CMS veya tema ayarlarında site simgesi alanı varsa onu kullanın. Özel HTML kurulumunda ana sayfanın head bölümündeki link etiketi, favicon dosyasını göstermelidir. Örneğin kendi sitenizde bulunan bir PNG için şu etiket kullanılabilir:
<link rel="icon" href="/favicon.png" type="image/png" />
Bu kodda dosya yolu örnektir; gerçekten yayımladığınız dosyanın adresini yazın. Etiketi sayfanın görünür metnine yapıştırmayın. Framework otomatik simge etiketi üretiyorsa ikinci, çelişen bir etiket eklemeden önce mevcut çıktıyı inceleyin. MDN link öğesi belgesi
Görünmüyorsa neyi kontrol etmelisiniz?
Önce simge URL'sini doğrudan açın: dosya erişilebilir mi, beklenen görsel mi geliyor? Sonra ana sayfanın HTML çıktısında doğru yolu gösteren etiketi kontrol edin. Dosyanın sunucuda bulunması, sayfanın o dosyayı kullandığını tek başına göstermez.
Tarayıcı eski simgeyi önbellekte tutabilir. Farklı bir tarayıcı veya temiz bir oturumla yeniden deneyin. Açık ve koyu temada simgenin seçilebildiğine bakın; masaüstünde iyi görünen ince ayrıntılar küçük sekmede kaybolabilir.
Arama sonucunda görünmüyorsa Google'ın dosyaya ve ana sayfaya erişimini kontrol edin. Yeniden tarama ve arama görünümünün güncellenmesi zaman alabilir; dosyayı arka arkaya değiştirerek sonucu hızlandıracağınızı varsaymayın. Tarama ve HTML işaretlemelerini birlikte incelemek için teknik SEO hizmeti kapsamına bakabilirsiniz.