Web Safe Font - recommended
Web Safe Font
Kenapa dikatakan Web safe font ?
Saya pribadi mengartikan sebagai
Font Web Ringan seperti judul diatas.
Menurut beberapa sumber,
Web Safe Font ini adalah jenis Font yang kompatibel dibanyak perangkat dan browser.
Font gagal muat / tidak kompatibel :
☐☐☐☐ <------> ⛝⛝⛝⛝
Kompatibel dalam arti mudah terbaca dan pemasangannya tidak memerlukan link yang juga harus dipasang dalam template hanya untuk mendukung style karakter font itu sendiri.
Yang biasanya link tersebut justru menyebabkan hambatan pada saat halaman dirender.
Lihat Screenshot
Berikut ini beberapa jenis web safe font yang direkomendasikan.
Penulisan dalam CSS :
<style>
.selector {font-family:'Arial',sans-serif;}
.selector {font-family:'Verdana',sans-serif;}
.selector {font-family:'Helvetica',sans-serif;}
.selector {font-family:'Tahoma',sans-serif;}
.selector {font-family:'Trebuchet MS',sans-serif;}
.selector {font-family:'Times New Roman',serif;}
.selector {font-family:'Georgia',serif;}
.selector {font-family:'Garamond',serif;}
.selector {font-family:'Courier New',monospace;}
.selector {font-family:'Brush Script',cursive}
</style>
Penjelasan penulisan CSS :
.selector {font-family:'Font Target ',fallback-font ;}
selector : tag HTML / element yang ditarget
font-family : atribut element
Font Target : Nama font target
fallback-font : nama font cadangan
Pengertian Fallback font
Fallback font berperan sebagai cadangan apabila dalam kondisi tertentu font target bermasalah maka yang akan ditampilkan adalah fallback font ini
Masalah yang sering ditemui pada font target umumnya bisa disebabkan karena pemasangan jenis pada font tertentu yang mungkin kurang tepat, atau font tidak ditemukan sehingga berubah bentuk tidak dapat ditampilkan. Disitulah fallback font berperan menggantikan font target.
Jenis font yang sering berfungsi sebagai fallback adalah :
Serif :
("Times New Roman", Times, serif) ,
(Georgia, serif) ,
(Garamond, serif)
Sans-serif :
(Arial, Helvetica, sans-serif) ,
(Tahoma, Verdana, sans-serif) ,
("Trebuchet MS", Helvetica, sans-serif) ,
(Geneva, Verdana, sans-serif)
Monospace : ("Courier New", Courier, monospace)
Cursive : ("Brush Script MT", cursive)
Fantasy : (Copperplate, Papyrus, fantasy)
Arial (sans-serif)
ABCDEFGHIJ KLMNOPQRS
abcdefghij klmnopqrs
abcdefghij klmnopqrs
abcdefghij klmnopqrs
12345 67890
Verdana (sans-serif)
ABCDEFGHIJ KLMNOPQRS
abcdefghij klmnopqrs
abcdefghij klmnopqrs
abcdefghij klmnopqrs
12345 67890
Helvetica (sans-serif)
ABCDEFGHIJ KLMNOPQRS
abcdefghij klmnopqrs
abcdefghij klmnopqrs
abcdefghij klmnopqrs
12345 67890
Tahoma (sans-serif)
ABCDEFGHIJ KLMNOPQRS
abcdefghij klmnopqrs
abcdefghij klmnopqrs
abcdefghij klmnopqrs
12345 67890
Trebuchet MS (sans-serif)
ABCDEFGHIJ KLMNOPQRS
abcdefghij klmnopqrs
abcdefghij klmnopqrs
abcdefghij klmnopqrs
12345 67890
Times New Roman (serif)
ABCDEFGHIJ KLMNOPQRS
abcdefghij klmnopqrs
abcdefghij klmnopqrs
abcdefghij klmnopqrs
12345 67890
Georgia (serif)
ABCDEFGHIJ KLMNOPQRS
abcdefghij klmnopqrs
abcdefghij klmnopqrs
abcdefghij klmnopqrs
12345 67890
Garamond (serif)
ABCDEFGHIJ KLMNOPQRS
abcdefghij klmnopqrs
abcdefghij klmnopqrs
abcdefghij klmnopqrs
12345 67890
Courier New (monospace)
ABCDEFGHIJ KLMNOPQRS
abcdefghij klmnopqrs
abcdefghij klmnopqrs
abcdefghij klmnopqrs
12345 67890
Brush Script MT (cursive)
ABCDEFGHIJ KLMNOPQRS
abcdefghij klmnopqrs
abcdefghij klmnopqrs
abcdefghij klmnopqrs
12345 67890