Favicon: Favicon Nedir ve Nasıl Yapılır?




Bir web sitesi oluştururken, çok sayıda kişi büyük bir fark yaratabilecek küçük bir son dokunuşu gözden kaçırır: Favicon. Web tasarımınıza yapılan bu küçük eklemeler, gerçek boyutlarından çok daha büyük bir etkiye sahip. Bu nedenle güçlerini ve önemlerini hafife almayın. Favicon nedir, favicon oluşturma, siteye favicon ekleme ve bunlar gibi faivconlarla ilgili bilmeniz gereken her şeyi bu yazıda topladık.



Favicon nedir?


Favicon, bir web sitesini veya web sayfasını temsil etmek için web tarayıcılarında kullanılan küçük, 16x16 piksellik bir simgedir. Türkçe'de 'favori simge' anlamına gelen 'favorite icon' ifadesinin kısaltması olan favicon, en yaygın olarak bir web tarayıcısının üst kısmındaki sekmelerde görüntülenir. Aynı zamanda tarayıcınızın yer imi çubuğunda, geçmişinde ve daha fazlasında da bulunur. Google Chrome gibi bazı tarayıcıların ana sayfasında da görünürler. Başka bir deyişle, favicon, web sitenizin simgesi veya web sitenizi internette tanımlamanız için görsel bir işaret görevi görür.





Favicon neden önemlidir?


Küçücük boyutlarına rağmen, faviconlar, kullanıcı deneyimini, markalaşmayı ve profesyonelliğini geliştirerek her türlü web sitesi için büyük önem taşır.


Kullanıcı deneyimi: Favicon, web siteniz için akılda kalıcı görsel bir ipucu olarak kullanıcı deneyimini geliştirir. Kullanıcıların sitenizin sekmesini tarayıcılarında ve yer imi çubuğu gibi farklı uygulamalarda kolayca bulmasına yardımcı olarak siteye tekrar tekrar gelinmesini kolaylaştırır.


Markalaşma: Gerçekten uyumlu bir marka için en küçük ayrıntıları bile gözden kaçırmamak çok önemli. Favicon, stilinizi ve dilinizi sitenin dışına taşıyarak web sitenizin markalaşmasına ve görünürlüğüne katkıda bulunur.


Profesyonellik: Favicon, web sitenizin meşruiyetini ve profesyonelliğini artırarak keskin ve düşünülmüş görünmesini sağlar.



Favicon nasıl yapılır?


Favicon oluşturması için profesyonel bir tasarımcı tutmayı düşünebilirsiniz (zaten biriyle çalışıyorsanız, sözleşmenize bir favicon ekleyebilirsiniz). Ayrıca, seçtiğiniz bir tasarım programını veya birkaç online aracı kullanarak kendi kendinize de bir favicon oluşturmanız mümkün. Bu tür araçlardan önerebileceğimiz biri, tarzınızı ve ihtiyaçlarınızı en iyi şekilde yansıtmak için profesyonel ve kişiselleştirilmiş bir favicon oluşturmanıza olanak tanıyan Wix Logo Oluşturucu.


Boyut: Bir favicon oluşturmak için en uygun boyut, en sık görüntülendiği boyut olan 16x16 pikseldir. Ancak bazen daha büyük boyutlarda da görünebilirler (32x32 piksel gibi). Resminiz için doğru boyutu bulmak için yardıma ihtiyacınız varsa Wix'in Image Resizer (Görüntü Yeniden Boyutlandırma) aracını kullanmayı deneyin.


Dosya: Bir favicon için tercih edilen dosya biçimi JPEG veya PNG'dir.


Şeffaflık: Tasarımınızın arka planı şeffaf ise, dosyanızı PNG olarak ve şeffaflık ayarı açık olarak kaydettiğinizden emin olun.





Favicon oluşturma ipuçları


Bu kadar ufacık bir şey tasarlamak parkta güzel bir yürüyüş gibi görünebilir. Ancak, faviconların çok küçük olması, hataya yer olmadığı için ekstra dikkatli olmanız gerektiği anlamına gelir. Markanıza ve web sitenize en uygun faviconu oluşturmaya yönelik birkaç ipucu:


