Ada 2 metode yang dapat Anda gunakan untuk menanamkan font Ubuntu di situs web Anda - menggunakan Google Font Directory (lebih disukai) atau menggunakan @font-facedeklarasi 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, SVGatau 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.
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.
Sejak 21 Desember 2010 Keluarga Font Ubuntu sekarang termasuk dan dapat digunakan dari Google Font API, kunjungi:
Kamu bisa membaca posting Google Web Font tentang berita, dan kemudian:
<head> ... </head>dan di<style>...</style>bagian halaman atau templat HTML Anda.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,SVGatauTTF. Kombinasi CSS yang tepat adalah spesifik untuk setiap permintaan halaman dan secara ajaib menyelesaikan masalah sulit ini.sumber
Render font sisi server (mungkin lebih baik "rendering font dinamis") telah menjadi masalah yang menarik untuk waktu yang cukup lama.
Secara teknis, tampaknya logis bahwa agar mesin dapat menampilkan font tertentu, itu harus sudah diinstal secara lokal.
Di sisi lain, desain web kehilangan banyak karena harus tetap berpegang pada 'font web' dasar / terkenal.
CSS2.1 telah membuat beberapa peningkatan dengan menggunakan deklarasi aturan font-face @ .
Itu belum menjadi standar, tetapi pada akhirnya akan dengan CSS3.
Selain itu, ada beberapa metode alternatif, seperti:
Saya harap tautan yang disediakan akan memberi Anda ide yang lebih baik tentang apa yang bisa dilakukan ;-)
sumber