Tipografi Web: Font yang Bekerja, Bukan Sekadar Cantik

90% desain web adalah teks. Memilih dan memasang huruf dengan benar adalah investasi visual dengan dampak terbesar.

Hampir semua yang dikatakan website Anda — navigasi, judul, penawaran, tombol — disampaikan lewat teks. Tapi keputusan font sering diambil lima menit sebelum launch: “pilih yang cakep saja”. Padahal tipografi menentukan keterbacaan, suasana, bahkan kepercayaan.

Empat Prinsip yang Menyelamatkan

1. Maksimal dua keluarga font. Satu untuk judul, satu untuk teks isi — atau bahkan satu keluarga dengan beberapa bobot. Lebih dari itu, halaman mulai berisik.

2. Ukuran isi 16px ke atas. Teks lebih kecil dari itu nyaman di desain mockup, tapi melelahkan di ponsel sungguhan. Tinggi baris 1,5–1,7 untuk paragraf.

3. Hierarki lewat bobot dan ukuran — jelas dan konsisten. H1 > H2 > body sebesar apa, tetapkan sejak awal dan patuhi di semua halaman.

4. Panjang baris terkendali. Paragraf selebar layar penuh (100+ karakter per baris) membuat mata kehilangan jalur pulang. Batasi lebar kolom teks ±65–75 karakter.

Web Font: Cepat atau Cantik?

Font cantik yang lambat dimuat membuat pengunjung membaca dengan font sistem dulu — lalu layout bergeser ketika font asli datang. Mitigasinya: gunakan font-display: swap, muat hanya bobot yang dipakai, dan pertimbangkan font variabel. Font sistem yang dipasang rapi juga bukan aib — banyak website kelas dunia memakainya.

Ujian Sederhana

Zoom halaman Anda ke 200% di browser. Kalau teks masih nyaman dibaca dan hierarkinya masih jelas, tipografi Anda lulus ujian sesungguhnya.

Foto cover dari Unsplash