Untuk menggunakan penjelasan paling mendasar, tipografi adalah desain dan penggunaan tipografi sebagai sarana komunikasi. Banyak orang menganggap tipografi telah dimulai dengan Gutenberg dan pengembangan jenis bergerak, tetapi tipografi kembali lebih jauh dari itu. Cabang desain ini sebenarnya memiliki akarnya dalam bentuk huruf yang ditulis tangan.
Tipografi mencakup segala sesuatu mulai dari kaligrafi hingga jenis digital yang kita lihat hari ini di halaman web dari semua jenis. Seni tipografi juga mencakup perancang tipe yang membuat bentuk surat baru yang kemudian diubah menjadi file font yang dapat digunakan desain lain dalam pekerjaan mereka, dari karya cetak ke situs web tersebut. Berbeda dengan karya-karya itu, dasar-dasar tipografi mendukung semuanya.
Unsur-unsur Tipografi
Jika Anda pernah berbicara dengan seorang perancang web yang menggunakan tipografi dalam karyanya, Anda mungkin telah mendengar istilah "jenis huruf" dan / atau "font." Banyak orang menggunakan dua istilah ini secara bergantian, tetapi sebenarnya ada beberapa perbedaan antara dua item ini.
Typeface adalah istilah yang diberikan kepada keluarga font (seperti Helvetica Reguler, Helvetica Italic, Helvetica Black, dan Helvetica Bold). Semua versi Helvetica yang berbeda membentuk tipografi lengkap.
Font adalah istilah yang digunakan ketika seseorang mengacu hanya pada satu berat atau gaya dalam keluarga itu (seperti Helvetica Bold). Begitu banyak tipografi terdiri dari sejumlah font individual, yang semuanya mirip dan terkait tetapi berbeda dalam beberapa cara. Beberapa tipografi hanya dapat menyertakan satu huruf, sementara yang lain bisa menyertakan banyak variasi bentuk huruf yang membentuk font.
Jika ini tampak membingungkan, jangan khawatir, jika seseorang bukan ahli tipografi, mereka mungkin akan menggunakan istilah "font" terlepas dari istilah mana yang benar-benar mereka maksud, dan bahkan banyak desainer profesional menggunakan dua istilah ini secara bergantian. Kecuali Anda berbicara kepada desainer tipe murni tentang mekanika pesawat, Anda mungkin cukup aman menggunakan salah satu dari dua istilah yang Anda inginkan. Itu dikatakan, jika Anda memahami perbedaan dan benar-benar dapat menggunakan istilah yang benar, itu tidak pernah menjadi hal yang buruk!
Klasifikasi Typeface
Kadang-kadang disebut "keluarga font generik," ini adalah pengelompokan besar dari tipografi berdasarkan sejumlah klasifikasi generik yang berbeda font jatuh di bawah. Pada halaman web, ada enam jenis klasifikasi font yang mungkin Anda lihat:
- Serif
- Sans Serif
- Naskah
- Monospaced
- Kursif
- Fantasi
Ada juga sejumlah klasifikasi font lain yang merupakan cabang dari ini. Sebagai contoh, font "slab serif" mirip dengan serif, tetapi semuanya menampilkan desain yang dapat dikenali dengan serif tebal dan tebal pada bentuk huruf. Serif dan sans-serif adalah dua klasifikasi font paling umum yang digunakan di sebagian besar situs web.
Typeface Anatomy
Setiap jenis huruf terdiri dari unsur-unsur yang berbeda yang membedakannya dari tipografi lainnya, yang disebut sebagai anatomi tipografi. Kecuali Anda secara khusus akan masuk ke jenis desain dan mencari untuk menciptakan font baru, desainer web umumnya hanya perlu mengetahui dasar-dasar terminologi jenis huruf.
Pada tingkat dasar, unsur-unsur anatomi jenis huruf yang harus Anda waspadai adalah "cap" dan "x-height," dan "descenders" dan "ascenders."
Cap dan x-height adalah tinggi huruf kapital pada jenis huruf dan tinggi huruf x. Ini memberitahu Anda seberapa tinggi huruf terbesar akan, serta seberapa besar huruf kecil akan. Semua font berukuran berdasarkan dua karakteristik ini.
Descenders dan ascenders adalah bagian dari huruf yang berada di bawah dan di atas garis x-height. Ini biasanya mengacu pada huruf kecil. Misalnya, huruf "b" memiliki ascender (potongan yang menempel "naik" dari surat) sedangkan huruf "p" memiliki descender (bagian-bagian yang mencelupkan "ke bawah" dari surat itu).
Spasi Sekitar Surat
Ada beberapa penyesuaian yang dapat dilakukan antara dan sekitar huruf yang memengaruhi tipografi. Font digital dibuat dengan banyak karakteristik ini di tempat, dan di situs web, kami memiliki kemampuan terbatas untuk mengubah aspek font ini. Ini sering merupakan hal yang baik karena cara default yang ditampilkan font biasanya lebih disukai.
- Kerning: Ruang horizontal di antara masing-masing huruf
- Pelacakan: Ruang antara kelompok huruf
- Terkemuka: Ruang vertikal antara garis-garis jenis (ini dikenal sebagai garis-tinggi dalam istilah situs web)
- Mengukur: Panjang garis teks
- Penjajaran: Menempatkan teks secara visual ke kiri, kanan, tengah, atau dibenarkan
- Ligatures: Huruf-huruf bergerak begitu berdekatan sehingga anatominya digabungkan, pada dasarnya mengalir satu huruf ke huruf yang lain
Elemen Tipografi Lebih Banyak
Tipografi lebih dari sekadar tipografi yang digunakan dan ruang kosong di sekitar mereka. Ada juga beberapa hal lain yang harus Anda ingat ketika membuat sistem tipografi yang baik untuk desain apa pun:
"Hyphenation" adalah penambahan tanda hubung (-) di ujung garis untuk membantu mencegah masalah dalam pembacaan atau membuat pembenaran terlihat lebih baik. Meskipun umumnya ditemukan dalam dokumen tercetak, sebagian besar perancang web mengabaikan penghentian tulisan dan tidak menggunakannya dalam pekerjaan mereka karena bukan sesuatu yang ditangani dengan baik secara otomatis oleh peramban web.
"Lap" adalah tepi vertikal yang tidak rata dari sebuah blok teks. Ketika memperhatikan tipografi, Anda harus melihat blok teks Anda secara keseluruhan untuk memastikan bahwa kain tidak mempengaruhi desain.Jika kain terlalu bergerigi atau tidak rata, itu dapat mempengaruhi pembacaan blok teks dan membuatnya mengganggu. Ini adalah sesuatu yang secara otomatis ditangani oleh browser dalam hal bagaimana tipe wraps dari baris ke baris.
Satu kata di ujung kolom adalah janda dan jika di bagian atas kolom baru itu adalah anak yatim. "Janda" dan "anak yatim" tampak buruk dan sulit dibaca.
Membuat baris teks Anda untuk ditampilkan dengan sempurna di browser web adalah proposisi yang melelahkan, terutama ketika Anda memiliki situs web yang responsif dan tampilan yang berbeda untuk ukuran layar yang berbeda. Tujuan Anda adalah meninjau situs dengan ukuran berbeda untuk mencoba menciptakan tampilan terbaik sambil menerima bahwa dalam kasus tertentu konten Anda akan memiliki jendela, anak yatim, atau tampilan lain yang kurang ideal. Tujuan Anda adalah meminimalkan aspek-aspek dari desain tipe, sementara juga realistis dalam kenyataan bahwa Anda tidak dapat mencapai kesempurnaan untuk setiap ukuran layar dan tampilan.
Langkah-langkah untuk Memeriksa Tipografi Anda
- Pilihlah tipografi dengan seksama, perhatikan anatomi jenisnya serta tipe keluarga apa yang ada di dalamnya.
- Jika Anda membuat desain menggunakan teks placeholder, jangan setujui desain akhir hingga Anda melihat teks asli dalam desain.
- Perhatikan sedikit detail dari tipografi, seperti tanda hubung dan tanda hubung.
- Lihatlah setiap blok teks seolah-olah tidak ada kata-kata di dalamnya. Bentuk apa yang dibuat teks di halaman? Pastikan bentuk-bentuk tersebut membawa seluruh desain halaman ke depan.
