Favicon Oluşturucu
Bir favicon için birkaç boyut gerekir: tarayıcılar için 16, 32 ve 48 piksel, Apple cihazları için 180 piksel, web uygulaması simgeleri için 192 ve 512 piksel. Bu araç hepsini ve çok boyutlu bir favicon.ico dosyasını yükleme yapmadan üretir.
Nasıl kullanılır
- Metin veya emoji’yi seçip bir ila üç karakter yazın ya da Resim’i seçip bir logo bırakın (en fazla 50 MB). Kare olmayan resim ortadan kırpılır.
- Arka plan rengini, metin rengini ve şekli seçin. Köşelerin saydam olmasını istiyorsanız Saydam arka plan’ı işaretleyin; Apple simgesi her zaman düz bir arka plan korur.
- Her dosyayı kendi düğmesiyle indirin, link etiketlerini sayfanızın head bölümüne, manifesti de site.webmanifest adlı bir dosyaya kopyalayın. Tüm dosyaları sitenizin kök klasörüne koyun.
Nasıl hesaplanır
Her boyut kendi tuvalinde çizilir. Büyük bir resim son boyutlandırmadan önce adım adım yarıya indirilir; böylece ince çizgiler 16 px’te okunaklı kalır. Metin, ölçülen yüksekliğine göre ortalanır ve sığmayacaksa otomatik küçülür.
favicon.ico bu sayfada bayt bayt oluşturulur: 6 baytlık bir başlık, her boyut için 16 baytlık bir kayıt, ardından PNG dosyalarının kendisi. Modern tarayıcılar ve Windows ICO içindeki PNG’yi okur, tek dosya 16, 32 ve 48 px boyutlarını karşılar.
Hiçbir şey sunucuya gönderilmez. Resminizi tarayıcınız okur, simgeler yalnızca bu sekmede bulunur ve İndir’e bastığınızda doğrudan cihazınıza kaydedilir.
Hangi boyut nerede kullanılır
| Dosya | Boyut (px) | Kullanım yeri |
|---|---|---|
| favicon.ico | 16, 32, 48 | Tarayıcı sekmeleri, eski tarayıcılar, Windows |
| favicon-32x32.png | 32 | Yüksek yoğunluklu ekranlarda sekmeler ve yer imleri |
| apple-touch-icon.png | 180 | iPhone ve iPad ana ekranı |
| android-chrome-192x192.png | 192 | Android ana ekranı |
| android-chrome-512x512.png | 512 | Android açılış ekranı ve kurulabilir uygulamalar |
Dosyaları nereye koymalı
Her şeyi sitenizin en üst klasörüne yükleyin; böylece siteniz.com/favicon.ico simgeyi açar. Tarayıcılar hiçbir etiket olmasa bile /favicon.ico adresini kendiliğinden ister. Favicon’u değiştirdikten sonra tarayıcılar önbelleğe aldığı için sekmeler bir süre eski simgeyi gösterebilir. Kontrol etmek için simge adresini doğrudan açıp sayfayı yenileyin.
Sık sorulan sorular
Logom yükleniyor mu?
Hayır. Resim bu tarayıcı sekmesinin içinde çizilir ve kodlanır. Yükleme, hesap ya da başka bir yerde saklanan kopya yoktur.
Gerçekten hangi dosyalara ihtiyacım var?
Site kökündeki bir favicon.ico neredeyse tüm tarayıcılarda işe yarar. 32 px PNG, 180 px Apple dokunma simgesi ve 192 ile 512 px simgeleri eklemek sekmeleri, yer imlerini, iPhone ana ekranlarını ve Android kurulumlarını kapsar.
Apple simgesi neden yuvarlatılmış ya da saydam değil?
iOS köşeleri kendisi yuvarlar ve saydam alanları siyah gösterir. 180 px simge, ana ekranda düzgün görünsün diye her zaman düz arka planlı tam bir karedir.
Hangi resimle başlamalıyım?
Logonun ortada, çevresinde biraz boşluk olan en az 512 x 512 piksellik kare bir PNG ile. Ayrıntılı çizimler 16 px’te zor okunur; bu yüzden sade bir işaret ya da tek harf en iyisidir.
Emojim başka cihazda neden farklı görünüyor?
Emojiler kendi cihazınızdaki yazı tipleriyle çizilir, yani simge sistem çiziminizi kullanır. Kaydedilen PNG bundan sonra değişmez; her ziyaretçi aynı resmi görür.