Klasifikasi font generik tersedia untuk digunakan di situs web Anda
Saat mendesain situs web, salah satu elemen kunci dari sebuah halaman yang akan Anda gunakan adalah konten teks. Dengan demikian, ketika Anda membangun laman web dan memberinya gaya dengan CSS, sebagian besar dari upaya itu akan berpusat di sekitar tipografi situs.
Desain tipografi memainkan peran penting dalam desain situs web. Teks yang ditata dengan baik dan format konten membantu sebuah situs menjadi lebih sukses dengan menciptakan pengalaman membaca yang menyenangkan dan mudah untuk dikonsumsi. Bagian dari upaya Anda dalam bekerja dengan jenis adalah memilih font yang tepat untuk desain Anda dan kemudian menggunakan CSS untuk menambahkan font dan gaya font ke tampilan halaman. Ini dilakukan dengan menggunakan apa yang disebut " font-stack "
Font-Tumpukan
Ketika Anda menentukan font untuk digunakan pada halaman web, itu adalah praktik terbaik untuk juga menyertakan opsi fallback jika pilihan font Anda tidak dapat ditemukan. Opsi-opsi fallback ini disajikan dalam "tumpukan font." Jika browser tidak dapat menemukan font pertama yang tercantum dalam tumpukan, itu akan berpindah ke yang berikutnya. Ini melanjutkan proses ini sampai menemukan font yang dapat digunakan, atau kehabisan pilihan (dalam hal ini hanya memilih font sistem yang diinginkannya). Berikut ini contoh bagaimana tumpukan font akan terlihat dalam CSS ketika diterapkan ke elemen "body":
body {font-family: Georgia, "Times New Roman", serif; }Perhatikan bahwa kita menentukan font Georgia terlebih dahulu. Secara default, ini adalah apa halaman yang akan digunakan, tetapi jika font tersebut tidak tersedia karena alasan tertentu, halaman akan mundur ke Times New Roman. Kami melampirkan nama font itu dalam tanda kutip ganda karena itu adalah nama multi-kata. Nama-nama font kata tunggal, seperti Georgia atau Arial, tidak memerlukan tanda kutip, tetapi nama font multi-kata membutuhkannya sehingga peramban mengetahui bahwa semua kata itu membentuk nama font.
Jika Anda melihat akhir tumpukan font, Anda harus memperhatikan bahwa kita mengakhiri dengan kata "serif". Itu adalah nama keluarga font generik. Dalam kejadian yang tidak mungkin bahwa seseorang tidak memiliki Georgia atau Times New Roman di komputer mereka, situs tersebut akan menggunakan font serif apa pun yang dapat ditemukannya. Ini lebih disukai untuk memungkinkan situs untuk mundur ke font apa pun yang diinginkan, karena setidaknya Anda dapat mengetahui jenis huruf apa yang digunakan sehingga tampilan keseluruhan dan nada desain situs akan seutuhnya mungkin. Ya, browser akan memilih font untuk Anda, tetapi setidaknya Anda memberikan panduan sehingga tahu jenis font apa yang paling cocok dalam desain.
Keluarga Font Generik
Nama font generik yang tersedia dalam CSS adalah:
- kursif
- fantasi
- monospace
- serif
- Sans Serif
Meskipun ada banyak klasifikasi font lain yang tersedia dalam desain web dan tipografi, termasuk slab-serif, blackletter, tampilan, grunge, dan banyak lagi, 5 nama font generik yang tercantum di atas ini adalah nama-nama yang akan Anda gunakan dalam font-stack di CSS. Apa perbedaan klasifikasi font ini? Mari lihat!
Huruf kursif sering kali memiliki bentuk surat yang tipis dan hiasan yang dimaksudkan untuk mereplikasi teks tulisan tangan yang mewah. Font-font ini, karena hurufnya yang tipis dan berbunga, tidak sesuai untuk blok besar konten seperti body copy. Font kursif umumnya digunakan untuk judul dan kebutuhan teks yang lebih pendek yang dapat ditampilkan dalam ukuran font yang lebih besar.
Font fantasi adalah font yang agak gila yang tidak benar-benar masuk dalam kategori lain. Font yang mereplikasi logo terkenal, seperti bentuk huruf dari film Harry Potter atau Back to the Future, akan masuk dalam kategori ini. Sekali lagi, font-font ini tidak sesuai untuk konten tubuh karena mereka sering begitu bergaya sehingga membaca bagian teks yang ditulis dalam font ini terlalu sulit untuk dilakukan.
Font monospace adalah tempat di mana semua bentuk huruf berukuran sama dan diberi jarak, seperti yang Anda temukan pada mesin tik tua. Tidak seperti font lain yang memiliki lebar variabel untuk huruf tergantung pada ukurannya (misalnya, modal "W" akan mengambil lebih banyak ruang daripada huruf kecil "i"), font monospace adalah lebar tetap untuk semua karakter. Font ini sering digunakan ketika kode ditampilkan pada halaman karena mereka terlihat sangat berbeda dari teks lain di halaman itu.
Font Serif adalah salah satu klasifikasi yang lebih populer. Ini adalah font yang memiliki ligatures ekstra pada bentuk huruf. Potongan ekstra itu disebut "serif". Font serif umum adalah Georgia dan Times New Roman. Font Serif dapat digunakan untuk teks besar seperti heading serta bagian panjang teks dan body copy.
Sans-serif adalah klasifikasi terakhir yang akan kita lihat. Ini adalah font yang tidak memiliki ligatures tersebut. Namanya berarti "tanpa serif". Font populer dalam kategori ini adalah Arial atau Helvetica. Serupa dengan serif, font sans-serif dapat digunakan sama baiknya dalam pos dan konten tubuh.
Artikel asli oleh Jennifer Krynin. Diedit oleh Jeremy Girard pada 10/16/17