Favicon üreteci

Favicon nedir?

Bir siteyi tarayıcı sekmesinde, yer imlerinde, geçmişte, mobil arama sonuçlarında ve site ana ekrana sabitlendiğinde telefonun ana ekranında temsil eden küçük simgedir. Favicon olmadan tarayıcı genel bir simge gösterir; bu da siteyi yarım kalmış gibi gösterir.

Favicon oluşturma

İdeal olarak kare ve en az 512 × 512 piksel bir görsel seç. Toolo şunları üretir:

• her yerde tanınan klasik biçim olan bir favicon.ico dosyası;
• ZIP olarak indirilebilen, modern boyutlarda bir PNG paketi.

Dosyaları yerleştirmek

favicon.ico dosyasını sitenin kök dizinine koy: tarayıcılar onu /favicon.ico adresinde otomatik arar. Ardından sayfalarının <head> bölümüne ilgili etiketleri ekle, örneğin:

• <link rel="icon" href="/favicon.ico" sizes="any">
• <link rel="apple-touch-icon" href="/apple-touch-icon.png">

Kurulabilir bir web uygulaması için 192 ve 512 simgelerini manifest.webmanifest dosyasında tanımla.

Minik bir simgeyi başarılı kılmak

• Sadeleştir: 16 pikselde ayrıntılı bir logo lekeye dönüşür. Bir harf, sembol ya da basit bir şekil daha iyi çalışır.
• Kontrast sağla: simge hem açık hem koyu sekmede okunaklı kalmalı.
• Alanı kullan: motifin çevresinde az boşluk bırak.

Yeni faviconum görünmüyor

Tarayıcılar faviconları uzun süre önbellekte tutar. Sayfayı önbelleği atlayarak yenile, siteyi gizli pencerede aç ya da adrese /favicon.ico?v=2 gibi bir sürüm parametresi ekle.

Sık sorulan sorular

Görselin kare olması gerekiyor mu?

İdeal olarak evet. Kare olmayan bir görsel uyarlanır ve hafifçe bozulabilir. Önce resim kırpma aracıyla kare olarak kırp.

Görselim bir sunucuya gönderiliyor mu?

Hayır. Simgeler tarayıcında üretilir; görsel cihazından çıkmaz.

Saydam bir PNG saydam kalıyor mu?

Evet. Saydamlık ICO dosyasında da PNG'lerde de korunur.

Gerçekten tüm boyutlar gerekli mi?

Sekmeler için favicon.ico yeterlidir. 180, 192 ve 512 PNG'ler telefon ana ekranlarında ve web uygulamalarında görünümü iyileştirir.