Favicon Oluşturucu

Harflerden, bir emojiden veya kendi resminizden favicon oluşturun ve tarayıcıların ile telefonların ihtiyaç duyduğu tüm dosyaları (ICO, PNG, SVG ve web manifest) tek bir ücretsiz zip içinde indirin. Kayıt gerekmez: resminiz tarayıcınızdan hiç çıkmaz.
Favicon Oluşturucu
İlk harfi simge olur. Web manifest’te de kullanılır.
Adın ilk harfini kullanmak için boş bırakın ya da bir iki karakter veya bir emoji yazın.
Şekil
16 px
32 px
48 px
180 px

Favicon dosyalarınız

  • favicon.icoHer tarayıcı için tek dosyada 16, 32 ve 48 px.
  • favicon.svgHer boyutta net, güncel tarayıcılar için.
  • favicon-16x16.png, favicon-32x32.png, favicon-48x48.pngKüçük boyutlar PNG olarak.
  • apple-touch-icon.png180 × 180 px, iPhone ve iPad ana ekranları için.
  • android-chrome-192x192.png, android-chrome-512x512.pngAndroid ve yüklenen web uygulamaları için.
  • site.webmanifestAndroid için site adı ve simgeler.
  • head-tags.htmlSayfanın <head> bölümüne yapıştıracağınız aşağıdaki etiketler.

Simgeleri sitenize ekleyin

<link rel="icon" href="/favicon.ico" sizes="48x48">
<link rel="icon" href="/favicon.svg" type="image/svg+xml">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="manifest" href="/site.webmanifest">
<meta name="application-name" content="Acme Studio">
<!-- Elfsight ile oluşturuldu: https://tr.elfsight.com/tools/favicon-generator/ -->

  1. Kopyalamak için yukarıdaki Kodu kopyala düğmesine tıklayın.
  2. Dosyaları zip’ten çıkarın ve sitenizin kök klasörüne yükleyin; böylece yoursite.com/favicon.ico simgeyi açsın.
  3. Sayfanın HTML dosyasını veya her sayfanın kullandığı şablonu açın.
  4. Kodu <head> içine, kapanış </head> etiketinden önce yapıştırın.
  5. Sayfayı kaydedin ve yükleyin.

Favicon’u platformunuza nereden yüklersiniz

Çoğu site oluşturucu favicon etiketlerini sizin için ekler. Sayfa kodunu düzenlemek yerine kare bir görseli aşağıdaki yere yükleyin.

WordPress

  1. En az 512 × 512 px kare bir PNG hazırlayın.

  2. WordPress 6.5 veya üzeri: Ayarlar → Genel’e gidin ve Site Simgesi Seç’e tıklayın.

  3. Eski sürümler: Görünüm → Özelleştir → Site Kimliği’ne gidin ve Site Simgesi’ni seçin.

  4. Görselinizi seçin ve kaydedin.

Resmi kılavuz:WordPress: favicon oluşturma

Wix

  1. Özel favicon için Premium bir plan ve bağlı bir alan adı gerekir; site de yayında olmalıdır.

  2. Panelinizde Ayarlar → Web sitesi ayarları’na gidin.

  3. Favicon altında Görsel Yükle’ye tıklayın ve dosyanızı seçin.

  4. Değişikliklerinizi kaydedin.

Resmi kılavuz:Wix: favicon ekleme

Shopify

  1. Shopify yönetim panelinizde Online Mağaza → Temalar’a gidin ve Temayı düzenle’ye tıklayın.

  2. Tema ayarları’nı (dişli simgesi), ardından temanıza bağlı olarak Logo veya Favicon’u açın.

  3. Favicon görseli altında Görsel seç’e tıklayın ve dosyanızı seçin.

  4. Kaydet’e tıklayın. Favicon, tema düzenleyicinin önizlemesinde değil, canlı mağazanızda görünür.

Resmi kılavuz:Shopify: favicon ekleme

