Google Web Fontları Nasıl Kullanılır?

Temmuz 2011
YouTube'ta Takip Et

Web fontları, web tasarımcıların en çok tercih ettiği font türüdür. Web fontlarıyla hazırlanmış bir sitenin çevirisi yapılabilir, metin seçilebilir, herhangi bir olumsuz görüntü elde etmeden zoom yapılabilir, etkileyicidir ve avantajı grafik fontlara göre fazladır. En önemlisi web fontları Google tarafından bir metin olarak okunmasından dolayı SEO’ya da etkisi vardır.

Google Font Kullanımı

Google Fonts sayfasına giderek başlıklarda ya da metinlerde kullanmak istediğimiz fontu seçelim ve font alanın sol altındaki ileri ikonuna tıklayalım.

Her fontun sağ üst köşesinde kırmızı renkte bir artı işareti görürsünüz. Google Web fontları arasında kullanmak istediğiniz fontu ya da fontları bu şekilde ekleyin. En fazla iki fontu eklemenizi öneririm, daha fazlası web sitenizi yavaşlatabilir.

Fontumuzu ekledikten sonra aşağıda çıkan siyah renkteki Families Selected barına tıklayalım. Bir pencere açılacaktır. Bu pencerede head tag’inize eklemeniz gereken kodu görebilirsiniz. Link ile başlayan kod head kodları arasında eklenmelidir.

Bir başlığa ya da bir yazıya bu fontlardan birini kullanmasını ifade etmek için CSS kodu eklemeniz gerekir. Başlık ya da yazının class, id ya da style etiketine de Specify in CSS alanındaki kodları ekleyerek, ilgili metnin Google Web Font kullanmasını istediğimizi açıklamış oluruz. Örnek olaran stil dosyamızda h1 etiketine bu fontu uygulamak isteyelim.

h1 etiketine sahip yerler Roboto yazı karakterine dönüşecektir. Google Web fontlarının Türkçe’yi destekleyen karakterleri de bulunduğu için web sitenizi tasarlarken hem başlık, hem de içerikler için güzel sonuçlar elde edebilirsiniz.

Gözden kaçırdığım veya eklemek istediğiniz bir şey olursa yorum kısmına yazabilirsiniz.