Typography goes far beyond just a font; it's a crucial element in how your brand communicates its message.

Tipografi lebih dari hanya sekadar memilih font apa yang bagus. Peran Tipografi disini adalah bagaimana brand mengkomunikasikan pesan mereka dalam teknik mengatur huruf dari mulai estetik, sistem hierarki, hingga struktur. Baik dalam desain brand identity, desain website, hingga packaging atau desain cetak lainnya.

Perannya lebih signifikan lagi bila komunkasi verbal diperlukan secara efektif misalnya pada signage, buku, dan semua desain yang bergantung pada bentuk Tipografi agar pesan verbal tersampaikan dengan baik dan cepat.

[Photo: Daniel Meigs/courtesy Base Design & Hastings]

Penggunaan Tipografi yang efektif dapat mengkomunikasikan pesan yang krusial lebih cepat via fastcompany.

Bagaimana cara kita menggunakan Tipografi dapat sangat mempengaruhi bagaimana pesan tersebut tersampaikan. Dengan banyaknya jenis fonts, styles, dan teknik tertentu, mungkin akan terasa sulit bagi desainer, terutama desainer pemula untuk memilih Tipografi yang tepat. Seperti pada meme yang telah terkenal dikalangan desainer, memilih font adalah salah satu langkah yang paling lama dalam mendesain.

Dalam panduan ini, Mutu akan mengungkap rahasia dunia Tipografi, mulai dari pengetahuan penting dan tips praktis yang kamu perlukan untuk memaksimalkan impact-nya pada desain. Dari memahami dasar-dasarnya hingga menguasai teknik-teknik tingkat lanjut, Kamu akan belajar bagaimana menggunakan Tipografi bukan hanya sebagai alat, namun sebagai sarana komunikasi yang ampuh yang beresonansi dengan audiens.

The Basic: Definisi, Elemen, dan Terminologi

Apa itu Tipografi: Definisi Tipografi

Secara sederhana, Tipografi adalah bagaimana cara desainer untuk mengatur sebuah huruf atau teks agar dapat dibaca dengan jelas, menarik secara visual, dan sesuai dengan konteks yang ada. Dengan tujuan untuk mengkomunikasikan pesan yang ada di dalamnya.

Salah satu penggunaan tipografi dalam campaign brand Via Jacqueline Smith

Tipografi merupakan salah satu fondasi utama dalam brand visual identity, selain Logo, Warna, dan Pattern misalnya. Sehingga penggunaannya wajib dipikirkan dengan matang, karena mempengaruhi keseluruhan brand visual identity.Tipografi dapat memengaruhi cara orang menafsirkan dan terlibat dengan konten/konteks yang kamu buat.

Elemen di Tipografi

Fonts vs Typefaces, perbedaan mendasar pada keduanya adalah dimana typefaces merupakan design huruf, number, dan symbols (Contoh: Times New Roman, Helvetica, Futura) sedangkan fonts memiliki kekhususan dalam weight, size, dan style (Contoh: Times New Roman Bold 12pt, Helvetica Regular Italic 16pt, Futura Semi Bold 24pt).

Font Families, adalah kelompok tipografi terkait yang memiliki karakteristik desain yang sama. Empat keluarga font utama adalah:

• Serif, Font dengan garis atau guratan kecil yang menempel di ujung huruf (misalnya Times New Roman). Mereka sering digunakan di media cetak dan menyampaikan kesan tradisi dan formalitas.

  

  Contoh 3 Font Serif Via Google Font

  
  

• Sans Serif, Font tanpa guratan kecil di akhir huruf (misalnya Arial). Ini bersih, modern, dan banyak digunakan di media digital.

  

  Contoh 3 Font Sans Serif Via Google Font

  
  

• Script, Font yang meniru tulisan tangan, sering digunakan untuk tujuan dekoratif (misalnya, Brush Script).

  

  Contoh 3 Font Script Via Google Font

  
  

• Decorative, Font unik dan bergaya yang sering digunakan untuk judul atau tujuan desain tertentu (misalnya, Comic Sans).

  

  Contoh 3 Font Decorative Via Google Font

  
  

Terminologi Anatomi Font

Anatomi Typeface via Material Design

• Leading, Spasi vertikal antar baris teks, mempengaruhi seberapa mudah teks dibaca.

• Kerning, Penyesuaian spasi antar karakter individu untuk meningkatkan tampilan teks secara keseluruhan.

• Tracking, Penyesuaian spasi yang seragam di berbagai karakter, memengaruhi kepadatan dan tekstur teks.

• Baseline, Garis tak terlihat tempat karakter berada, penting untuk menyelaraskan elemen teks dalam desain.

• X-Height, Ketinggian huruf kecil, khususnya huruf 'x', mempengaruhi keterbacaan dan dampak visual teks.

Cara Memilih Tipografi yang Tepat

Memahami kebutuhan Brand

