Görselleri simge ve favicon'lara dönüştürün
Bir görsel seçin, ondan tam bir simge seti oluşturalım: içinde altı boyut bulunan bir favicon.ico, artı tarayıcıların ve işletim sistemlerinin istediği her boyut için PNG simgeler.
Nasıl kullanılır
- 1
Bir görsel seçin — tercihen şeffaf arka planlı kare bir PNG.
- 2
Sığdırma modunu ve istediğiniz boyutları seçin.
- 3
İndirmeden önce her boyutu kontrol edin.
- 4
Yalnızca favicon.ico'yu, ya da PNG simgeler ve manifesto içeren tam paketi indirin.
Tek bir görsel neden yeterli değil
Tarayıcılar sekme için 16 ve 32 piksel, iOS ana ekran için 180, Android ise manifesto için 192 ve 512 ister. Tek büyük bir görsel vermek her cihazın onu kendi başına küçültmesine bırakır, bu da küçük boyutlarda bulanık görünür — bu yüzden her boyutu yüksek kaliteli yumuşatmayla ayrı ayrı oluştururuz.
ICO dosyası nedir
Farklı boyutlarda birden fazla görsel içeren tek bir dosya; sistem buradan her yer için uygun olanı seçer. İçine browser'ların ve Windows'un birlikte ihtiyaç duyduğu kapsam olan 16, 32, 48, 64, 128 ve 256 piksel koyarız.
Görselin tamamı mı, doldur ve kırp mı?
Simgeler karedir ve görseliniz genellikle değildir. «Görselin tamamı» onu bütünüyle korur ve şeffaf kenar boşlukları ekler, bu da logolar için uygundur. «Doldur ve kırp» kenarları keserek tüm kareyi doldurur, bu da fotoğraflar için uygundur.
Sık sorulan sorular
- favicon.ico ile PNG simgeler arasındaki fark nedir?
- ICO birden fazla boyutu bir araya getirir ve eskiler de dahil her tarayıcı onu anlar. Ayrı PNG'ler iOS, Android ve web manifestosunun gerektirdiği şeydir. Tam paket size ikisini de verir.
- Dosyaları nereye koyarım?
- Sitenizin kök dizinine, ardından araç altında gösterilen bağlantı etiketlerini sayfalarınızın head'ine ekleyin.
- İyi bir kaynak görsel nasıl olmalı?
- Şeffaf arka planlı, 512 piksel veya daha büyük kare bir görsel. Basit logolar, ayrıntılarla dolu görsellerden 16 pikselde çok daha net okunur.
- Şeffaflık korunuyor mu?
- Evet. Tüm boyutlar hem ICO içinde hem dışında PNG olarak oluşturulur ve PNG şeffaflığı tam olarak destekler.
- SVG destekleniyor mu?
- Evet, ve mümkün olan en iyi kaynaktır: her simgenin tam boyutunda çizilir, bu yüzden sonuç kusursuz netliktedir.
- iOS simgesinin boyutu nedir?
- apple-touch-icon etiketi için 180 piksel. Boyut listesinde varsayılan olarak işaretlidir.
- Görselim bir sunucuya yükleniyor mu?
- Hayır. Her şey tarayıcınızda oluşturulur ve ICO dosyasının kendisi sayfada bayt bayt birleştirilir.
- site.webmanifest nedir?
- Birisi sitenizi ana ekrana eklediğinde Android'e hangi simgeleri kullanacağını söyleyen bir dosya. Onu paketin içinde hazır olarak oluştururuz.