Simge Yazı Tipleri: Harika Yazı Tiplerinin Artıları ve Eksileri

Simge yazı tipleri, web sitenizin içeriğine belirli standart simgeleri eklemek için kullanılır. NS Yazı tipi 'Harika' diğer simge yazı tiplerine göre birçok avantaj sunan iyi bir örnektir. Ayrıca kullanmanızı öneririz Simge yazı tipleri Freepik'ten iyi bir alternatif olarak.

Font Awesome, orijinal olarak tarafından tasarlanmıştır. Dave Gandy Ile kullanmak için Twitter Önyükleme. Font Awesome, WordPress ile birlikte kullanılabilir. Yazı Tipi Harika Simgeler eklentisi tarafından dizayn edilmiştir Rachel Baker.

İşte bu tür yazı tiplerine ve Müthiş yazı tipinin hâlâ emekleme aşamasında olabilecek bir stile uyduğu yerlere kısa bir giriş.

Simge Yazı Tiplerini Neden Kullanmalısınız?

Bir web sitesi tasarladığınızda, resimler dosya boyutları nedeniyle çok fazla web alanı kaplar. Ayrıca HTML işaretlemesi kullanılarak web sayfalarınıza çağrılmaları gerekir. Sadece bu da değil, ölçeklenmeleri genellikle bir sorundur ve boyutları büyüdükçe tanımlarını kaybederler. Normal bir görüntü, yalnızca orijinal olarak tasarlanmış boyutlarında kullanıldığında amaçlandığı gibi çözülür.

Araçlar, belirli noktalama işaretleri veya grafik grafik simgeleri gibi standart simge görüntüleri ararken, simge yazı tipleri, yazı tipi boyutundan bağımsız olarak aynı görünen ölçeklenebilir görüntüler sunabilir. Bu, 2 veya 5 punto veya 10 veya 24 punto yazı tipi kullanmanızdan bağımsız olarak harfler ve sayıların aynı görünmesi gibidir.

Çoğu durumda, insanlar bu sorun nedeniyle görselleri kullanmazlar ve makaleleri veya çevrimiçi raporları bu nedenle ayrıntı veya netlikten zarar görür. Harika Font'u kullanarak sitelerine temel simgeler ekleyebilir ve bunları yalnızca belgelerinin boyutlarıyla sınırlı olmak üzere gereken boyuta ölçekleyebilirler ve bunu tanımlarını kaybetmeden yapabilirler. Ölçeklenebilir simgelere, ölçeklenebilir yazı tipi karakterleriyle aynı şekilde bakabilirsiniz.

İşte mevcut video oynatıcı ve sosyal simgelerden bir seçki:

Ayrıca 3.0 sürümüyle gelen yeni simgeler:

Bunların her biri, tanımda herhangi bir kayıp olmaksızın boyut olarak arttırılabilir. Renklerini değiştirebilir ve kolayca gölgeler ekleyebilir ve şeffaflıklarını değiştirebilirsiniz. Aslında, onlarla resimlerle yapabileceğiniz her şeyi yapabilirsiniz ve daha sonra bazılarını dosya boyutunun dezavantajları olmadan yapabilirsiniz.

Temel olarak simge yazı tiplerinin ve özellikle de Müthiş yazı tipinin yapabileceği şey budur. Bunların nasıl kullanılacağına ve bunlardan en iyi şekilde nasıl yararlanılacağına dair bazı bilgiler ve ayrıca simge cepheleriyle ilgili bir veya iki dezavantaj:

Harika Yazı Tipini Kullanma

Normal Bootstrap CSS ile:

Müthiş Font, projenize Awesome font dizinini kopyalayarak ve ardından font-awesome.min.css dosyasını projeye kopyalayarak varsayılan Bootstrap CSS ile kullanılabilir. Ardından font-awesome.min.css dosyasını açmalı ve yazı tipi yollarını Harika konumunu işaret etmelerini sağlayacak şekilde düzenlemelisiniz.

HTML'nizin Head bölümünde font-awesome.min.css dosyasının konumuna şu şekilde atıfta bulunulmalıdır:

Yazı tipi yolu, CSS dizininizden görecelidir.

Önyükleme Daha Az ile:

LESS CSS ile Twitter Bootstrap kullanıyorsanız, önce Font Awesome font dizinini projenize ve font-awesome-less'ı Bootstrap Less dizininize kopyalayın. Sonra:

