Digital Marketing
Font Subsetting (Pemangkasan Font)
TL;DR: Font Subsetting adalah teknik membuang karakter yang tidak terpakai dari file font, menyisakan hanya glyph yang dibutuhkan halaman. File font yang lebih kecil berarti teks tampil lebih cepat dan layout lebih stabil. Untuk situs berbahasa Indonesia, subset Latin biasanya sudah cukup.
Sebuah file font lengkap bisa berisi ribuan karakter: aksara Latin, Sirilik, Yunani, simbol, hingga ligatur. Padahal situs berbahasa Indonesia umumnya hanya butuh huruf Latin dasar. Mengirim seluruh font ke browser sama saja membayar ongkos kirim untuk barang yang tidak dipesan.
Apa itu Font Subsetting?
Font Subsetting adalah proses menghasilkan versi font yang hanya memuat subset karakter tertentu. Teknik ini mengurangi berat aset font, salah satu sumber render-blocking yang sering luput diperhatikan saat mengoptimalkan Core Web Vitals.
Analoginya seperti kamus saku versus kamus besar. Kalau kamu hanya butuh kosakata sehari-hari, kamus saku jauh lebih ringan dibawa. Subset Latin pada font biasanya memangkas ukuran file secara signifikan dibanding versi lengkap multi-aksara.
Cara Menerapkannya
| Pendekatan | Cara kerja |
|---|---|
| Subset statis | Buat file font berisi karakter terpilih saat build |
| unicode-range CSS | Browser hanya unduh subset yang relevan dengan teks |
| Tool otomatis | Glyphhanger atau fitur subset pada font loader |
Banyak font loader modern, termasuk di ekosistem Next.js, sudah otomatis melakukan subset dan self-hosting font. Teknik ini berpasangan baik dengan lazy loading aset non-kritis dan strategi cache yang benar agar font tidak diunduh ulang.
Kenapa Penting untuk Bisnis?
Font yang lambat dimuat memicu flash teks tak terstilkan atau pergeseran layout, yang merusak skor CLS. Saat menangani halaman konten yang teks-berat, saya menemukan font sering jadi aset blocking yang terlewat karena perhatian biasanya tertuju ke gambar. Memangkas font ke subset Latin adalah perbaikan murah dengan dampak nyata pada kecepatan tampil teks.
Untuk situs bisnis Indonesia yang banyak diakses lewat seluler, setiap kilobyte yang dihemat dari font berarti teks lebih cepat terbaca. Panduan teknis dapat dibaca pada dokumentasi font web di web.dev.
Pertanyaan Umum
Apakah subsetting menghapus huruf yang saya butuhkan?
Tidak, selama subset mencakup rentang karakter yang dipakai. Untuk konten Indonesia, subset Latin biasanya cukup. Jika ada simbol khusus, pastikan ikut disertakan.
Apakah Google Fonts sudah otomatis subset?
Google Fonts menyajikan subset via unicode-range, tapi self-hosting dengan subset manual sering memberi kontrol dan kecepatan lebih baik.