Ada 2 metode yang dapat Anda gunakan untuk menanamkan font Ubuntu di situs web Anda - menggunakan Google Font Directory (lebih disukai) atau menggunakan @font-face
deklarasi CSS dan mengonversi font Anda secara manual.
Menggunakan Google Webfonts
Anda sekarang dapat menggunakan font Ubuntu sebagai font web Google. Ini akan membuat prosesnya jauh lebih sederhana. Sebagian besar isi dari bagian jawaban ini berasal dari jawaban sladen .
Mengapa menggunakan Google Font API metode yang disukai?
Menggunakan Google Font API adalah saran yang sangat baik karena memungkinkan webfonts untuk secara otomatis bekerja di semua browser modern tanpa harus khawatir tentang detailnya. Menggunakan font API berarti pengunjung akan selalu melihat versi terbaru dari jenis huruf secara otomatis.
Bagaimana saya bisa menggunakan Google Font API?
Sejak 21 Desember 2010 Keluarga Font Ubuntu sekarang termasuk dan dapat digunakan dari Google Font API, kunjungi:
Anda dapat membaca posting Google Web Font tentang berita, dan kemudian:
- Buka Direktori Google Font: " Ubuntu - Gunakan font ini "
Centang kombinasi bobot dan gaya dari Biasa, Miring, Tebal, dan Tebal-Miring yang Anda butuhkan untuk halaman web Anda.
Jika standarnya salah, pilih kombinasi bahasa / skrip yang Anda butuhkan: situs web Rusia dengan contoh bahasa Inggris mungkin menggunakan "Cyrillic, Latin".
Tambahkan <link>
tag yang diberikan <head> ... </head>
di antara di halaman HTML Anda atau template dan tambahkan kode CSS yang sesuai di antara <style> ... </style>
tag di Anda <head>
.
Misalnya, jika Anda membuat situs web hybrid Rusia / Inggris dan ingin menggunakan font sebagai default untuk semua teks, Anda bisa menambahkan kode berikut di antara <head>
tag Anda :
<link href='http://fonts.googleapis.com/css?family=Ubuntu&subset=cyrillic,latin' rel='stylesheet' type='text/css' />
<style type="text/css" >
body {
font-family : 'Ubuntu', sans-serif;
}
</style>
Catatan :
"Latin" adalah naskah tempat bahasa Inggris dan banyak bahasa Eropa dan Afrika lainnya ditulis.
"Berlangganan" mengoptimalkan file font dengan hanya mengirim karakter untuk bahasa tertentu, font masing-masing sekitar 44 kB. Angka 168 kB yang ditampilkan saat ini adalah untuk semua 1.200+ mesin terbang sebagai unduhan font web tunggal — dan sebagian besar tidak diperlukan untuk satu situs web.
File font Ubuntu secara otomatis dikonversi dalam format yang benar untuk berbagai browser; tergantung pada membuat dan versi format yang diperlukan adalah WOFF
, EOT
, SVG
atau TTF
. Kombinasi CSS yang tepat adalah spesifik untuk setiap permintaan halaman dan secara ajaib menyelesaikan masalah sulit ini.
Menggunakan @ font-face
Anda dapat menanamkan font Ubuntu dengan mengonversinya menjadi font WOFF . Anda kemudian dapat menanamkannya menggunakan deklarasi CSS-font-face @. Font (file .ttf) dapat ditemukan di /usr/share/fonts/truetype/ubuntu-font-family
.
Misalnya, untuk menggunakan font Regular Ubuntu, dikonversi ke file WOFF, Ubuntu-R.woff, gunakan kode CSS ini:
@font-face
{
font-family : "Ubuntu-R";
src: url('Ubuntu-R.woff');
}
Demikian pula untuk Ubuntu Bold:
@font-face
{
font-family : "Ubuntu";
src: url('Ubuntu-B.woff');
font-weight : bold;
}
Ubuntu Italic:
@font-face
{
font-family : "Ubuntu";
src: url('Ubuntu-I.woff');
font-style : italic;
}
Ubuntu Bold Italic:
@font-face
{
font-family : "Ubuntu";
src: url('Ubuntu-BI.woff');
font-weight : bold;
font-style : italic;
}
Ini didukung oleh semua browser terbaru .
Pertimbangan
Harap diingat bahwa beberapa pengguna mengatur browser mereka untuk menggunakan serangkaian font tertentu dan mungkin terganggu jika font khusus digunakan. Juga, baca Lisensi Font Ubuntu untuk ketentuan yang tepat tentang bagaimana font dapat didistribusikan.