Squarespace

  1. Site ayarlarınızdaki Favicon panelini açın.

  2. 100 × 100 ile 300 × 300 px arasında, 100 KB’ın altında bir PNG yükleyin. ICO dosyaları kabul edilmez.

  3. İsterseniz karanlık mod sürümü ekleyin.

  4. Kaydet’e tıklayın.

Resmi kılavuz:Squarespace: favicon ekleme

Webflow

  1. Site ayarları → Genel → Simgeler’e gidin.

  2. Simge yükle’ye tıklayın ve kare bir görsel seçin. Webflow diğer boyutları bundan üretir.

  3. Uygula’ya tıklayın.

  4. Siteyi yayımlayın.

Resmi kılavuz:Webflow: favicon’lar ve webclip’ler

HTML

  1. Oluşturulan dosyaları sitenizin kök klasörüne yükleyin.

  2. Oluşturulan <link> etiketlerini her sayfanın <head> bölümüne ya da en azından ana sayfaya yapıştırın.

  3. Dosyaların tarayıcıda açıldığından emin olun; örneğin /favicon.ico.

  4. Yeni simgeyi görmek için tarayıcı önbelleğinizi temizleyin.

Resmi kılavuz:Google: arama sonuçlarındaki favicon’lar

Google favicon’unuzu neden göstermiyor

Google, sonucunuzun yanında favicon’u yalnızca ana sayfanızdan bulup alabiliyorsa gösterir. Google’ın favicon kılavuzundaki şu noktaları kontrol edin:

  • Etiket ana sayfada. Google, ana sayfanızın <head> bölümündeki <link rel="icon"> etiketini okur. shortcut icon, apple-touch-icon ve apple-touch-icon-precomposed da çalışır.

  • Kare olmalı. 1:1 oranında, en az 8 × 8 px. Google, net görünmesi için 48 × 48 px’ten büyük olmasını önerir.

  • Biçim desteklenmeli: ICO, PNG, GIF, JPEG, BMP, PPM veya TIFF. SVG Google’ın listesinde yoktur; bu yüzden SVG simgenin yanına bir ICO veya PNG ekleyin.

  • Google tarayabilmeli. robots.txt, simge dosyasını (Googlebot-Image için) veya ana sayfanızı (Googlebot için) engellememelidir.

  • URL aynı kalmalı. Favicon adresini sık değiştirmeyin.

  • Ana makine adı başına bir favicon. example.com ve shop.example.com farklı simgelere sahip olabilir. example.com/shop olamaz; sitenin simgesini kullanır.

  • Markanızı temsil etmeli. Google uygunsuz simgeleri varsayılan bir simgeyle değiştirir.

Değişiklikler, Google ana sayfanızı yeniden taradıktan sonra görünür; bu günler veya haftalar sürebilir. Search Console’un URL Denetleme aracında ana sayfanın dizine eklenmesini isteyebilirsiniz. Bazı site oluşturucular boyutun 48 px’in katı olması gerektiğini hâlâ söyler. Bu Google’ın eski kuralıydı ve bu boyutlar hâlâ sorunsuz çalışır.

Sitenize favicon nasıl eklenir

  1. Simgeyi tasarlayın

    Bir iki harf veya bir emoji kullanın ya da kare bir logo yükleyin.

  2. Zip’i indirin

    İçinde favicon.ico, telefonlar için PNG boyutları, bir SVG, web manifest ve HTML etiketleri bulunur.

  3. Dosyaları yükleyin

    Dosyaları sitenizin kök klasörüne koyun ve etiketleri <head> bölümüne yapıştırın. Web sitesi oluşturucularda genellikle bir favicon alanı bulunur; 512 px PNG’yi oraya yükleyin.

Sık sorulan sorular

Daha fazla SEO ve şema araçları

Video Şeması Oluşturucu

Herhangi bir video için VideoObject yapılandırılmış verisi (JSON-LD) oluşturun.Video Şeması Oluşturucu

SERP Snippet Önizleme

Sayfa başlığınızın ve açıklamanızın Google'da nasıl göründüğünü görün.SERP Snippet Önizleme