Favicon nedir, hangi boyutlar gerekir?
Sekmedeki küçük simgenin nereye çıktığı ve hangi ölçüde gerektiği
Tarayıcınızda on sekme açıkken hangisinin hangi site olduğunu nereden anlarsınız? Başlıklar o kadar daralmıştır ki tek görünen şey soldaki minik kare simgedir. İşte o simgenin adı favicon'dur ve sitenizin en küçük ama en çok görülen parçasıdır.
Yeni bir site kuran hemen herkes bu simgeyi en sona bırakır, sonra da sekmede boş bir kâğıt ikonu görünce ne yapacağını bilemez. Bu yazı iki soruyu birden kapatıyor: bu dosya tam olarak nedir ve elinizdeki logodan doğru ölçülerde nasıl üretilir.
Aynı simge, dört ayrı yerde
Favicon yalnızca sekmede kullanılmaz. Aynı simge tarayıcının farklı yerlerinde farklı ölçülerde karşınıza çıkar ve her yerin kendi alanı vardır.
Sekmede simge en küçük hâliyle durur; burada okunması gereken şey ayrıntı değil, siluettir. Yer imlerine eklediğinizde biraz daha büyük görünür ve adın yanında yer alır. Kullanıcı siteyi telefonunun ana ekranına eklerse simge bir uygulama ikonu gibi, epeyce büyük gösterilir. Dördüncü ve çoğu kişinin atladığı yer arama sonuçlarıdır: mobil arama sonuçlarında site adının yanında sizin simgeniz görünür.
Bu dört yerin ölçüleri birbirinden farklıdır ve işte bu yüzden favicon tek bir görsel değil, aynı simgenin birkaç ölçüsünden oluşan bir set olarak düşünülür.
Hangi ölçüler gerekli?
Uygulamada işi gören çekirdek set 16, 32 ve 48 noktalık karelerdir. Sekme 16'yı, yer imi ve adres çubuğu tarafı 32'yi, masaüstü kısayolları 48'i kullanır. Kullanıcıların siteyi masaüstüne sabitlemesini bekliyorsanız 64'lük bir sürüm de eklenebilir.
Arama sonuçlarındaki simge ayrı bir kural taşır. Google, arama sonuçlarında gösterdiği site simgesinin en az 48 nokta kenarında olmasını ve 48'in katı bir kare ölçüde hazırlanmasını ister; daha küçük bir dosya sunuyorsanız simgeniz sonuçlarda hiç görünmeyebilir. Yani yalnızca 16 ve 32 içeren eski usul bir dosya, sekmede işinizi görür ama aramada sizi görünmez bırakır.
Telefonun ana ekranına eklenen kısayollar için ayrıca daha büyük, tek başına duran bir PNG kullanılır; bu, sekmedeki simgeden bağımsız bir dosyadır ve genellikle 180 nokta civarında hazırlanır.
| Nerede görünür | Gereken kenar | Nereden gelir |
|---|---|---|
| Tarayıcı sekmesi | 16 nokta | Simge dosyasının içindeki en küçük sürüm |
| Yer imi ve adres çubuğu | 32 nokta | Aynı dosyanın orta sürümü |
| Masaüstü kısayolu | 48 nokta | Aynı dosyanın büyük sürümü |
| Arama sonucu | En az 48 nokta, 48'in katı kare | Ayrı bir PNG ya da yeterince büyük simge dosyası |
| Telefon ana ekranı | 180 nokta civarı | Ayrı bir PNG dosyası |
Google'ın arama sonucundaki site simgesi için yayımladığı gereksinimler →
Neden hepsi tek dosyada toplanır?
Bir simge dosyasının içinde aynı görselin birden çok ölçüsü birlikte durabilir; tarayıcı hangi ölçüye ihtiyacı varsa onu dosyanın içinden kendisi seçer. Bu, her ölçü için ayrı dosya koyup sayfaya ayrı satır yazmaktan hem kısa hem sağlamdır.
İkinci sebep alışkanlıktır. Web'in en eski geleneklerinden biri, tarayıcının sitenin kök adresinde "favicon.ico" adlı bir dosyayı kendiliğinden yoklamasıdır. Siz sayfaya hiçbir şey yazmasanız bile bu istek gider; dosya yoksa sunucu kayıtlarınız "bulunamadı" hatalarıyla dolar.
Bu yüzden en sağlam kurulum ikisini birlikte yapmaktır: kökte çok ölçülü bir simge dosyası, yanında arama sonucu ve telefon için yeterince büyük birer PNG.
Küçük ölçüde okunan simge nasıl tasarlanır?
Favicon tasarımının tek zor yanı ölçektir. Sekmedeki kare, bu satırdaki bir harften pek büyük değildir; logonuzun tamamı oraya sığmaz.
Yapılacak şey logoyu küçültmek değil, sadeleştirmektir. Şirket adının baş harfi, amblemin tek bir parçası ya da logonun en tanınabilir şekli tek başına alınır. İnce çizgiler kalınlaştırılır, ayrıntılar atılır, iki-üç renkle yetinilir. Bir logo tipografisiyle birlikte küçültüldüğünde okunmaz bir leke olur; aynı logonun yalnız amblemi gayet net durur.
Kontrol etmenin pratik yolu şudur: hazırladığınız kareyi ekranınızda tırnağınızın yarısı kadar bir alana küçültüp bakın. O ölçekte neyi gördüğünüzü ayırt edemiyorsanız kullanıcı da edemeyecektir.
- Tek harf ya da tek amblem kullanın, tam logoyu değil
- İnce çizgi ve gölge kullanmayın, küçülünce kaybolur
- Zemini saydam bırakın; koyu temalarda beyaz kutu görünmesin
- Kareye tam oturtun, kenarlarda gereksiz boşluk bırakmayın
- Rakip sitelerinkine benzeyen bir simge seçmeyin
Elinizdeki logodan simge dosyası üretmek
Uygulama sırası basittir. Önce logonuzun mümkün olan en büyük ve kare hâlini hazırlayın; zemini saydam bir PNG en iyisidir. Vektör bir dosyanız varsa ondan yeterince geniş bir kare PNG üretmek en temiz başlangıçtır, çünkü küçültmek her zaman güvenlidir, büyütmek değildir.
Sonra bu PNG'yi Favicon Oluşturma aracına verin; araç istediğiniz ölçüleri tek bir simge dosyasında toplar. Çıkan dosyayı sitenizin kök klasörüne koyduğunuzda çoğu tarayıcı onu kendiliğinden bulur.
Elinizde tersi bir durum da olabilir: bir simge dosyanız var ama içindeki görseli düz bir PNG olarak kullanmanız gerekiyor. ICO'dan PNG'ye aracı dosyanın içindeki sürümleri ayırıp size verir; sunuma, belgeye ya da bir tasarım dosyasına koymak için bu yolu kullanabilirsiniz.
Son bir uyarı: simgeyi değiştirdikten sonra sekmede eskisini görmeye devam edebilirsiniz. Tarayıcılar bu dosyayı uzun süre kendi belleğinde tutar. Yeni hâlini görmek için sekmeyi kapatıp açın; olmazsa adres çubuğuna sitenizin adresinden sonra favicon.ico yazıp doğrudan dosyayı açın ve sayfayı yenileyin.
Sık sorulanlar
Favicon boyutu kaç piksel olmalı?
Çekirdek set 16, 32 ve 48 noktadır; sekme, yer imi ve masaüstü kısayolu bunları kullanır. Arama sonuçlarında görünmek istiyorsanız en az 48 nokta kenarında ve 48'in katı kare bir sürüm bulundurun.
Favicon nasıl oluşturulur?
Logonuzun kare ve saydam zeminli bir PNG hâlini hazırlayıp Favicon Oluşturma aracına verin; araç ölçüleri tek dosyada toplar. Dosyayı sitenizin kök klasörüne koymanız yeterlidir.
Simgemi değiştirdim ama sekmede eskisi duruyor, neden?
Tarayıcı bu dosyayı belleğinde tutar. Sekmeyi kapatıp yeniden açın; sürmesi hâlinde adres çubuğuna sitenizin adresinden sonra favicon.ico yazarak dosyayı doğrudan açın ve yenileyin.
Sitem yok, yine de bu dosyaya ihtiyacım olur mu?
Bir blog, portföy sayfası ya da tek sayfalık bir tanıtım bile sekmede görünür. Simgesi olmayan site boş kâğıt ikonuyla durur; bu, ziyaretçinin sekmeler arasında sizi bulmasını zorlaştırır.
ICO dosyasının içindekileri geri çıkarabilir miyim?
Evet. ICO'dan PNG'ye aracı dosyanın içindeki sürümleri ayrı görseller olarak verir; en büyük olanı tek başına ya da hepsini birden alabilirsiniz.
Son güncelleme: 27 Ağustos 2026