Tapi bagaimana kalau dibuka menggunakan komputer yang tidak terinstall font yang kita pakai, atau bagaimana kalau dibuka pakai handphone? Tampilannya apakah masih sesuai dengan font yang kita inginkan?
Solusinya kita gunakan web font, di sini akan saya bahas open font library yang font nya juga masih berformat ttf.
Untuk memilih font yang kita inginkan, langsung saja menuju ke openfontlibrary.org
Sebagai contoh kita pilih font Strato, maka di bagian header html harus kita tambahkan kode berikut ini:
kemudian di bagian css kita tambahkan font-family: 'Strato';
contoh kita bikin class unik
.unik {
font-family: 'Strato';
font-weight: normal;
font-style: normal;
}dan untuk penggunaanya semacam ini:
<span class="unik;">Ini contoh tulisan menggunakan Web Font</span>
dan hasilnya jadi seperti ini:
Ini contoh tulisan menggunakan Web Font
Font dari open font library ini bisa kita gunakan secara langsung seperti contoh di atas, dan bisa dengan cara kita download kemudian kita upload ke server kita sendiri.
Untuk yang upload sendiri, kita gak perlu lagi pakai rel stylesheet seperti di atas. tapi kita harus menambahkan kode berikut ini di stylesheet (css) kita:
@font-face {
font-family: 'nama fontnya';
src: url('filefontnya.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
Silakan mencoba.
Mudah-mudahan penjelasanku ini bisa mudah dipahami.
Web font ini sudah saya test di komputer berjalan bagus, untuk HP Android pakai browser bawaan HP dan opera mobile juga bagus.
Tapi untuk browser ucweb font nya tetap font ucweb. Berarti ucweb gak bagus ya? :)
Sepertinya ucweb gak support truetype font, bagi pengguna ucweb silakan tunggu update ucweb yang support truetype font. Tapi entah kapan mau dirilisnya hehe....