Ligatuur in mobiele ontwikkeling — basis en toepassing van symboolverbindingen

Wat is een ligatuur in typografie

Ligatuur is een typografische techniek waarbij twee of meer tekens worden vervangen door één speciaal ontworpen teken. Het belangrijkste doel van een ligatuur is het elimineren van visuele conflicten tussen naburige tekens en het verbeteren van de tekstperceptie. In het paar fi botst bijvoorbeeld de bovenste uitsteeksel van de letter f met de punt van de letter i — de ligatuur verenigt ze in één elegant symbool.

Ligaturen worden onderverdeeld in verplicht (standaard) en optioneel (decoratief). Standaard ligaturen zijn paren die in de meeste fonts voorkomen: fi, fl, ff, ffi, ffl. Ze worden als noodzakelijk beschouwd voor hoogwaardige typografie en zijn standaard ingeschakeld in het font. Volgens de OpenType-specificatie worden standaard ligaturen gecodeerd met de tag 'liga' en moeten ze in elk professioneel font zijn ingeschakeld.

Visueel effect: zonder ligatuur ziet het paar fi eruit als twee afzonderlijke tekens met ongewenst contact. Met ligatuur — als één harmonieus symbool. Het verschil is vooral merkbaar bij grote corpsen (koppen, logo's) en in tekst met veel herhalende paren (bijvoorbeeld in het Duits met häufigen Buchstabenkombinationen).

Soorten ligaturen: standaard, discretionary, contextueel

OpenType-fonts ondersteunen verschillende soorten ligaturen, elk met een eigen tag en doel. Standaard (tag 'liga') — verplichte ligaturen die standaard in het font zijn ingeschakeld. Ze verbeteren de leesbaarheid en mogen niet zonder goede reden worden uitgeschakeld. Bevatten de paren fi, fl, ff, ffi, ffl en andere die specifiek zijn voor het lettertype.

Discretionary ligaturen (tag 'dlig') — decoratieve ligaturen die optioneel worden ingeschakeld naar goeddunken van de ontwerper. Ze zijn niet vereist voor leesbaarheid en worden gebruikt voor tekststyling: ct, st, sp, Th, Qu en andere. Discretionary ligaturen komen vaak voor in fonts met een historisch of kalligrafisch karakter — bijvoorbeeld in Garamond of Adobe Caslon. Waarschuwing: een overdaad aan discretionary ligaturen verslechtert de leesbaarheid, vooral voor gebruikers met dyslexie.

Contextuele ligaturen (tag 'clig') — ligaturen die afhankelijk zijn van de omgeving van het teken. Ze worden alleen onder bepaalde omstandigheden toegepast: als het teken aan het begin of einde van een woord staat, na een bepaald leesteken, enzovoort. Contextuele ligaturen zijn een geavanceerde OpenType-functie die niet door alle fonts wordt ondersteund. Historische ligaturen (tag 'hlig') — verouderde ligaturen die de stijl van oude drukken nabootsen (long s, &). Ze worden zelden gebruikt, alleen in historische of gestileerde teksten.

Zeldzame types: er bestaan ook ligaturen voor wiskundige zetsels (tag 'dlig' voor wiskundige symbolen) en initiaal ligaturen (drop caps) — maar deze worden niet gebruikt in interfacetypografie en worden alleen ondersteund door gespecialiseerde fonts.

Geschiedenis van ligaturen: van metalen zetsel tot digitale fonts

Ligaturen verschenen lang vóór de digitale typografie — al in het tijdperk van het metalen zetsel in de 15e eeuw. Drukker Johannes Gutenberg gebruikte ligaturen om ruimte te besparen in de regels van zijn 42-regelige Bijbel. Elk letterteken was een fysiek metalen blok en het samenvoegen van twee tekens in één letter bespaarde lood en vereenvoudigde het zetten. De standaard ligaturen fi, fl, ffi, ffl zijn een erfenis uit die tijd.

In het fotozetten (20e eeuw) verloren ligaturen hun praktische functie, maar bleven ze bestaan als esthetisch element van hoogwaardige typografie. Fontontwerpers bleven ligaturen in hun lettertypen opnemen, omdat ze een teken van professionaliteit en oog voor detail werden. In het tijdperk van digitale fonts (PostScript, TrueType) werden ligaturen geïmplementeerd als afzonderlijke glyphs met programmatische vervanging.

OpenType (1996) was een revolutie: het introduceerde het GSUB-mechanisme (Glyph Substitution Table) dat automatisch een reeks tekens vervangt door een ligatuur zonder tussenkomst van de gebruiker. GSUB ondersteunt contextuele vervangingen, voorwaarden en fallback-varianten. Dit stelde fonts in staat om honderden ligaturen te hebben die via tags worden in- en uitgeschakeld. Moderne fonts — SF Pro, Roboto, Inter — ondersteunen OpenType-ligaturen op alle platforms: iOS, Android, macOS, Windows, web.

Implementatie van ligaturen op iOS via UIFontDescriptor

Op iOS kunnen ligaturen worden beheerd via UIFontDescriptor met behulp van het kenmerk featureSettings. Dit kenmerk accepteert een array van dictionaries, die elk één OpenType-functie beschrijven. Het beheren van ligaturen via een descriptor is de enige manier om afzonderlijke soorten ligaturen te controleren zonder andere OpenType-functies van het font te beïnvloeden.

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

// Discretionary ligaturen inschakelen
let ligatureDescriptor = descriptor.addingAttributes([
    .featureSettings: [
        [
            UIFontDescriptor.FeatureIdentifier: kLigaturesType,
            UIFontDescriptor.TypeIdentifier: kCommonLigaturesOnSelector
        ]
    ]
])

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

NSAttributedString ondersteunt ook het kenmerk ligature: NSNumber. Waarde 0 — schakel alle ligaturen uit, 1 — schakel standaard in (standaard), 2 — schakel alle in (inclusief discretionary). Het kenmerk ligature in NSAttributedString biedt echter geen fijne controle over de soorten ligaturen — alleen globale in-/uitschakeling. Gebruik voor selectief beheer UIFontDescriptor met featureSettings.

SwiftUI biedt geen directe modifier voor ligaturen. Om ligaturen in SwiftUI te beheren, maakt u een UIFont met de gewenste instellingen via UIFontDescriptor en gebruikt u deze via Font(descriptor:size:). Als alternatief — gebruik AttributedString (iOS 15+) met het kenmerk .ligature voor NSMutableAttributedString in AppKit/UIKit-weergaven.

// SwiftUI met aangepaste ligaturen via AttributedString
var attributedText: AttributedString {
    var text = AttributedString(
        "Effective typography with ligatures"
    )

    // Alle ligaturen inschakelen voor de hele tekst
    text.ligature = .all

    return text
}

var body: some View {
    Text(attributedText)
}

Ligaturen beheren in CSS en op Android

Op het web worden ligaturen beheerd via de CSS-eigenschap font-variant-ligatures, die trefwoorden accepteert: common-ligatures (standaard ingeschakeld), no-common-ligatures (standaard uitgeschakeld), discretionary-ligatures, no-discretionary-ligatures, contextual, no-contextual. De eigenschap wordt sinds 2015 ondersteund door alle moderne browsers. Standaard schakelen browsers standaard en contextuele ligaturen in.

/* 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 heeft geen directe API voor het beheren van ligaturen. In Android worden ligaturen beheerd op fontniveau en op het niveau van de Minikin-renderingengine (Android 10+). Als het font een OpenType GSUB-tabel bevat, worden ligaturen automatisch toegepast. Voor het uitschakelen van ligaturen in Android worden aangepaste Typeface gebruikt die zijn gemaakt via Typeface.Builder, of tekstvoorverwerking (tekenvervanging vóór weergave). Beperking: op Android lager dan 10 kunnen ligaturen onjuist werken met sommige TTF-fonts.

Laag-niveau controle: op alle platforms kan CSS @font-face worden gebruikt met de parameter font-feature-settings voor OpenType-functies. Deze methode geeft toegang tot alle OpenType-tags, inclusief ligaturen. Voorbeeld: font-feature-settings: 'liga' 1, 'dlig' 1. Echter, font-feature-settings is een laag-niveau syntax en MDN raadt het gebruik van font-variant-ligatures aan als een hoger-niveau alternatief.

Ligaturen in programmeerfonts

Een bijzondere klasse van ligaturen — programmeerligaturen, die operators en codesymbolen combineren tot beter leesbare tekens. Programmeerfonts zoals Fira Code, JetBrains Mono, Cascadia Code bevatten discretionary ligaturen voor veelvoorkomende operators: != (wordt ≠), >= (wordt ≥), -> (wordt pijl), => (wordt dikke pijl), === (wordt drievoudig gelijk).

Programmeerligaturen zijn een controversieel onderwerp in de ontwikkelaarsgemeenschap. Voorstanders beweren dat ligaturen het lezen van code versnellen, omdat operators als één concept worden waargenomen. Onderzoek (Kera et al., PLATEAU 2020) toonde aan dat ligaturen de leessnelheid van code niet beïnvloeden, maar subjectief gewaardeerd worden door 67% van de ontwikkelaars. Tegenstanders van ligaturen merken op dat ze code vervormen: het teken != wordt in de editor weergegeven als ≠, maar wordt in het tekstbestand opgeslagen als twee tekens, wat verwarrend kan zijn bij samenwerking.

Technische implementatie: programmeerligaturen zijn discretionary OpenType-ligaturen (tag 'dlig'). Ze zijn standaard uitgeschakeld en worden in de code-editor ingeschakeld via fontinstellingen. Ontwikkelaars die dergelijke fonts gebruiken, moeten de editor configureren om discretionary ligaturen in te schakelen. In de terminal (iTerm2, Windows Terminal) worden ligaturen ook ondersteund via fontinstellingen. Compatibiliteit: niet alle editors en terminals ondersteunen OpenType-ligaturen. Controleer vóór het kiezen van een font de compatibiliteit met uw tool.

// Voorbeeld: operatorligaturen in JetBrains Mono
val isEqual = a != b  // != weergegeven als ≠
val arrow = x -> x + 1  // -> weergegeven als →
val range = 1 .. 10  // .. weergegeven als bereik

Populaire fonts met programmeerligaturen: Fira Code (eerste massale font met ligaturen, 2015), JetBrains Mono (geoptimaliseerd voor het lezen van code, 2020), Cascadia Code (van Microsoft, 2019), Iosevka (aanpasbaar font met modulair ligatuursysteem). Elk font heeft zijn eigen set ligaturen — van 50 tot 150+ vervangingen. Aanbeveling: begin met Fira Code of JetBrains Mono — zij hebben de beste ondersteuning in editors en IDE's.