Yazılım dünyasında her şeyin kolaylaştığı bence kesinlikle yalan. Eskiden ico ya da png uzantılı bir favicon koyduk mu web tarayıcıda da mobil tarayıcıda da tertemiz görünürdü. Ama artık her cihaz için farklı boyutlarda (16x16, 32x32, 150x150, 192x192, 512x512 px gibi) boyutlara sahip png dosyalar hazırlamanız gerekiyor ki tüm cihazlarda sorunsuzca görüntülensin. Ayrıca bir webmanifest dosyası, bir ico dosyası, bir svg dosyası, bir xml dosyası derken favicon hazırlamak sürekli site hazırlayan insanlar için zaman alıcı bir hal almaya başlıyor. Neyse ki internette otomatik favicon hazırlayan siteler var, bir png dosyasını yüklüyorsunuz, o tüm düzenlemeleri yapıyor. İyi güzel ama en güncel, kaliteli ve eksiksiz favicon dosyalarını hazırlayan site hangisi?
favicon-generator.org ben bildim bileli arama motorlarında en üst sırada çıkar, ama sadece eski usul ico dosyası üretiyor ve güncel favicon teknolojilerine kıyasla ihtiyaçları karşılamıyor.
favicon.io yazıdan favicon üretmek gibi harika bir işlev sunuyor. Text'e ek olarak emoji ve resim desteği de veriyor
realfavicongenerator.net tüm dosyaları tek seferde üreterek topluca zip dosyası olarak sıkıştırılmış halde indirmenize olanak tanıyor. Ek olarak gerekli stil kodlarını da size hazır olarak veriyor ve tek yapmanız gereken şey de kopyala yapıştır yapmak oluyor. Şahsen eski favorim
favicon.cc size piksel piksel çizim yapabilmenizi sağlayan basit bir arayüz veriyor ve isterseniz kendi favicon görselinizi bu arayüzden kendiniz çizebiliyorsunuz
favicomatic.com en fazla sayıda yeniden boyutlandırma seçeneği sunan platform. favicon.io'da olduğu gibi sadece görseli atıyorsunuz ve ister sadece ico, ister de alağıdaki gibi tüm boyutlarda size favicon görsellerini hazırlıyor. Güncel favorim.
Örnek stil çıktısı:
<link rel="apple-touch-icon-precomposed" sizes="57x57" href="apple-touch-icon-57x57.png" />
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="apple-touch-icon-114x114.png" />
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="apple-touch-icon-72x72.png" />
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="apple-touch-icon-144x144.png" />
<link rel="apple-touch-icon-precomposed" sizes="60x60" href="apple-touch-icon-60x60.png" />
<link rel="apple-touch-icon-precomposed" sizes="120x120" href="apple-touch-icon-120x120.png" />
<link rel="apple-touch-icon-precomposed" sizes="76x76" href="apple-touch-icon-76x76.png" />
<link rel="apple-touch-icon-precomposed" sizes="152x152" href="apple-touch-icon-152x152.png" />
<link rel="icon" type="image/png" href="favicon-196x196.png" sizes="196x196" />
<link rel="icon" type="image/png" href="favicon-96x96.png" sizes="96x96" />
<link rel="icon" type="image/png" href="favicon-32x32.png" sizes="32x32" />
<link rel="icon" type="image/png" href="favicon-16x16.png" sizes="16x16" />
<link rel="icon" type="image/png" href="favicon-128.png" sizes="128x128" />
<meta name="application-name" content=" "/>
<meta name="msapplication-TileColor" content="#FFFFFF" />
<meta name="msapplication-TileImage" content="mstile-144x144.png" />
<meta name="msapplication-square70x70logo" content="mstile-70x70.png" />
<meta name="msapplication-square150x150logo" content="mstile-150x150.png" />
<meta name="msapplication-wide310x150logo" content="mstile-310x150.png" />
<meta name="msapplication-square310x310logo" content="mstile-310x310.png" />