Tüm Platformlar İçin Ücretsiz Favicon Oluşturucu

Bir favicon oluşturucu, bir web sitesini markalamanın sıkıcı kısmını sizin yerinize halleder: aynı logoyu altı boyutta dışa aktarmak, her dosyayı doğru adlandırmak ve her platforma bunları nerede bulacağını söyleyen etiketleri yazmak. Favicon küçüktür ama çok yol kat eder. Tarayıcı sekmelerinde, yer imlerinde ve geçmişte, telefon ana ekranlarında ve Google sonuçlarında site adınızın yanında yer alır; Google orada en az 8x8 piksel boyutunda kare bir simge ister ve 48x48'den büyük olanı önerir (Google Search Central, arama sonuçlarında favicon'lar).

Favicon oluşturucuyu nasıl kullanırsınız?

Araca bir PNG, JPG veya SVG dosyası bırakın; ideal olarak 512x512 piksel veya daha büyük. Oluşturucu görselinizi her boyutta yüksek kaliteli yumuşatmayla bir tuvale çizer ve altı sonucu yan yana gösterir.

1. Kare bir kaynak hazırlayın. Araç görselinizi kırpmadan her kare boyuta yeniden boyutlandırır; dolayısıyla dikdörtgen bir logo esnemiş görünür. Önce amblemin etrafında küçük bir boşlukla kareye kırpın.
2. Dosyayı bırakın veya seçmek için tıklayın. Önizleme bir saniyede görünür.
3. Paketi indirin: "Tümünü indir (.zip)" düğmesiyle ya da her PNG'yi ayrı ayrı.
4. HTML kodunu kopyalayın ve her sayfanın <head> bölümüne, genellikle site şablonunuza ekleyin.
5. Manifest'i kopyalayın, name ve short_name alanlarını markanızla doldurun ve sitenizin kök dizinine site.webmanifest olarak kaydedin.
6. Dosyaları alan adınızın kök dizinine yükleyin; böylece /favicon-32x32.png ve koddaki diğer yollar çözülür.

İşleme tarayıcınızda gerçekleştiği için oluşturucu, henüz yayımlanmamış logolarla ve üçüncü taraf bir sunucuya göndermenize izin olmayan müşteri dosyalarıyla çalışır.

2026'da hangi favicon boyutlarına ihtiyacınız var?

Altı PNG dosyası tarayıcıları, iOS'u, Android'i ve Windows'u kapsar. Tablo, oluşturucunun ürettiklerini, her dosyanın nerede kullanıldığını ve ona başvuran etiketi veya dosyayı listeler.

192 ve 512 çifti keyfi değildir: Chromium tarayıcılar için bir web uygulaması manifest'i en az bir 192x192 ve bir 512x512 simge sunmalıdır; Chrome bunları ihtiyaç duyduğu diğer yerler için ölçeklendirir (web.dev, web uygulaması manifest'i ekleme). 180x180 boyutu, Apple'ın web klipleri için kendi örnek kodundaki yüksek çözünürlüklü iPhone simgesine denk gelir (Apple, web uygulamalarını yapılandırma). Windows karosu eski bir dosyadır: zarar vermez ve eski Windows kurulumlarını hedeflemiyorsanız etiketi çıkarabilirsiniz.

Oluşturucu size hangi HTML kodunu verir?

<head> bölümü için altı satır: PNG favicon'lar için iki rel="icon" bağlantısı, Apple touch simgesi, manifest bağlantısı, Windows karosu ve bir theme-color meta etiketi. Bir sayfa birden çok simge listelediğinde tarayıcı, en uygun olanı seçmek için type ve sizes özniteliklerini okur ve bir dosya başarısız olursa sonrakine geçer (MDN, bağlantı türleri).

