Ligatur dalam pengembangan mobile — dasar dan penerapan koneksi simbol

Apa itu ligatur dalam tipografi

Ligatur adalah teknik tipografi di mana dua atau lebih simbol digantikan oleh satu tanda yang dirancang khusus. Tujuan utama ligatur adalah menghilangkan konflik visual antara simbol yang berdekatan dan meningkatkan persepsi teks. Dalam pasangan fi, misalnya, tonjolan atas huruf f bertabrakan dengan titik huruf i — ligatur menggabungkannya menjadi satu simbol yang elegan.

Ligatur dibagi menjadi wajib (standar) dan opsional (dekoratif). Ligatur standar adalah pasangan yang muncul di sebagian besar font: fi, fl, ff, ffi, ffl. Mereka dianggap penting untuk tipografi berkualitas dan diaktifkan secara default di font. Menurut Spesifikasi OpenType, ligatur standar dikodekan dengan tag 'liga' dan harus diaktifkan di setiap font profesional.

Efek visual: tanpa ligatur, pasangan fi terlihat seperti dua simbol terpisah dengan sentuhan yang tidak diinginkan. Dengan ligatur — seperti satu simbol yang harmonis. Perbedaannya terutama terlihat pada ukuran besar (judul, logo) dan dalam teks dengan banyak pasangan berulang (misalnya, dalam bahasa Jerman dengan häufigen Buchstabenkombinationen).

Jenis ligatur: standar, discretionary, kontekstual

Font OpenType mendukung beberapa jenis ligatur, masing-masing dengan tag dan tujuannya sendiri. Standar (tag 'liga') — ligatur wajib yang diaktifkan secara default di font. Mereka meningkatkan keterbacaan dan tidak boleh dinonaktifkan tanpa alasan yang kuat. Berisi pasangan fi, fl, ff, ffi, ffl dan lainnya yang spesifik untuk huruf tersebut.

Ligatur discretionary (tag 'dlig') — ligatur dekoratif yang diaktifkan secara opsional sesuai kebijakan desainer. Mereka tidak wajib untuk keterbacaan dan digunakan untuk stilasi teks: ct, st, sp, Th, Qu dan lainnya. Ligatur discretionary sering ditemukan di font dengan karakter historis atau kaligrafis — misalnya, di Garamond atau Adobe Caslon. Peringatan: kelebihan ligatur discretionary memperburuk keterbacaan, terutama bagi pengguna dengan disleksia.

Ligatur kontekstual (tag 'clig') — ligatur yang bergantung pada lingkungan simbol. Mereka diterapkan hanya dalam kondisi tertentu: jika simbol berada di awal atau akhir kata, setelah tanda baca tertentu, dan seterusnya. Ligatur kontekstual adalah fitur OpenType lanjutan yang tidak didukung oleh semua font. Ligatur historis (tag 'hlig') — ligatur usang yang meniru gaya buku cetak kuno (long s, &). Jarang digunakan, hanya dalam teks historis atau bergaya.

Jenis langka: ada juga ligatur untuk susunan matematika (tag 'dlig' untuk simbol matematika) dan ligatur inisial (drop caps) — tetapi tidak digunakan dalam tipografi antarmuka dan hanya didukung oleh font khusus.

Sejarah ligatur: dari set logam hingga font digital

Ligatur muncul jauh sebelum tipografi digital — sudah di era set logam pada abad ke-15. Pencetak Johannes Gutenberg menggunakan ligatur untuk menghemat ruang di baris-baris Alkitab 42 barisnya. Setiap huruf adalah blok logam fisik, dan menggabungkan dua simbol menjadi satu huruf menghemat timah dan menyederhanakan penyusunan. Ligatur standar fi, fl, ffi, ffl adalah warisan dari era itu.

Dalam fotoset (abad ke-20) ligatur kehilangan fungsi praktisnya, tetapi tetap bertahan sebagai elemen estetika tipografi berkualitas. Desainer font terus menyertakan ligatur dalam huruf mereka, karena ligatur menjadi tanda profesionalisme dan perhatian terhadap detail. Di era font digital (PostScript, TrueType), ligatur diimplementasikan sebagai glyph terpisah dengan penggantian terprogram.

OpenType (1996) adalah sebuah revolusi: ia memperkenalkan mekanisme GSUB (Glyph Substitution Table) yang secara otomatis menggantikan urutan simbol dengan ligatur tanpa campur tangan pengguna. GSUB mendukung penggantian kontekstual, kondisi, dan varian fallback. Ini memungkinkan font memiliki ratusan ligatur yang diaktifkan/dinonaktifkan melalui tag. Font modern — SF Pro, Roboto, Inter — mendukung ligatur OpenType di semua platform: iOS, Android, macOS, Windows, web.

Implementasi ligatur di iOS melalui UIFontDescriptor

Di iOS, ligatur dapat dikelola melalui UIFontDescriptor menggunakan atribut featureSettings. Atribut ini menerima array dari kamus, yang masing-masing mendeskripsikan satu fitur OpenType. Mengelola ligatur melalui deskriptor adalah satu-satunya cara untuk mengontrol jenis ligatur individual tanpa memengaruhi fitur OpenType lain dari font.

let descriptor = UIFontDescriptor.preferredFontDescriptor(
    withTextStyle: .body
)

// Aktifkan ligatur discretionary
let ligatureDescriptor = descriptor.addingAttributes([
    .featureSettings: [
        [
            UIFontDescriptor.FeatureIdentifier: kLigaturesType,
            UIFontDescriptor.TypeIdentifier: kCommonLigaturesOnSelector
        ]
    ]
])

