Panduan Menggunakan Google Fonts
14 September 2016 | Tags: Google Fonts, Panduan Google Fonts
Pada awalnya, halaman web selalu tampil dengan font Arial, Verdana, Tahoma, San Serif dan beberapa font standar lainnya. Untuk memastikan kompatibilitas bagi semua pengguna, web designer terpaksa membatasi pilihan Font yang umum dipakai. Jika ingin menampilkan font tertentu yang tidak disupport oleh mesin, maka terpaksa memakai image atau gambar. Tentunya ini bukan pilihan yang efektif.
Untuk mengakomodasi keinginan web designer atau web master, Google tampil dengan layanan mereka Google Fonts. Tersedia banyak koleksi font indah yang bisa anda pilih, dan hebatnya lagi itu gratis. Dengan Google Fonts akan membantu membuat halaman web terlihat lebih indah dan menarik
Berikut Panduan menggunakan Google Fonts:
- Buat halaman web sederhana
- Buka koleksi Google Fonts disini. Dan Pilih jenis font yang anda inginkan.
- Setelah anda memilih salah satu jenis Font, maka akan muncul kotak hitam dibawah kanan bertuliskan Family Selected. Klik tanda minus untuk memunculkan panduan cara menggunakan Google Fonts tersebut.
- Untuk deklarasi style tinggal anda copy paste:
<style> @import 'https://fonts.googleapis.com/css?family=Roboto'; </style>
Pada bagian diantara tag…
- Jika anda ingin menggunakan font pada elemen tertentu tinggal ketikkan:
body { font-family: 'Roboto', sans-serif; } - Contoh kode selengkapnya:
<html>
<html>
<head>
<style>
@import 'https://fonts.googleapis.com/css?family=Roboto';
body {
font-family: 'Roboto', sans-serif;
font-size: 48px;
}
</style>
</head>
<body>
<div>Making the Web Beautiful!</div>
</body>
</html>
</html>
Dengan menggunakan Google Fonts, maka typography web menjadi kaya pilihan. Selamat mencoba
Komentar tentang Panduan Menggunakan Google Fonts