Panduan untuk Google Font API

Diterbitkan: 2021-08-03

Desainer web bersukacita karena web menjadi lebih estetis karena kemajuan terbaru dalam teknologi font.

Ini semua berkat sesuatu yang disebut font web, yang merupakan kumpulan alat yang dapat digunakan untuk menyematkan font pada halaman web. Mereka adalah alat penting bagi pengembang, karena memungkinkan mereka membuat situs web yang unik dan menarik. Kita tidak lagi dipaksa untuk menggunakan Ariel atau Times New Roman untuk setiap proyek web!

Panduan berikut akan memberi Anda pandangan mendalam tentang cara menggunakan Google Font API sebagai cara mengimplementasikan font web. Sumber daya ini gratis dan mudah bagi siapa saja yang memiliki akses internet, jadi sebaiknya manfaatkan alat hebat ini!

Panduan untuk Google Font API

Google Font API adalah kumpulan alat yang dapat digunakan untuk menyematkan font pada halaman web. Ini adalah alat penting bagi pengembang, karena memungkinkan mereka membuat situs web yang unik dan menarik. Google Font adalah cara cepat dan mudah untuk menambahkan font ke situs Anda tanpa harus melakukan pemrograman yang rumit. Cukup masukkan string teks dan pilih font yang ingin Anda gunakan, lalu – voila! Seketika situs web Anda diperbarui dengan tipografi yang indah.

Keuntungan Menggunakan Google Font API

Jika Anda ingin menggunakan API Font Google, ia memiliki sejumlah fitur yang sangat berguna.

Tetap Gunakan Teks HTML

Tipografi web adalah upaya yang serius, dan semakin sulit untuk mencapai keseimbangan sempurna antara estetika dan pengoptimalan mesin telusur. Untungnya, @font-face bisa membantu! Berbeda dengan penggunaan gambar atau CSS background image replacement sebagai solusi tipografi web yang lebih cantik, cara ini telah dibuktikan oleh peneliti Google sebagai SEO friendly.

Dapat Diakses Web

Tidak seperti gambar CSS, teks HTML dapat dibaca oleh pembaca layar, sehingga tidak akan memengaruhi orang yang menggunakannya.

Cepat & Mudah

Yang perlu Anda lakukan adalah mereferensikan font untuk konten Anda, dan kemudian menambahkan beberapa pengaturan CSS untuk bagaimana font tersebut akan muncul di layar. Setelah diatur, kode-kode ini juga mudah diubah! Google Font API menangani keunikan browser web, menangani banyak jenis file, dan memudahkan pemahaman @font-face.

Gratis untuk Digunakan

Font Google gratis untuk digunakan dan telah dicadangkan oleh Google. Ini berarti Anda dapat dengan percaya diri mendesain situs web Anda tanpa risiko mendapat masalah karena menggunakan font yang tidak seharusnya.

Ini bagus karena akan membuat total biaya situs web Anda tetap rendah. Jika Anda penasaran tentang berapa biaya situs web biasa, lihat artikel blog kami Berapa Biaya Situs Web Saya untuk melihat anggaran seperti apa yang harus Anda keluarkan untuk memiliki situs web yang sempurna!

Orang yang membolak-balikkan kantong di dalam ke luar

Cepat & Terpercaya

Saat browser Anda memuat halaman web, browser akan memeriksa cache pengguna untuk melihat apakah mereka memiliki font yang digunakan di situs lain. Jika demikian, maka ini akan mempercepat waktu pemuatan halaman karena font sudah tersedia di cache web mereka dan tidak perlu memuat dari server lagi.

jalan di malam hari dengan mobil melaju cepat

Sebuah Pilihan Besar

Dengan lebih dari 850 font berbeda di ujung jari Anda, Anda akan dapat menemukan font yang sempurna untuk proyek terbaru Anda. Anda dapat menggunakan Direktori Font Google untuk membuat pencarian cepat dan bebas repot.