Tipografi adalah cerminan kepribadian brand. Font yang dipilih harus selaras dengan nilai, tone, dan gaya brand. Misalnya, sebuah firma hukum mungkin memilih font serif klasik untuk menyampaikan profesionalisme dan kepercayaan, sementara perusahaan startup teknologi mungkin memilih font sans-serif yang ramping untuk menekankan modernitas dan inovasi.

1. Identifikasi Kepribadian Brand

   Apakah formal, santai, menyenangkan, atau serius? Pilih font yang secara visual mewakili karakteristik ini. Kepribadian brand dapat didapatkan menggunakan tools seperti brand archetype.

   

   Brand Archetype via Streamline

   
   

2. Pertimbangkan Audiens

   Dengan siapa brand berbicara? Audiens yang berbeda mungkin merespons gaya tipografi tertentu dengan lebih baik.

   
   

3. Konsistensi di Semua Platform

   Pastikan pilihan tipografi konsisten di situs web, media sosial, materi cetak, dan titik kontak brand lainnya.

Match Tipografi dengan Konten/Konteks atau Konsep

Tipografi yang dipilih harus menggambarkan konten yang diwakilinya. Jenis konten yang berbeda memerlukan perlakuan tipografi yang berbeda untuk meningkatkan readability dan impact.

1. Tone of Voice

   Cocokkan tipografi dengan tone of voice. Misalnya, font script mungkin cocok untuk undangan pernikahan yang elegan, namun tidak untuk laporan teknis. Lihat referensi pada NN Group mengenai Tone of Voice.

Contoh penggunaan Tone of Voice pada sebuah Brand bergantung pada Dimensinya via NN/g

2. Konteks

   Pertimbangkan di mana konten akan dikonsumsi/ditampilkan. Font yang besar dan tebal cocok untuk judul dan teks pendek, sedangkan font yang lebih mudah dibaca sangat penting untuk body copy.

   

Contoh penggunaan font bergantung pada konteks, konten, dan konsep yang diangkat, via Unknown

3. Hierarki

   Tetapkan hierarki tipografi yang jelas untuk memandu pembaca membaca konten. Perhatikan penggunaan ukuran font, bobot, dan gaya yang berbeda untuk membedakan antara judul, subjudul, dan teks isi.

Penggunaan Font Hierarchy sebagai fungsi aksesibilitas yang luas, via Smith and Connors

Readability and Legibility

Betapapun indahnya sebuah font, jika tidak terbaca, maka tidak akan sesuai dengan tujuannya. Readability and Legibility merupakan faktor penting ketika memilih tipografi untuk project apa pun.

1. Ukuran Font

   Pastikan teks cukup besar agar dapat dibaca dengan nyaman di semua perangkat, terutama di layar seluler. Sesuaikan dengan audiens. Untuk audiens yang lebih senior, maka menggunakan ukuran font yang lebih besar akan lebih mudah dibaca. Ukuran yang terlalu besar juga bisa mengganggu hierarki atau focus pembaca.

   

General Rule of Thumb untuk melihat ukuran font terhadap hierarki, via Venngage

2. Line Spacing (Leading)

   Line Spacing yang tepat meningkatkan keterbacaan teks dengan mencegah teks terasa sempit atau terlalu menyebar.

   
   

3. Kontras

   Pastikan terdapat kontras yang cukup antara teks dan latar belakang. Teks gelap dengan latar belakang terang umumnya lebih mudah dibaca dibandingkan sebaliknya.

   Gunakan contrast checker untuk membandingkan 2 warna antara teks dan latar belakang. 2 Warna yang cukup kontras akan memiliki nilai lebih tinggi.

   

   Contrast Checker by Coolors

   
   

4. Hindari Font yang Terlalu Bergaya

   Meskipun font dekoratif dapat menambah kesan pada desain, font tersebut harus digunakan dengan hemat dan tidak untuk blok teks yang besar/banyak.

Contoh penggunaan font dekoratif yang berlebihan Via Jesse Hall on Pinterest

Rekomendasi Bacaan: How type influences readability by Google Fonts

Hierarki dan Sturktur

Visual Hierarki

Hierarki visual adalah susunan elemen teks sedemikian rupa sehingga menandakan pentingnya elemen tersebut dan memandu mata pembaca melalui konten. Menetapkan hierarki yang jelas membantu pembaca dengan cepat memahami pesan-pesan utama dan mengikuti jalur bacaan yang diinginkan.

Size: Font yang lebih besar secara alami menarik lebih banyak perhatian dan sering digunakan untuk judul dan pesan utama, sedangkan font yang lebih kecil digunakan untuk teks isi.

Weight: Font tebal atau berat dapat menekankan elemen penting, membuatnya menonjol dibandingkan teks berbobot biasa.

Color: Gunakan warna kontras untuk menyorot elemen teks tertentu, namun pastikan warna tersebut selaras dengan color palette keseluruhan dan tetap mudah dibaca.

Spacing: Jarak yang cukup antara bagian dan elemen yang berbeda menciptakan kesan keteraturan dan kejelasan, sehingga memudahkan pembaca untuk membedakan berbagai tingkat informasi.

