Bu dersimizde google font apiyi tanıtacam ve font-faceden farkını söyleycem.Google font api sayesinde sitemizde değişik fontlar kullanabiliyoruz.Ama googlenin arşivinde bulunan fontları kullanabiliyoruz.
Font face yerine neden google apiyi kullanmalıyız derseniz hız faktörü için.Bizim sunucumuzda bulunan fontlar ülke dışlarından giren kişilerde yavaş yüklecektir.Google font apiyle bu hız sorunu olmayacaktır.
Şimdi fontlara bakalım.
1-
http://www.google.com/fonts/ bu adresten fontunuzu seçin.
2-Quick-useye tıklayın(sağa bakan ok)
3-Gelen sayfada
Latin Extended (latin-ext) e tik işareti koyun.Sebebi türkçe karekterleride desteklemesi için.
4-Daha sonra hemen altta bir kod verecek bunu fontu kullanacağınız sayfada head tagı içine yazacağız.
Kod şu gibi olacaktır.
<link href='http://fonts.googleapis.com/css?family=Happy+Monkey&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
5-Hemen biraz altta bir kod daha olacak oda fontumuzu uygulayacağımız objenin css ine yapıştıracağız.
font-family: 'Happy Monkey', cursive;
Genel Örnek:
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>cArleone</title>
<link href='http://fonts.googleapis.com/css?family=Happy+Monkey&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
<style type="text/css">
.yazi{font-family: 'Happy Monkey', cursive;font-size:30px;}
</style>
</head>
<body>
<div class="yazi">cArleone</div>
</body>
</html>
Görüntüsü :
UstaDerslik