Penggunaan Google Fonts API dapat menjadi indikator besar dari situs web yang dibuat dengan cermat! Selain itu, kami memiliki daftar 10 karakteristik lain dari desain web kelas atas yang mungkin ingin Anda tiru di situs web Anda

Bagaimana Cara Menggunakan Google Font API?

Untuk menggunakan font Google dalam dokumen HTML Anda, pertama-tama Anda perlu mereferensikan stylesheet CSS dengan menambahkannya di dalam tag <head>. Pastikan bahwa referensi ini disertakan pada setiap halaman yang Anda inginkan untuk menampilkan font. Dengan WordPress, Anda dapat melakukannya dengan menambahkan referensi ke template tema.

 <title>Home Page</title> <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=FontName"> </head>

Sekarang saatnya menggunakan CSS untuk menentukan bagaimana Anda ingin menggunakan font baru Anda. Anda akan menggunakan kode berikut jika Anda ingin semua H1 Anda memiliki font Google:

 h1 { font-family: 'FontName', serif; font-size: 12px; }

Apakah Anda memperhatikan bahwa saya juga menyertakan font serif? Saya telah melakukan ini karena disarankan untuk memiliki font fallback. Pada dasarnya, ini berarti browser akan secara otomatis menggunakan font serif jika ada masalah dengan font Google.

Alat Font Google

Platform font Google telah menciptakan banyak alat untuk memudahkan Anda. Anda dapat menggunakan Direktori Font, Pratinjau, dan Pemuat Font Web yang semuanya dikendalikan oleh Google API. Di bawah ini kami akan memberikan ikhtisar masing-masing alat secara detail sehingga siapa pun yang menyukai font dapat memulai!

Direktori Font Google

Dengan begitu banyak font untuk dipilih, mungkin sulit menemukan yang sempurna untuk proyek Anda. Untungnya Google telah menyusun daftar semua font mereka di direktori yang mudah diakses di mana Anda dapat mulai memilih font mana yang tepat untuk Anda! Saat Anda mengklik tab "Dapatkan kode", itu akan menampilkan daftar kode yang dapat disalin dan ditempel untuk membuat font ini berfungsi.

Peninjau Font Google

Dengan Google Font Previewer, Anda dapat melihat tampilan setiap font dan mengubahnya sesuai keinginan Anda. Anda memiliki berbagai pilihan dengan ukuran, gaya (varian), dan spasi!

Pemuat Font Web

Pengembang web sekarang dapat memiliki kontrol lebih besar terhadap font Google mereka dengan bantuan pustaka JavaScript. Pengembang dapat mengikat pendengar acara untuk setiap tahap dalam urutan pemuatan font dan menambahkan fungsionalitas berdasarkan apa yang terjadi pada setiap fase.

Siapa yang Membuat Font?

Google Fonts adalah proyek open source yang memberi orang kemampuan untuk menggunakan font ini secara gratis. Berbagai jenis font yang tersedia saat ini semua berkat komunitas desain di seluruh dunia dari desainer dan pengecoran tipe.

Membuat sketsa huruf A di atas kertas gambar

Apa Manfaatnya Bagi Google?

Google menyukai data! Tautan Google Fonts API dapat ditemukan di banyak situs web dan masing-masing situs mewakili peluang bagi Google untuk menambang lebih banyak data. Tapi kita bisa bersyukur bahwa pekerjaan mereka telah memecahkan masalah lain bagi pengguna internet.

Kesimpulan

Kesimpulannya, Google Font API adalah alat yang ampuh untuk pengembang dan desainer yang dapat membantu membuat situs web yang unik dan menarik. Ini juga mudah digunakan – jadi jika Anda ingin menambahkan beberapa variasi ke dalam desain situs web Anda atau bereksperimen dengan font di proyek terbaru Anda, kami sangat menyarankan Anda mencobanya!