Gaya: Huruf miring, garis bawah, atau huruf besar semua dapat digunakan secukupnya untuk menarik perhatian pada kata atau frasa tertentu dalam teks.

Tip: Gunakan tools seperti Type Scale untuk melihat penggunaan visual hierarki.

Konsistensi Struktur

Konsistensi dalam tipografi adalah kunci untuk menciptakan desain yang kohesif dan terlihat profesional. Tipografi yang konsisten akan memperkuat identitas brand dan memberikan pengalaman membaca yang lebih seamless.

Font Pairing: Batasi desain pada dua atau tiga font yang saling melengkapi. Biasanya, satu font digunakan untuk judul dan satu lagi untuk teks isi.

Contoh Font Pairing Via Fontshare

Style Guide: Buat panduan gaya tipografi yang menguraikan font, ukuran, bobot, dan warna tertentu yang akan digunakan di semua platform. Hal ini memastikan bahwa semua materi desain selaras dengan identitas visual.

Contoh Typeface Style Guide Via Venngage

Alignment: Perataan yang konsisten (kiri, tengah, atau rata) di seluruh desain menciptakan tampilan yang lebih bersih dan terorganisir. Tip, untuk teks dengan blok besar > 4 baris, gunakan alignment rata kiri untuk memudahkan pembacaan.

Baca Lebih Lanjut: Typography: Alignment

Spacing Standard: Pertahankan spasi yang konsisten untuk margin, tinggi garis, dan spasi paragraf untuk menghindari tampilan yang berantakan atau tidak rata.

Cara menentukan dan membuat bagian tipografi dalam brand visual identity

Langkah 1: Pahami Kepribadian Brand

• Brand Core Values, Pertimbangkan kata sifat yang menggambarkan brand (misalnya, modern, tradisional, menyenangkan, serius).

• Target Audiens, Siapa customer/audiens utama brand? Tipografinya harus sesuai dengan preferensi dan harapan audiens.

• Brand Tone of Voice, Apakah tone of voice brand formal, santai, berwibawa, atau ramah? Ini akan mempengaruhi pilihan tipografi

  
  

Langkah 2: Riset dan Kumpulkan Inspirasi

Lihatlah bagaimana brand lain di industri yang sama menggunakan tipografi dan kumpulkan contoh yang sesuai dengan identitas brand.

Contoh penggunaan Typography pada sebuah brand Identity Misfits Digital

Langkah 3: Pilih Typeface Utama

• Gaya Font: Tentukan antara serif, sans-serif, skrip, atau font dekoratif berdasarkan kepribadian brand.

• Versatilitas: Pastikan jenis huruf berfungsi dengan baik dalam berbagai ukuran, bobot, dan format. harus dapat dibaca di media digital dan cetak.

• Dukungan Bahasa: Periksa apakah jenis huruf mendukung bahasa yang diperlukan, terutama jika brand beroperasi secara internasional.

  
  

Langkah 4: Pilih Tipografi Sekunder dan Tersier

Pilih tipografi tambahan untuk kasus penggunaan tertentu, seperti judul, subjudul, atau keterangan.

• Font Komplemen: Pilih font yang melengkapi jenis huruf utama. Font ini harus cukup kontras untuk menciptakan daya tarik visual tetapi tidak berbenturan.

• Penggunaan Hierarki: Tetapkan peran untuk setiap jenis huruf (misalnya, utama untuk teks isi, sekunder untuk judul, tersier untuk keterangan).

• Uji Konsistensi: Gunakan font bersama-sama dalam mockup untuk memastikan font tersebut mempertahankan tampilan dan nuansa yang konsisten.

Langkah 5: Tentukan Font Sizes, Weights, dan Styles

• Heading: Tentukan ukuran font untuk H1, H2, H3, dll. Biasanya, font yang lebih besar dan tebal digunakan untuk judul tingkat yang lebih tinggi.

• Body: Pilih ukuran dan weight font yang memastikan keterbacaan lebih mudah. Ukuran umum berkisar dari 12pt hingga 16pt untuk teks isi.

• Styles: Tentukan kapan dan bagaimana menggunakan huruf tebal, miring, atau garis bawah untuk menekankan teks.

Langkah 6: Line Spacing, Kerning, and Tracking

Fine-tune the spacing between lines, letters, and words to enhance readability and aesthetics.

Langkah 7: Buat Panduan Gaya Tipografi

Dokumentasikan semua keputusan tipografi dalam style atau brand guidelines untuk memastikan penggunaan yang konsisten di semua brand.

Resources Typography

Berikut adalah beberapa sumber berharga untuk memperdalam pemahaman kamu tentang tipografi. Baik kamuseorang pemula atau desainer berpengalaman, alat dan referensi ini akan membantu kamu meningkatkan keterampilan tipografi dan terus mengikuti perkembangan tren terkini. Klik download di samping kiri atas (di web), atau di paling bawah halaman (di mobile view). Atau klik link ini.