Cara Mengubah Link Google Font Menjadi CSS Valid HTML5

Font biasa kita gunakan pada tulisan-tulisan, misalnya tulisan pada blog ini, di blog ini ada dua macam font yaitu Oswald dan Arial. Terlalu banyak font sangat berpengaruh terhadap kecepatan loading font, lebih baik kita memilih font yang sedikit daripada semua font kita borong dan blog kita akan menjadi sangat berat. Kebanyakan orang memasang font pada css menggunakan seperti ini <link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>, padahal itu tidak valid html5.

Ikuti langkah-langkah di bawah ini:

1. Cari link Google Font lalu buka link pada google font itu, seperti ini

<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>

• Buka link yang berwarna kuning

2. Lalu anda akan melihat script seperti di bawah ini

@font-face {
font-family: 'Oswald';
font-style: normal;
font-weight: 400;
src: local('Oswald Regular'), local('Oswald-Regular'), url(http://themes.googleusercontent.com/static/fonts/oswald/v8/-g5pDUSRgvxvOl5u-a_WHw.woff) format('woff');
}

3. Lalu paste kan script tersebut di atas kode </style>

4. Simpan template

Selamat mencoba bagi anda yang belum mencoba, dan bagi anda yang ingin bertanya bisa ditanyakan di bawah kotak komentar di bawah ini. Semoga post ini bermanfaat bagi anda.