• a) bootstrap.less dosyasını açın ve @import “sprites.less” ile değiştirin; @import “font-awesome.less” ile;
• b) Projenizin font-awesome.less dosyasını açın ve yazı tipi dizininizi gösterecek şekilde @FontAwesomePath değişkenini düzenleyin.

@FontAwesomePath: "../font";

Yazı tipi yolu, derlenmiş CSS dizininizden görecelidir.

O zaman hazırsınız - ancak statik bir derleyici kullanıyorsanız LESS'i yeniden derlemelisiniz.

Bootstrap Kullanmamak:

Bootstrap kullanmıyorsanız, font dosyasını proje dizininize kopyaladıktan sonra, iki font-awesome dosyasından birini projenize kopyalayabilir, onu açabilir ve font dizinini gösterecek şekilde fontun konumunu düzenleyebilirsiniz.

Internet Explorer 7 kullanıyorsanız, font-awesome-ie7.min.css kullanın

WordPress'te Harika Yazı Tipi Nasıl Kullanılır

Eklentiyi yüklediğiniz WordPress'te simge yazı tiplerini kullanmanın iki kolay yolu vardır*. Bunları HTML kullanarak gömebilir veya kısa kod kullanabilirsiniz. İşte her birine örnekler:

HTML'yi kullanma: Yazı tipinin görünmesini istediğiniz yerde, öğenin adını sınıf adına eklemeniz yeterlidir: [html] [/html]
siyah bir daire ekleyecektir.

Dairenin boyutunu şu şekilde değiştirebilirsiniz:

Aynı boyutta simgeyi ve istisnalar için yukarıdaki formatı sık sık kullanmayı düşünüyorsanız, yazı tipi boyutunu CSS stil sayfanıza eklemeyi muhtemelen daha kolay bulacaksınız.

Kısa Kodu Kullanma: Kısa kod daha kolaydır, ancak genellikle yalnızca yazı düzenleyici ekranındaki yazı ve sayfa içeriği için çalışır. Biçim, daireyi istediğiniz yerde [icon name=icon-circle] şeklindedir.

Simge Yazı Tiplerinin Dezavantajı

Blogunuza veya web sitenize belirli bir simge eklemeniz gerektiğinde simge yazı tiplerini kullanmak harika görünüyor ve belirli işlevleri yerine getirmek için birbirine bağlanabilirler. Ancak, her şey mükemmel değildir ve simge yazı tiplerinin dezavantajları da vardır. Bunlar, Font Awesome için geçerli olmayan simge yazı tiplerinin kullanıcıları tarafından bildirilen yaygın sorunlardır - bu yüzden bu kadar 'Harika!'

1. Biri, simgeyi yüksek sesle alfabetik bir harf olarak okuyabilen ekran okuyucularla ilgili olası sorundur. Font karakterlerinin alınma şekli nedeniyle bu, Font Awesome ile ilgili bir sorun değildir.
2. Yalnızca tek bir renkte veya CSS3 gradyanları kullanılarak bir renk gradyanında sunulabilirler. Bu, simge yazı tipleriyle ilgili gerçek bir sorun mu?
3. İhtiyaçlarınıza uygun özel bir yazı tipi oluşturmak zaman alabilir. Bununla birlikte, Font Awesome tarafından sunulan çok sayıda harika yazı tipi var ve liste sürekli olarak genişletiliyor. Ücretsiz kapalı kaynak font olmasına rağmen, kullanıcılar tarafından tasarlanan onaylı fontlar düzenli olarak eklenmektedir.

Font Müthiş Jeneratör Özeti

Harika Yazı Tipi oluşturucu, şu anda mevcut olan en iyi ücretsiz simge yazı tiplerinden biridir. Twitter Bootstrap ile kullanılmak üzere tasarlanmış olmasına rağmen, normal web sitelerinde kullanım için uyarlanabilir ve ayrıca bu simge yazı tipinin en iyisini sunan bir WordPress eklentisi de mevcuttur. Simge yazı tiplerini kullanıyorsanız, Harika Yazı Tipini bir deneyin çünkü ustalaştıktan sonra hoş bir şekilde şaşırabilirsiniz.

* Font Müthiş Simgeler WordPress eklentisi https://github.com/rachelbaker/ adresinde mevcuttur.