Favicons WordPress için Başlayan Kılavuz
Web sitenizde net bir görsel kimlik oluşturmazsanız markanız kesinlikle acı çekecektir.İnsanlar kötü kullanıcı deneyimleri ve zor olmayan tasarımlar sunan siteleri yeniden ziyaret etmek istemezler.Sitenizin web tarayıcısı sekmesinde öne çıkmasını ve bir yer işareti listesi markanızı güçlendirmeye yardımcı olur ve Favicon bunu yapmanın basit bir yoludur.Favicon, web sitesi sahiplerinin kullanıcı deneyimini geliştirirken güçlü bir görsel kimlik oluşturmasına izin verir.Bu makalede, Favicon – Favicon nedir, nerede kullandığınız ve Favicon’un size nasıl yardımcı olduğunu – ve en iyi favicon uygulamalarını ve önerilen görüntü formatlarını tartışacağız.WordPress’te favicons uygulamanın üç yolu hakkında mini bir öğretici ile sonuçlandıracağız.
Hadi çatlayalım!Favicons Favicons’a Giriş Web sitenizin adının solundaki Tarayıcı sekmesinde görüntülenen küçük resimlerdir:
SVG dosya biçimi için destek hala eşit olarak dağıtıldığından, aşağıda favicons oluşturmak ve uygulamak için en yaygın kullanılan iki görüntü dosyası formatını tartışacağız. ICO dosya biçimi muhtemelen Favicon için en ünlü görüntü biçimi ICO dosya biçimidir. Bu, tüm ana tarayıcılar tarafından desteklenir ve mobil cihazlarda da sorunsuz çalışır. ICO dosya biçimi oldukça düzgündür, çünkü aynı görüntünün birkaç sürümünü bir dosyada saklayabilir ve tarayıcıların sitenize erişen cihazlar için en uygun çözünürlüğe sahip görüntüleri görüntülemesine izin verir. Buna ek olarak, bu 8 bit alfa kanal şeffaflığını destekler, görsel çekici bir favicon yapmanıza izin verir. ICO dosya biçimi, ICO dosyasına değiştirilen PNG dosyasıyla aynı değildir. Bazı tarayıcılar bu masum hatayı affedecek kadar nazik olacaktır, ancak bu size bundan daha fazlasına yardımcı olmaz, çünkü orijinal ICO dosyası görüntünün birkaç sürümünü destekler (PNG olmasa da). Favicon’u uygulamak için en iyi uygulama, farklı bir dosya biçimi kullanmayı tercih etseniz bile, yine de bir ICO sürümüne sahip olmanız gerektiğini belirtir. Bunun nedeni basit: Bazı tarayıcılar hala favicon.ico varsayılan dosyaları arıyor. Eğer bulamazlarsa, sitenizin ortak bir varsayılan favicon göstermesi muhtemeldir – her ikisi de markanızı hiç yapmaz.
PNG dosyasının biçimi en iyi uygulama ile önerilenlerden ayrılmıştır, bazılarımız isyancı olarak doğar ve favicon’umuz için PNG dosya biçimini seçeriz. PNG dosyalarının ICO dosyalarına kıyasla yapılması tartışmasız daha kolaydır – bunu minimal tasarım becerileri ile hemen hemen tüm görüntü düzenleme yazılımlarında yapabilirsiniz. ICO dosyası gibi PNG de 8 bit alfa kanal şeffaflığı sunar; Tek dezavantajı birkaç görüntünün olmamasıdır. Favicon Boyutunun Seçimi Yukarıda kısaca bahsettiğimiz gibi, ICO dosya biçimi, görüntünün çeşitli boyut ve çözünürlüklerde çeşitli sürümlerini depolar. Bu, web sitesi sahibinin masaüstü makineleri dışındaki mobil cihazlarda kullanım için uygun olan site favicon’u yapmasına izin verir. Kötü haber, mobil cihazlar için en uygun favicon sunmanın, cihaz ekran boyutu gibi daha fazla öğeyi düşünmenizi gerektirmesidir, çözünürlük ve çalıştırdığı işletim sistemi. Bunu yapmanın en iyi yolu tam destek sunmaktır – Favicons ICO, Favicons PNG, Apple Touch Icon ve Windows 8 karo grafikleri. Site ziyaretçilerinizin cihazları için favicon’unuzun en uygun sürümünü gördüğünden emin olmak için bunu yapmak. Basitlik uğruna, bir sonraki bölümde, standart bir favicon nasıl yapılacağını göstereceğiz. Hangi dosya biçimini kullanmalısınız? Yapılacak en iyi şey ICO ve PNG kullanmaktır. Bir yandan, PNG hemen hemen tüm görüntü düzenleme yazılımlarında kolayca yapılır ve ‘gelecek’ favicon’u temsil eder. Öte yandan, ICO kullanıcı dostu olmasa da, birkaç dosya boyutu ve şeffaflığa izin verir.
Profesyonel görüntü düzenleme araçlarına aşina iseniz, en iyisi Favicon’unuzun bir ICO ve PNG sürümünü oluşturmaktır. Tek yapmanız gereken PNG Favicon’u etiketinde bildirmek ve ICO Favicon’u Favicon.ico dosyasındaki web sitenizin kök dizinine kaydetmektir. (Daha sonra WordPress sitenize bir favicon nasıl uygulanacağına dair adımlarımız var.) Web siteniz için bir favicon nasıl yapılır bir favicon oluşturmak için birçok seçenek var. Belki de en hızlı ve en kolay olanı, bir favicon jeneratörü (tüm kalbimle tavsiye ettiğimiz) gibi çevrimiçi bir favicon editörüdür. Buna ek olarak, her zaman popüler olan (ve ücretsiz!) Gimp’ten bahsetmiyorum bile, iyi bir eski Adobe Photoshop’unuz var. Aşağıdaki adımlar, GIMP kullanarak web siteniz için nasıl bir favicon oluşturabileceğinizi içerir.
GIMP’yi başlatarak ve Dosya> Yeni için Gezi Yaparak Yeni Bir Dosya Oluşturarak Başlayın:
Tuvali 72 piksel/inç çözünürlükle 512px kez 512 piksel olarak ayarlayın. Renk alanının şeffaflıkla dolu RGB ve tuval renklerine göre düzenlendiğinden emin olun.
Favicon’unuzu tuval üzerine tasarlayın, Favicon’un tüm tuvalle buluştuğundan emin olun (yani çok fazla beyaz alan bırakmayın). Tasarımınız hazır olduğunda, Dosya> Dışa Aktarma ve .ICO Uzantısını seçin. Devam etmek için dışa aktar düğmesine tıklayın. Favicon’u bir ICO dosyası olarak kaydetmek ek bir avantaja sahiptir, çünkü birkaç resim içerir ve tarayıcı boyutları otomatik olarak ona erişen cihaz veya işletim sistemine göre en uygun boyutu sunacaktır. Sadece bu! Artık favicon’unuz yapıldığına ve kullanıma hazır olduğuna göre, geriye kalan şey onu WordPress web sitenize yüklemektir.
Favicon’u WordPress yükleme favicon’a web sitenize eklemenin 3 yolu kolay bir parçadır. Ayarlarınıza bağlı olarak aşağıda listelenen üç yöntemden birini takip etmelisiniz. Seçenek 1: Favicon’u WordPress Ayarlaması aracılığıyla yükleyin (Not: Tüm temaların Favicons’u yükleme seçeneği yoktur. Değilse, başka bir yöntemi takip edebilirsiniz.) WordPress Yönetici Panelini girin ve görünüm> Özelleştir. Ardından, Site Kimliği> Site simgesini seçin ve Resim Seç düğmesini tıklayın. Favicon dosyasını seçtikten sonra Seç düğmesini tıklayın. Favicon’unuz Site Kimlik Bölümündeki Site simgesinin gölgelik altında görünecektir: Kaydet ve Yayın düğmesini tıklayın. Seçenek 2: Favicon’u tema seçeneğiniz üzerinden yükleyin (Not: Tüm temaların varsayılan tema seçeneği paneline sahip değil. Mülkünüz değilse, başka bir yöntemi takip edebilirsiniz.) Birçok tema (özellikle premium çeşitler) web sitesi sahiplerinin favicons yüklemesine izin verin Tema seçeneği sayfası aracılığıyla. Örneğin, Divi’nin tema seçeneği paneli üzerinden bir favicon yükleme seçeneği vardır:
Bu işlevin sizin için mevcut olup olmadığını bulmak için tema belgelerinize başvurun (veya varsa opsiyon paneli üzerinden biraz kazı yapın). Seçenek 3: Bir eklenti kullanın, temanız varsayılan WordPress’in ayarlanması yoluyla bir favicon yüklemenize izin vermiyorsa veya varsayılan tema seçenek paneline sahipse, bunun yerine eklentiyi kullanabilirsiniz. Hepsi One Favicon ve Favicon Rotator gibi birkaç eklenti var. Ancak, aşağıdaki seçimimize odaklanacağız – RealFaviconGenerator tarafından Favicon – aşağıda. RealFaviconGenerator by Favicon, web sitesi sahiplerinin favicon’larını oluşturmasına ve yüklemelerini sağlayan ücretsiz bir WordPress eklentisidir. Eklenti, iOS, Android ve Windows 8 mobil cihazlara ek olarak Favicon’unuzun PC ve MAC makinelerinde en uygun şekilde görülmesini sağlar. Eklentiyi etkinleştirdikten sonra, bir favicon görüntü dosyası yüklemek için görünüm> favicon’a gidin: Devam etmek için Favicon Oluştur düğmesini tıklayın. Aygıt düzeyinde yapılandırma seçeneklerini ayarlamanıza izin veren ekrana yönlendirileceksiniz: Ayarları yapılandırdıktan sonra, aşağı kaydırın ve Favicons ve HTML Kodu Oluştur düğmesini oluşturun:Sadece bu! Favicon’un önizlemesini aşağıdaki ekranda farklı bir cihazda görebilirsiniz. Sonuç Favicon, sitenizin en önemli marka görüntüleme unsuru olmayabilir, ancak hızlı ve kolay uygulanması ve faydalar sunması olabilir. Sitenize kalabalık tarayıcı penceresinde görünmesi için gereken ekstra ruhu verecektir. Bu öğreticiyi okuduktan sonra, daha da ileri gitmek için daha iyi bir konumdasınız. Bu yazıda tartıştığımız ana noktaları hızlı bir şekilde özetleyelim: Hangi biçim ve dosya boyutuna ihtiyacınız olduğuna karar vererek başlayın. Bir favicon jeneratörü veya profesyonel görüntü düzenleme aracı kullanarak favicon’unuzu oluşturun. Tartıştığımız üç yöntemden birini kullanarak favicon’unuzu WordPress’e yükleyin. Favicon’unuzu yapabilir ve yükleyebilir misiniz? Aşağıdaki yorumlar bölümünden bize ulaşın ve bize söyleyin! Kredi görüntüsü: Geralt.