let font = UIFont(
    descriptor: ligatureDescriptor,
    size: 17
)

NSAttributedString juga mendukung atribut ligature: NSNumber. Nilai 0 — nonaktifkan semua ligatur, 1 — aktifkan standar (default), 2 — aktifkan semua (termasuk discretionary). Namun, atribut ligature di NSAttributedString tidak memberikan kontrol yang halus atas jenis ligatur — hanya aktivasi/penonaktifan global. Untuk manajemen selektif, gunakan UIFontDescriptor dengan featureSettings.

SwiftUI tidak menyediakan modifier langsung untuk ligatur. Untuk mengelola ligatur di SwiftUI, buat UIFont dengan pengaturan yang diinginkan melalui UIFontDescriptor dan gunakan melalui Font(descriptor:size:). Alternatif — gunakan AttributedString (iOS 15+) dengan atribut .ligature untuk NSMutableAttributedString di tampilan AppKit/UIKit.

// SwiftUI dengan ligatur kustom melalui AttributedString
var attributedText: AttributedString {
    var text = AttributedString(
        "Effective typography with ligatures"
    )

    // Aktifkan semua ligatur untuk seluruh teks
    text.ligature = .all

    return text
}

var body: some View {
    Text(attributedText)
}

Mengelola ligatur di CSS dan Android

Di web, ligatur dikelola melalui properti CSS font-variant-ligatures, yang menerima kata kunci: common-ligatures (standar aktif), no-common-ligatures (standar nonaktif), discretionary-ligatures, no-discretionary-ligatures, contextual, no-contextual. Properti ini didukung oleh semua browser modern sejak 2015. Secara default, browser mengaktifkan ligatur standar dan kontekstual.

/* Disable all ligatures for monospace */
code, pre {
    font-variant-ligatures: none;
}

/* Enable discretionary ligatures for headings */
.title-fancy {
    font-variant-ligatures:
        common-ligatures
        discretionary-ligatures
        contextual;
}

Android tidak memiliki API langsung untuk mengelola ligatur. Di Android, ligatur dikelola pada tingkat font dan mesin rendering Minikin (Android 10+). Jika font berisi tabel OpenType GSUB, ligatur diterapkan secara otomatis. Untuk menonaktifkan ligatur di Android, digunakan Typeface kustom yang dibuat melalui Typeface.Builder, atau prapemrosesan teks (penggantian simbol sebelum ditampilkan). Keterbatasan: di Android di bawah 10, ligatur mungkin tidak berfungsi dengan benar dengan beberapa font TTF.

Kontrol tingkat rendah: di semua platform, CSS @font-face dapat digunakan dengan parameter font-feature-settings untuk fitur OpenType. Metode ini memberikan akses ke tag OpenType apa pun, termasuk ligatur. Contoh: font-feature-settings: 'liga' 1, 'dlig' 1. Namun, font-feature-settings adalah sintaks tingkat rendah dan MDN merekomendasikan penggunaan font-variant-ligatures sebagai alternatif tingkat yang lebih tinggi.

Ligatur di font pemrograman

Kelas khusus ligatur — ligatur pemrograman, yang menggabungkan operator dan simbol kode menjadi tanda yang lebih mudah dibaca. Font pemrograman seperti Fira Code, JetBrains Mono, Cascadia Code menyertakan ligatur discretionary untuk operator umum: != (menjadi ≠), >= (menjadi ≥), -> (menjadi panah), => (menjadi panah tebal), === (menjadi tiga sama dengan).

Ligatur pemrograman adalah topik kontroversial di komunitas pengembang. Pendukung berpendapat bahwa ligatur mempercepat pembacaan kode, karena operator dianggap sebagai konsep tunggal. Penelitian (Kera et al., PLATEAU 2020) menunjukkan bahwa ligatur tidak memengaruhi kecepatan membaca kode, tetapi secara subjektif disukai oleh 67% pengembang. Penentang ligatur mencatat bahwa ligatur mendistorsi kode: simbol != di editor ditampilkan sebagai ≠, tetapi disimpan dalam file teks sebagai dua simbol, yang dapat membingungkan saat berkolaborasi.

Implementasi teknis: ligatur pemrograman adalah ligatur discretionary OpenType (tag 'dlig'). Mereka dinonaktifkan secara default dan diaktifkan di editor kode melalui pengaturan font. Pengembang yang menggunakan font semacam itu harus mengonfigurasi editor untuk mengaktifkan ligatur discretionary. Di terminal (iTerm2, Windows Terminal) ligatur juga didukung melalui pengaturan font. Kompatibilitas: tidak semua editor dan terminal mendukung ligatur OpenType. Sebelum memilih font, periksa kompatibilitas dengan alat Anda.

// Contoh: ligatur operator di JetBrains Mono
val isEqual = a != b  // != dirender sebagai ≠
val arrow = x -> x + 1  // -> dirender sebagai →
val range = 1 .. 10  // .. dirender sebagai rentang

Font populer dengan ligatur pemrograman: Fira Code (font massal pertama dengan ligatur, 2015), JetBrains Mono (dioptimalkan untuk membaca kode, 2020), Cascadia Code (dari Microsoft, 2019), Iosevka (font yang dapat dikonfigurasi dengan sistem ligatur modular). Setiap font memiliki set ligatur sendiri — dari 50 hingga 150+ penggantian. Rekomendasi: mulailah dengan Fira Code atau JetBrains Mono — mereka memiliki dukungan terbaik di editor dan IDE.