Kenapa Setiap Desain Membutuhkan Tiga Level Hierarki Tipografi

level-hierarki-tipografi

Hierarki – adalah sebuah kata yang besar, namun mudah-untuk-diimplementasikan (meskipun penting) konsep ketika berhubungan dengan tipografi.

Dan pedoman ini akan menunjukkan pada Anda bagaimana menggunakannya untuk meningkatkan proyek desain Anda.

Meski pun Anda tidak cukup familiar dengan istilahnya, Anda akan bertemu dengan banyak hierarki tipografi. Misalnya pada Koran, dengan sebuah headline, subheadline, dan body copy. Ini adalah sebuah contoh klasik dari tiga level hierarki tipografi, pendekatan yang masih digunakan sampai saat ini, baik secara cetak maupun online. Koran dari awal era 20-an menawarkan contoh yang besar, seperti dibawah ini:

Belakangan ini, headline atau judul kita tidak harus berukuran 6 inci untuk menarik perhatian pembaca, namun gambar diatas memberikan pengingat yang dramatis dari bagaimana hierarki tipografi sebenarnya – mengatur dan memformat tipe pilihan Anda agar pembaca atau pengguna dapat melihat apa yang paling penting, yang memungkinkan mereka untuk dengan mudah bernavigasi pada tata letak dalam sekilas dan cepat memindai untuk menemukan informasi yang mereka cari.

Meningkatkan kemampuan membaca dan penggunaan adalah keuntungan yang paling penting dari sebuah hierarki tipografi. Jika contohnya, halaman depan dari Koran terlihat seperti satu dari dua contoh dibawah ini – tanpa hierarki tipografi atau dengan hierarki yang terbatas – pesan penting yang ingin dikomunikasikan bisa jadi tidak mudah dibaca pada pandangan pertama. Pembaca mungkin merasa terganggu dengan satu bagian berhenti dan yang lain sudah memulai, membuatnya semakin susah untuk dibaca dan memberikan efek yang sedikit.

Tiga contoh pertama akan memberikan keuntungan dari beberapa variasi font, ukuran, dan/atau gaya, bersamaan dengan jarak yang lebih baik diantara bagian, untuk meningkatkan kemudahan dalam membaca.

Jadi, bagaimana Anda dapat membangun hierarki yang efektif pada desain Anda? Menambahkan tiga level yang berbeda dari tipografi adalah tempat yang bagus untuk memulai dan akan cukup untuk berbagai macam desain.

  • Level Satu: Secara umum, level Anda – satu tipografi akan menjadi konten atau informasi yang paling penting; ini harusnya menjadi elemen tipografi yang paling terlihat pada desain Anda.
  • Level Dua: Elemen level-dua biasanya membantu mengatur desain Anda menjadi bagian atau group yang berhubungan dengan informasi secara kesatuan. Ini harusnya tidak terlalu menonjol seperti tipe level satu Anda, tapi dengan jelas mengarahkan pembaca ke bagian yang berbeda dari desain dan membantu untuk bernavigasi dengan mudah.
  • Level Tiga: Untuk tata letak teks –berat, tipografi level tiga secara umum adalah daging (inti) dari desain. Disinilah copywriting hidup, dimana Anda masuk kedalam desain Anda. Bisa jadi panjang atau pendek – sebuah keseluruhan artikel, catatan kecil, deskripsi singkat – tapi konsentrasi yang utama untuk level ini adalah mudah untuk dibaca, karena ukuran font akan kecil.

Sebagai sebuah contoh, desain dari halaman produk ini sederhana, tapi setidaknya memiliki tiga level hierarki tipografi. Anda bisa menyebut nama produk (headphone Major Black) adalah level satu; harga sebagai level dua, dan deskripsi produk adalah level tiga. Perhatikan bagaimana paragraf deskripsi dibangun menjadi serif yang mudah dibaca dengan jarak yang cocok diantara dua kalimat (juga dikenal sebagai “leading”).

Anda punya banyak pendekatan yang bisa Anda pilih untuk memvisualisasikan pengaturan konten Anda. Banyak dari mereka terlihat seperti detail kecil, tapi untuk mengutip Charles Eames, seorang desainer dan arsitek Amerika yang berpengaruh: “Detail bukan hanya sekedar detail. Merekalah yang membangun desain.” Mari lihat beberapa pilihan yang bisa membantk Anda membangun hierarki tipografi dan memberikan desain Anda sebuah efek yang maksimum:

Bagaimana Cara Membentuk Hierarki Tipografi (dan Mengatur secara Visual Desain Anda)

1. Atur Ukuran Font Anda