Oluşturulan koddaki iki ayarı düzenlemeye değer. theme-color ve manifest renkleri varsayılan olarak beyazdır (#ffffff): tarayıcı çubuğunun ve yüklü bir uygulamanın açılış ekranının sitenizle uyumlu olmasını istiyorsanız bunları marka renginizle değiştirin. Manifest ise name ve short_name alanlarını bilerek boş bırakır: web.dev ikisinden en az birinin zorunlu olduğunu ve yerin kısıtlı olduğu ana ekranda short_name'in kullanıldığını açıklar.

Favicon SEO'ya yardımcı olur mu?

Sıralama faktörü olarak değil, ama sonucunuzun nasıl göründüğünü şekillendirir. Google, favicon'unuzu her sonucun en üstünde site adınızın yanında gösterebilir; bu yüzden net bir simge arama yapanların markanızı tanımasına yardımcı olur ve genel bir dünya simgesi taşıyan sonuçlara karşı tıklama oranınızı yükseltebilir.

Google uygun olmanın koşullarını listeler ve bunlardan birinin eksik olması, bir favicon'un görünmemesinin olağan nedenidir:

• Ana sayfada bir bağlantı etiketi. Google rel="icon", shortcut icon, apple-touch-icon ve apple-touch-icon-precomposed değerlerini okur.
• Tarama erişimi. Googlebot ana sayfaya, Googlebot-Image ise simge dosyasına ulaşabilmelidir. Görsel klasörünüzü engelleyen bir robots.txt kuralı favicon'unuzu gizleyebilir.
• En az 8x8 piksel, ideal olarak 48x48'den büyük, desteklenen bir biçimde (BMP, GIF, ICO, PNG, JPEG, PPM veya TIFF) kare bir dosya. Oluşturulan PNG dosyaları bu koşulu sağlar.
• Ana makine adı başına bir favicon. Bir alt alan adının kendi simgesi olabilir; /blog gibi bir alt dizinin olamaz.
• Sık değiştirmediğiniz kararlı bir URL.

Bir değişiklikten sonra Google'ın ana sayfayı yeniden taraması gerekir; aynı belgelere göre bu birkaç günden birkaç haftaya kadar sürebilir. Search Console'da ana sayfanın dizine eklenmesini istemek bunu hızlandırır.

16 pikselde okunabilir kalan bir favicon nasıl tasarlanır?

Önce en küçük boyut için tasarlayın. 16x16 boyutunda simgenin tamamı 256 pikseldir; dolayısıyla sloganlı tam bir logo bulanıklığa dönüşür. Bu kurallar simgeyi okunur tutar:

• Tam logoyu değil, logo amblemini kullanın. Bir sembol ya da tek bir kalın harf küçülmeye dayanır; bir kelime dayanmaz.
• Kareyi doldurun. İnce bir boşluk bırakın ama amblemi sekmede küçücük gösteren geniş boş kenarlıklardan kaçının.
• Güçlü kontrast ve iki ya da üç düz renk tercih edin. İnce çizgiler ve gradyanlar küçük boyutlarda kaybolur.
• Açık ve koyu temaları kontrol edin. Koyu amblemli şeffaf bir PNG, koyu bir sekme çubuğunda kaybolur; düz bir arka plan ya da açık renkli bir kontur bunu çözer.
• Android için maskeleri düşünün. Android uygulama simgelerini daire biçiminde kırpabilir. MDN, önemli kısmın güvenli bir alanın içinde olduğu ve opak bir arka planı bulunan maskelenebilir bir simge önerir (MDN, uygulama simgelerini tanımlama). Amblemin kenarlara değiyorsa, 192 ve 512 dosyaları için boşluk payı bırakılmış bir sürüm dışa aktarın.

En yaygın favicon hataları hangileridir?

Bozuk favicon'ların çoğu görselden değil, bir yoldan veya önbellekten kaynaklanır.

• Dosyaların yanlış klasöre yüklenmesi. Oluşturulan kod kök dizine işaret eder (/favicon-32x32.png). Dosyaları /assets içine koyarsanız her yolu güncelleyin.
• /favicon.ico adresinde dosya olmaması. Bir sayfa simge tanımlamadığında HTML standardı tarayıcıların varsayılan olarak /favicon.ico adresini istemesine izin verir (WHATWG HTML standardı, bağlantı türleri). PDF'ler veya hata sayfaları gibi etiketsiz sayfalar bu durumda günlüklerinizde 404 üretir. Oluşturucu yalnızca PNG dosyaları üretir; bu yedeği istiyorsanız 32x32 PNG'nizi herhangi bir görsel düzenleyiciyle ICO dosyası olarak dışa aktarın.
• Gitmeyen eski bir simge. Tarayıcılar favicon'ları agresif biçimde önbelleğe alır. Yeniden tasarımdan sonra dosyayı yeniden adlandırın veya bir sürüm parametresi (?v=2) ekleyin.
• Etiketlerin yalnızca ana sayfada olması. Tarayıcılar simgeyi sayfa sayfa okur; bu yüzden kodu ortak şablona koyun.
• Esnemiş bir logo. Yukarıda anlatıldığı gibi, oluşturmadan önce kaynağı kareye kırpın.

Dosyalar yayına girdikten sonra, bir tarayıcının gerçekte hangi simgeleri bulduğunu görmek için alan adınızda favicon çıkarıcıyı, head etiketlerinizin geri kalanını kontrol etmek için ise sayfa içi SEO denetimini çalıştırın.

Favicon, yapay zeka yanıtlarındaki markanıza nasıl uyar?

ChatGPT ve Perplexity gibi yapay zeka asistanları, kaynak bağlantısının yanında çoğu zaman alıntıladıkları her sitenin simgesini gösterir. Tutarlı bir favicon markanızı orada da tanınır kılar, ama bu yalnızca çerçevedir: alıntılanmak içeriğinize ve otoritenize bağlıdır. Sitenizin bu yanıtlarda hiç görünüp görünmediğini görmek için yapay zeka anma takibi marka anmalarınızı her hafta, istem istem ve model model ölçer; GEO ve SEO panosu ise bunları Google tıklamalarınızın ve konumlarınızın yanına koyar.

Eksiksiz bir favicon seti tek bir kare görsel ve iki dakika alır. Simgelerinizi yukarıda oluşturun, kodu şablonunuza yapıştırın, ardından onları görecek trafiği autopilot ile büyütmek için Sorank planlarına göz atın.