Basitlik: Faviconların küçük boyutu, tasarımınızın kusursuz olmasını gerektirir. Küçük çizgiler, doku veya gölgeleme gibi çok fazla ayrıntıya girmekten kaçının. Bunun yerine, anında tanınabilen cesur, net ve basit bir simgeyi hedefleyin.


Sanatçı ve illüstratör Adam J. Kurtz'un Wix web sitesi, belirgin sarı yıldızıyla basit bir favicona harika bir örnek. Başka bir örnek, mücevher tasarımcısı ve Wix kullanıcısı Ilaria Bonardi'nin üç basit noktadan oluşan faviconu.






Marka kimliği: Bir favicon, web sitenizin ve markanızın ruhunu kapsamalı ve web sitenizin geri kalanıyla aynı görsel dili ve renk düzenini korumalı.


Moda markası Sorry'nin Wix web sitesi için, X şeklindeki favicon, kıyafetleri ve logosuyla aynı koyu, siyah-beyaz görsel dilin devamı niteliğinde. Benzer şekilde, eBay'in favicon'u, markanın renklerini küçük bir alışveriş çantası simgesiyle birleştirerek sitenin ruhunu mükemmel bir şekilde yansıtır.






Çok az veya sıfır metin: Faviconunuza marka adınız gibi tipografi (metin) eklemek istiyorsanız, kendinizi bir ila üç karakterle sınırlayın. Baş harfler veya kısaltmalar genellikle metni kısaltmak için iyi çözümlerdir.


Kar amacı gütmeyen kuruluş Arte'nin Wix web sitesi, logosundaki A baş harfini favicon olarak kullanıyor ve dikkat çekmek için neon yeşili bir arka plana sahip. Alternatif olarak, Brooklyn merkezli Red Fern'in Wix web sitesini süsleyen faviconda hiç metin yok.






Logo kullanımı: Bazı logolar favicon boyutunda bile en iyi şekilde görünebilirken, çoğu küçültüldüklerinde pek okunaklı değildir. Logonuzu favicon olarak kullanmak istiyorsanız, muhtemelen birkaç ayarlama yapmanız gerekir. Etiket satırını atlamak veya yalnızca bir baş harfi kullanmak, logoları küçük boyutlarda çalıştırmanın yollarından bazıları.


Aynı tasarım değerlerini bünyesinde barındırırken, Google'ın faviconunun logosundan nasıl biraz daha farklı olduğuna dikkat edin. Favicon, yalnızca tanıdık G harfini gösteriyor ve marka renklerinin dördünü de bu tek harfe sorunsuz bir şekilde dahil etmiş. Farklı bir yaklaşım türüne örnek olarak elle çizilmiş logosunun baş harflerini favicon olarak kullanan illüstratör ve Wix kullanıcısı Charlotte Mei'yi gösterebiliriz.






Renk: Kullanılan içeriğe ve tarayıcıya bağlı olarak faviconun farklı renkli arka planlarda görüntüleneceğini unutmayın. Bu nedenle, tasarımı tamamlamadan önce faviconunuzu gri, beyaz ve siyah arka planlar üzerinde test ettiğinizden emin olun.



Siteye favicon ekleme


Wix siteleri otomatik olarak standart bir varsayılan favicon içerir. Bunu bir Premium pakete yükselterek ve sitenize bir domain bağlayarak özelleştirebilirsiniz.


Wix sitenizin faviconunu kolayca değiştirebilirsiniz:


  1. Sitenizin kontrol panelinde Ayarlar'a gidin.

  2. "Favicon"un yanındaki "Yönet"e tıklayın.

  3. "Resim Yükle"ye tıklayın ve mevcut bir resmi seçin veya bilgisayarınızdan bir resim eklemek için "Medya Yükle"ye tıklayın

  4. "Sayfaya Ekle"ye tıklayın. Tarayıcı sekmenizde faviconunuzun nasıl görüneceğine dair bir önizleme göreceksiniz.

  5. 'Kaydet'e tıklayın ve işte bu kadar! Web sitenizin artık bir faviconu var. Yayınla'ya bastığınızda web sitenizin sekmesinde görünür.



Silvya Benzeray

Wix Blog




Kendine profesyonel web sitesi kur