Ukuran adalah cara terbaik untuk membentuk kontras diantara elemen tipografi yang berbeda pada desain Anda, terutama jika Anda hanya bekerja menggunakan satu jenis huruf. Dengan tiga level tipografi, ukuran font secara umum dimulai dengan yang paling besar pada bagian teratas (level satu; informasi Anda yang paling penting) dan penurunan ukuran seiring Anda turun kebawah halaman (dengan body copy apapun atau teks yang semakin mengecil pada level tiga). Karena kita membaca dari kiri ke kanan dan dari atas ke bawah, hierarki dari atas ke bawah adalah yang paling alami untuk pembaca bernavigasi. Ini adalah tata letak yang paling umum yang akan Anda lihat di berbagai buku dan majalah sampai artikel pada situs.

Ingat – hierarki adalah tentang membantu informasi Anda yang paling penting agar menonjol secara visual. Apakah informasi itu berbentuk nama (mungkin didalam kartu nama Anda; atau nama dari penampil atau tamu pembicara pada poster acara), judul dari sebuah artikel atau blog, atau diskon spesial atau promosi pada sebuah iklan, jika Anda mengatur tipenya pada ukuran yang lebih besar dari teks yang lain pada tata letak, tentu saja ini menarik perhatian.

Contohnya, harga dari penawaran spesial yang menonjol dengan baik karena ukurannya yang besar berhubungan dengan teks pada bagian kanan tata letak. Menggunakan warna terang merah sebagai highlight dari promosi juga merupakan pilihan yang cerdas (untuk lebih banyak informasi mengenai hierarki tipografi Anda, geser kebawah pada #4).

2. Pilih Beberapa Jenis Huruf yang Kontras

Pikirkan lagi tentang headline koran “On the Moon” yang kita lihat pada bagian awal artikel. Tidak tebal, bentuk huruf sans-serif kontras secara dramatis dengan bentuk huruf italic dan pada sisa halaman? Sementara memasangkan bentuk huruf tidak selalu harus secara dramatis, kontras adalah komponen kunci untuk kombinasi font yang sukses.

Dan mengkombinasikan sans-serif dengan huruf bentuk serif sudah menjadi hal yang umum diantara seter dan desainer selama bertahun-tahun. Sebuah peraturan top yang klasik sebagai permulaan yang bagus dari desain apa pun. Meski pun Anda hanya menggunakan tipografi level satu dari berbagai font, yang bisa memberikan efek visual yang besar.

Pastikan dalam benak Anda bahwa Anda tidak ingin memilih terlalu banyak jenis huruf, yang hanya akan membuat desain Anda berantakan dan padat pada desain Anda: dua atau tiga sudah cukup untuk tata letak pada umunya. Anda juga ingin memastikan bahwa pilihan Anda cocok dengan gaya dan konteks dari desain Anda.

Contohnya, Anda tidak akan mengatur informasi penting seperti waktu dan tanggal dari acara perusahaan dengan font yang funky, terlalu canggih dan sulit dibaca. Atau memilih sebuah font script untuk teks paragraf yang panjang akan sama susahnya untuk mata. Beberapa font susah untuk dilihat dengan jelas ketika ukurannya terlalu kecil. Isu semacam ini dan bagaimana itu mempengaruhi kemudahan membaca dan tampilan secara keseluruhan desain Anda adalah hal penting yang harus dikonsiderasikan untuk setiap proyek. Untuk tips yang lebih banyak tentang bagaimana mengkombinasikan font secara efektif, coba lihat artikel Sekolah Desain yang lain, “10 Aturan Urama yang Harus Anda Junjung ketika Mengkombinasikan Font: Tips Untuk Seorang Desainer.”

3. Bereksperimen dengan Gaya dan Berat yang Berbeda

Banyak font yang ada dengan berbagai pilihan gaya dan berat. Gaya yang berbeda termasuk italic, cap kecil, atau versi kental atau padat. Berat mengacu pada keringanan secara visual atau berat dari jenis huruf. Jika font yang Anda gunakan memiliki versi yang ringan, sedang, tebal dan berat, itulah yang dikenal dengan perbedaan berat.

Karakter-karakter ini memberikan Anda pilihan yang banyak ketika berhadapan dengan penggunaan pada peran yang berbeda (atau hanya tampilan pelengkap yang berbeda untuk elemen variasi tipografi pada desain Anda. Contohnya saja buletin. Semua jenis tipe sans-serif disini menggunakna font yang sama, namun berbeda berat. Huruf yang ditebalkan pada judul buletin membuatnya sangat mudah untuk dilihat; sinyal dari berat visual yang merupakan bagian penting pada hierarki desain.

Dan label ini sudah didesain dengan berbagai berat regular dan tebal, bersama dengan gaya italic dan cap kecil – semua menggunakan jenis huruf yang sama.

4. Tambahkan Beberapa Warna

Layaknya gaya font dan berat, warna juga salah satu cara yang berperan dalam beberapa bagian untuk membuat desain Anda menonjol. Karena warna terkadang membawa artinya sendiri dan berasosiasi, Anda ingin memastikan bahwa pilihan Anda sudah cocok dengan merek dan/atau tujuan dan nuansa dari desain Anda.

Undangan ini untuk sebuah acara yang diadakan oleh perusahaan kopi, dengan warna yang alami dan kebumian untuk tipografi yang mendukung karakteristik merek dan tema dari acara.

Begitu juga dengan kartu nama ini yang mengatur set fitur penting, kombinasi warna biru-dan-kuning untuk tipografi yang menarik perhatian mata. Warna yang segar, perasaan bersih, meskipun tanpa warna tradisional hitam atau biru tua – mereka masih cocok digunakan untuk praktek orthodontik sebagaimana kartu ini dibuat.

5. Perhatikan Jarak Ruang

Pada sebuah desain, jarak antara elemen tipografi – jarak huruf dan jarak kalimat – dapat membuat semua perbedaan diantaranya keseimbangan, desain mudah dibaca dan membuat tampilan terkesan berantakan dan membingungkan.

Ingat beberapa contoh gambar sebelumnya dari tanpa hierarki dan hierarki yang terbatas? Pada keduanya mempunyai jarak diantara bagian artikel koran, yang membuatnya susah untuk dibaca, desain yang tidak terlalu efektif. Ini karena jarak (atau ruang putih) secara visual dibagi menjadi bagian berbeda dari sebuah desain, tetap juga membantu pembaca mengerti dan memvisualisasikan bagaimana semuanya saling bertautan secara keseluruhan.

Contohnya, jarak yang cukup (beriringan dengan berbagai macam tipe kreatif dan kalimat yang tertata rata) membuat tipografi disini terlihat seimbang, bahkan pada ruang sekecil label pakaian.

Ketika Anda melihat tata letak dengan jarak yang bagus, Anda langsung dapat melihat kemana Anda harus membaca atau mendapatkan informasi dari desain yang dimaksud. Namun, jika Anda melihat pada desain dimana si desainer mungkin merasa tidak memilki ruang yang cukup untuk bekerja (jadi ia menyatukan begitu banyak konten tanpa mempertimbangkan jarak) – Anda mungkin mendapati diri Anda sedang kesulitan membaca pada teks yang fontnya terlalu kecil. Atau melihat informasi, mungkin alamat atau nomer telepon, tapi tidak langsung menemukan apa yang dicari. Atau bahkan tidak akan melihat sedikit pun karena desainnya terlihat berantakan.

Slide presentasi ini menghindari masalah tersebut dengan menggunakan jarak kalimat yang cukup dan teks sekitar dan elemen yang lain dengan begitu banyak ruang putih. Warna blok dan bentuk geometris juga membantu mengorganisir dan memisahkan desain elemen yang berbeda.

Anda pasti tidak ingin pembaca atau pengguna merasa frustasi dengan desain Anda. Jadi, berikanlah usaha ekstra dalam membangun keseimbangan desain dengan cukupnya ruang putih yang sesuai dengan waktu yang Anda miliki.

6. Perhatikan Jarak, Cont.: Kedekatan

Jarak tidak hanya tentang memisahkan elemen tipografi, tapi juga kedekatan, atau memindahkan item yang bersangkutan agar lebih dekat. Mengurangi jarak diantara potongan teks yang bersama (untuk membuatnya lebih jelas jika mereka bersama) adalah alat visual yang lain untuk membantu pembaca bernavigasi pada desain dengan lebih mudah.

Terutama desain konten yang berat, seperti infografis, kedekatan adalah kunci dari membangun sebuah keseimbangan desain yang membuatnya memiliki rasa visual.

7. Bermain dengan Orientasi

Kadang sebuah kalimat lurus dari teks tidak memotong ketika Anda ingin membuat sebuah pernyataan dengan tipografi Anda. Dalam hal itu, sedikit kemiringan, kecondongan, atau lengkungan mungkin membantu desain Anda terpisah dari yang lain dan menarik beberapa perhatian ekstra.

Biasanya Anda akan menggunakan metode-metode ini untuk membuat hierarki tipografi pada proyek desain tunggal, seperti undangan bridal shower dibawah ini. Menggunakan ukuran font, yang kontras dengan jenis huruf, warna, jarak dan kedekatan, dan orientasi menjadikannya satu efek yang baik.

Teraplikasikan dengan efektif, tehnik-tehnik ini tidak hanya membuat desain Anda menjadi menarik, namun juga membuatnya ramah untuk digunakan – dan ketika desain dikombinasikan dengan bentuk dan fungsi, itulah bagian terbagusnya. Jadi, lain kali ketika Anda bekerja dengan tipografi untuk sebuah proyek desain, cobalah beberapa dari mereka. Selamat mendesain!

Artikel terkait

Lihat semua

Group 3 (3) (1)

Wujudkan ide Anda dalam hitungan menit.

Ekspresikan diri Anda dengan program desain termudah di dunia.