Faviconlar, dijital pazarlamanın önemli bir bileşenidir. Geniş internet alanında şirketinizi görsel olarak tanımlamaya yardımcı olurlar. Web sitenizdeki kullanıcı deneyimi geliştirilebilir ve marka bilinirliği bu küçük ama güçlü öğelerle yükseltilebilir. Bu gönderide, boyutları, bir oluşturucu kullanarak web siteniz için nasıl bir tane oluşturacağınız, SEO'yu nasıl etkiledikleri ve HTML kullanarak nasıl ekleyeceğiniz dahil olmak üzere favicon resim simgesinin ne olduğu hakkında daha fazla bilgi edineceksiniz.
Favicon nedir??
Favicon, web siteniz için marka işlevi gören küçük bir 16×16 piksel resim simgesidir. Başlıca amacı, kullanıcıların birkaç sekme açıkken sayfanızı bulmasını kolaylaştırmaktır.
Bir favicon, küçük boyutundan dolayı en iyi basit bir resim veya bir ila üç karakterlik metin olarak işlev görür. Faviconlar ve logolar bazen aynıdır ancak karıştırılmamalıdır. Küçük boyutu ve düşük çözünürlüğü nedeniyle favicon'un daha da küçük olması veya bir şirketin orijinal logosunun bir parçası olması gerekebilir.
Favicon Görüntü Simgesini Nerede Görebilirsiniz?
Web siteniz için favicon, herhangi bir tanımlayıcı öğenin yanında bulunabilir. Buna arama çubukları, geçmiş sonuçları, araç çubuğu uygulamaları, yer imleri ve sekmeler dahildir.
Favicon'lar şurada bulunabilir:
- Arama çubuğu.
- Arama geçmişi.
- Araç çubuğu uygulamaları.
- Yer imleri.
- Arama çubuğunuz için öneriler.
- Yer işaretlerinizin açılır menüsü.
Birini kullanarak, insanların web sitenizi hızlı bir şekilde tanımasını sağlayabilirsiniz. Bu site simgeleri, çevrimiçi ziyaretçilerin ziyaret ettikleri sayfaları hemen belirlemelerine yardımcı olabilir.
Favicon Simgesi Neden Önemlidir?
Bir şirket web sitesi hazırlarken basit ama çok önemli bir adım, bir favicon simgesi oluşturmaktır. Web sitenize daha fazla yetki verir ve hem internet itibarınızı hem de potansiyel müşterilerin güvenini artırır.
Web sitesi için ilk görsel ipucu görevi görerek, web kullanıcıları için hızlı ve kolay tanımlama sağlar ve birleşik, iyi markalanmış bir gezinme deneyimi oluşturmak için tarayıcının tüm farklı öğelerini bir araya getirir.
Favicon Oluştur
Web siteniz için bir favicon simgesi oluştururken ve tasarlarken dikkate alınması gereken birkaç faktör vardır. Küçük ve basit olmasına rağmen, önemli bir etkisi olabilir (ve olmalıdır). Ziyaretçiler markanızı favicon'unuzla ilişkilendireceğinden, bu görüntünün en iyi versiyonunu oluşturmak çok önemlidir. Site simgesi resim simgenizi oluşturmak için aşağıdakileri aklınızda bulundurun:
1 numara. Alanı akıllıca kullanın
Bazen bir favicon, kurumsal logonuzun küçültülmüş bir kopyası olamaz. Favicon'unuzun tüm boyutu dikkate alınmalıdır. Tüm tarayıcılar izin verdiği için 16 piksele bağlı kalmalısınız.
#2. Basitlik
Markanızın favicon'u logosu görevini görse de, tasarımınızı mümkün olduğunca basit tutmaya çalışmalısınız. En basit site simgeleri en iyi sonucu verir. Favicon'un küçük boyutu ve basit tasarımların kullanılması nedeniyle, potansiyel müşterilerin dikkatini çekmek ve öne çıkmak için renkler çok önemlidir. Favicon yalnızca çok fazla ayrıntı varsa dağınık ve düzensiz görünecektir.
#3. Marka kimliği
Favicon'unuz, markanızın görsel temsili olduğu için şirketinizin neyi temsil ettiğini kullanıcılara görsel olarak iletmelidir. Bu, onlara markanızın ne olduğunu ve neler başardığını hemen açıklar.
Bu kadar küçük ve anlaşılır bir tasarımla bunu yapmak zor olsa da, yaratıcı olmaya çalışın.
#4. kısaltma
İdeal imajı bulmak, şirketinizin yaptığı şey için mümkün olmayabilir. Şirketinizin adının ilk harfini veya kısaltmalarını kullanmak, bunun için tipik bir çözümdür. İşletmenizin adını kısaltmaya da karar verebilirsiniz. Birkaç farklı varyasyon deneyin ve ihtiyaçlarınıza en uygun olanı seçin.
# 5. Renk koordinasyonu
Renk seçimine de dikkat edilmelidir. Zıt renkler, gözün şekiller ile favicon'unuzun ana özelliği arasında ayrım yapmasını kolaylaştırır. Favicon sayısı çok az olduğu için kullanıcıya işletmenizi temsil etmelisiniz ve renk seçimi önemli olabilir. Her tarayıcının birbirinden biraz farklı olduğunu unutmayın. Örneğin bazıları, favicon'unuz tarafından kapsanacak gri, siyah veya beyaz bir arka plana sahiptir.
Favicon Generator
İnternetteki en iyi site simgesi oluşturucuları aşağıda listelenmiştir. Site simgesi oluşturucu için mevcut olan özellikleri kullanarak site simgesi resminizi yüklemeniz yeterlidir. Görüntü daha sonra oluşturucu yazılımı tarafından uygun favicon biçimlerine dönüştürülür ve indirilebilir hale getirilir. Bu süreç çok uzun sürmeyecek.
ICO ve PNG, site simgeleri için kabul edilen dosya biçimleridir.
- Internet Explorer dahil tüm tarayıcılar ICO ile uyumludur.
- Diğer bir popüler format PNG'dir. Ana dezavantaj, bir PNG dosyasının Internet Explorer tarafından desteklenmeyecek olmasıdır.
İdeal olarak, seçtiğiniz oluşturucudan favicon'unuzu her iki biçimde de alabilmeniz gerekir.
1 numara. Favikon
Favikon'da site ikonu oluşturmak çok basit. Bir simge oluşturmak için bir resim yükleyin, kırpın ve ICO veya PNG formatında alın. Favikon, bir dezavantaj olan 16×16 piksel olan yalnızca bir boyuta izin verir.
2 numara. Favicon.io
Favicon.io ile sıfırdan bir site simgesi, bir resim, bir logo veya bir emoji oluşturabilirsiniz. İndirmeden önce üç farklı boyutta görüntüleyebilirsiniz. Sonuç, çeşitli boyutlarda ICO ve PNG formatlarında indirilebilir.
#3. Favicon.ico ve Uygulama Simgesi Oluşturucu
Bir PNG veya JPG resmi yükleyebilir ve bu ücretsiz uygulamayı çeşitli boyutlarda ICO ve PNG formatlarına dönüştürmek için kullanabilirsiniz. Favicon'unuzu istediğiniz biçimde oluşturduktan sonra web sitenizin kök dizinine kaydedeceksiniz. Favicon daha sonra dosyaya işaret eden bir HTML bağlantısı oluşturarak web sitenize eklenebilir.
Bu, Bootstrap CSS gibi bir geliştirme çerçevesi kullanmış veya sitelerini sıfırdan geliştirmiş olsun, web sitesi sahipleri için geçerlidir, not etmek çok önemlidir. Bir web sitesi oluşturucu veya WordPress veya WordPress alternatifleri gibi bir CMS kullanmış olsanız da, prosedür önemli ölçüde farklılık gösterecektir.
Favicon Boyutu
Bir favicon 16×16 piksel boyutunda olmalıdır. Adres çubuklarında, yer imi listelerinde ve tarayıcı sekmelerinde bu şekilde görünürler. Favicon'unuzu ideal olarak birden fazla boyutta oluşturun. Daha büyük ekranlarda, uzatılmış 16×16 versiyonu yerine uygun şekilde ölçeklenmiş versiyonları göreceksiniz.
En popüler favicon boyutları ve özel kullanımları aşağıda gösterilmiştir.
- 16×16: Tarayıcı faviconlarının boyutu.
- 32×32: Görev çubuğu kısayol simgelerinin boyutu.
- 96×96: Masaüstü kısayol simgelerinin boyutu.
- 180×180: Apple dokunmatik simgelerinin boyutu.
- 300×300: Squarespace'in gerektirdiği boyut.
- 512×512: WordPress'in gerektirdiği boyut.
Site Simgeleri SEO İçin Önemli mi?
Favicon'lar SEO'nuzdan doğrudan sorumlu olmasalar da, dolaylı olarak sorumludurlar ve arama motoru konumunuzu yükseltmek için çok önemli bir tekniktir. Bir favicon kullanmanın SEO'nuzu nasıl iyileştirebileceğine dair birkaç örnek:
1 numara. Kullanıcı dostu web siteleri kullanımın artmasına neden olur
Web sitenizin kullanılabilirliği dolaylı olarak arama motoru sıralamalarını yükseltir. Web sitenizi tanımlamayı ve gezinmeyi kolaylaştırarak, tarayıcı sekmelerinizde, yer imlerinizde, geçmiş arşivlerinizde ve diğer yerlerde bir favicon, kullanıcılarınıza zaman kazandırır ve web sitenizle etkileşime girme olasılıklarını artırır.
Sonuç olarak, daha fazla insan web sitenizi daha uzun süre ziyaret edecek, bu da trafiği artıracak ve SEO'nuzu artıracaktır.
#2. Yer imleri
Favicon'suz web sitelerine göre bir avantajınız var. Çevrimiçi yer imlerine eklenmiş web siteleri için, Google Chrome tarayıcısı belirli arama sıralaması faktörlerini dikkate alır. Bir favicon olmadan, web sitenizin Chrome tarayıcısında yer imlerine eklenmesi mümkün olmayabilir; bu, arama sıralamasını belirlemek için kullanılan birçok dolaylı sinyalden biri olacaktır.
Ek olarak, web sitenizin yer imlerine eklenmesi ve ardından faviconunuz sayesinde bu yer imleri listesinde görsel olarak öne çıkması, kullanıcıların siteye geri dönme olasılığını artırır. Tüm bunlar SEO'yu ve web sitenize gelen ziyaretçileri geliştirir.
3 numara. Markalaşma ve görünürlük
Kullanıcılar, web sitenizin ve şirketinizin görsel bir temsili olduğu için markanızı favicon'unuzla ilişkilendirecektir. SEO tamamen pazarlama ve markalaşma ile ilgilidir ve daha fazla ziyaretçi web sitenizi görebilir ve sizi hatırlayabilir, tıklama olasılığı o kadar artar.
HTML'de Favicon Nasıl Eklenir?
Favicon'unuz oluşturulduktan sonra, tarayıcılara ve diğer web tabanlı uygulamalara onu nerede bulacaklarını bildirmeniz gerekir. Bunu, bir kod satırı ekleyerek başarmalısınız. HTML dosyanızın ilgili alanı.
Örneğin, PNG dosyanızı “favicon.ico” olarak kaydettiğinizi varsayalım. Ardından, r'nizin her birinin arasına aşağıdaki kod parçacığını ekleyin. </head> etiketler:
Lütfen alışılagelmiş olmasına rağmen, favicon'unuzun sitenin kök dizininde olması gerekmediğini unutmayın. Başka bir yere kaydettiyseniz, href özelliğinin doğru olduğundan emin olun. yazarsın "images" alt klasörüne kaydettiyseniz.
Çeşitli favicon boyutları ürettiğinizi düşünelim. Her boyut için bir kod satırı ekleyerek HTML dosyanızın ilgili alanına hepsini web sitenize yükleyebilirsiniz.
Örneğin, 16×16, 32×32, 48×48 ve 180×180 sürüm oluşturmak için aşağıdaki kod satırını eklersiniz:
Bir Favicon için Hangi Biçimleri Kullanırım?
Bir favicon'un Windows ICO biçiminde olması gereken bir öncekinin aksine, şimdi birkaç başka biçimlendirme seçeneği var. İşte her birine daha yakından bir bakış:
- Windows ICO: ICO, açık ara en yaygın olarak desteklenen dosya türüdür. ICO'nun avantajı, mükemmel şekilde çalışan ve özellikle Windows için yararlı olan çeşitli bit derinliklerini ve çözünürlükleri destekleyebilmesidir. Ek olarak ICO, Windows 32 görev çubuğu için Internet Explorer ile çalışan 7 piksellik bir simge sağlar. Ek olarak, öğeyi atlayan tek biçimdir.
- PNG: PNG formatı için çeşitli kullanımlar vardır. Ekstra bir yazılım olmadan bir PNG dosyası oluşturulabilir, bu da onu inanılmaz derecede kullanıcı dostu hale getirir. En kısa dosya boyutu sağlanır ve alfa saydamlığı desteklenir. Ancak, bu tasarımın önemli bir dezavantajı, Internet Explorer'ın yalnızca ICO dosyalarını desteklemesi ve PNG dosyalarını açmayacak olmasıdır.
- SVG: Bu biçim Opera tarayıcıları tarafından kullanılabilir ve desteklenir.
- GIF: Eski tarayıcılarla uyumluluk dışında bu formatın hiçbir avantajı yoktur. Kullanıcıları daha dikkat çekici kılacak olsalar da rahatsız etme eğilimleri de vardır ve ezici bir inanç, hiç de avantajlı olmadıkları yönündedir.
- JPG: JPG kullanılabilse de, daha az popülerdir ve PNG ile aynı düzeyde çözünürlük kalitesi sunmaz. JPEG, favicon'un mütevazı boyutu nedeniyle tüm avantajlarını da kaybeder.
- APNG: Bu, PNG'nin animasyonlu bir çeşididir ve Firefox ve Opera bunu desteklese de, izleyicileri arayüzlerinden uzaklaştırma açısından animasyonlu GIF ile aynı dezavantajlara sahiptir.
Bir Favicon'u Nasıl Alabilirim?
Web sitenize favicon eklemek için görseli ya web sunucunuzun kök dizinine ya da kök dizinde oluşturduğunuz resimler adlı yeni bir klasöre kaydedin. "favicon.ico", site simgesi resmi için tipik bir addır.
Favicon Ne İçin Kullanılır?
Kullanıcı deneyimini geliştirmek. Bir favicon'un ana işlevi, aynı tarayıcı penceresinde birden fazla sekme açık olduğunda kullanıcıların bir sayfayı anında tanımasını kolaylaştırmaktır. Bir favicon ile oluşturursanız, kullanıcılar web sitenizi hızlı bir şekilde tanıyabilir ve web sitenize erişebilir.
Favicon logo ile aynı şey midir?
Logolarla karşılaştırıldığında, site simgeleri oldukça küçüktür. Bazı şirketler favicon olarak logolarının küçültülmüş bir versiyonunu kullanır, ancak bu her zaman etkili değildir. Logoların çoğu resim ve metin kullanır, ancak site simgeleri bunları barındırmak için çok küçüktür.
Favicon örneği nedir?
Favicon'umuz, ProCreator web sitesindeki URL çubuğunun solundaki sekmede görülebilen süslü P'dir.
Logomu favicon olarak kullanabilir miyim?
Evet. Favicon olarak, çoğu web sitesi genellikle logolarını kullanır. Halihazırda yoksa, ücretsiz logo oluşturucu ile web siteniz için kolayca bir logo oluşturabilirsiniz.
Favicon kuralları nelerdir?
Fantastik Favicon'lar oluşturmak için yönergeler:
- Sadeliği sağlayın.
- Tanıdık kalsın.
- Mümkün olduğunca az metin veya yazı kullanın.
- Rengi düşünün.
Sonuç
Küçük boyutlarına rağmen, favicons büyük bir etkiye sahiptir. Favicon'lar, web sitenize çevrimiçi bir görsel kimlik sağladıkları ve mümkün olan en iyi kullanıcı deneyimini oluşturmaya yardımcı oldukları için günümüzün hızlı tempolu dijital dünyasında şirketinizin başarısı için çok önemlidir. Güzel yanı, favicons oluşturmanın basit olmasıdır.
İlgili Makaleler
- YER İŞARETİ NASIL YAPILIR: Herhangi Bir Sayfaya Yer İşareti Eklemenin Hızlı ve En Basit Yolları
- Eski PDF Dosyalarınızı Güncellemenin 2 Hızlı Yolu
- BANNER REKLAMCILIĞI: Örneklerle Nasıl Çalışır?
- LINKEDIN LOGOSU: Anlam, Tarih, Yazı Tipi ve Tasarım Etkileri
Referanslar
