“Ligatura” nello sviluppo mobile — fondamenti e applicazione delle connessioni di caratteri

Cos’è una ligatura nella tipografia

Ligatura è una tecnica tipografica in cui due o più caratteri vengono sostituiti da un unico glifo appositamente progettato. Lo scopo principale di una ligatura è eliminare i conflitti visivi tra caratteri adiacenti e migliorare la percezione del testo. Nella coppia fi, ad esempio, la protuberanza superiore della lettera f collide con il punto della lettera i — la ligatura li fonde in un unico simbolo elegante.

Le ligature si dividono in obbligatorie (standard) e opzionali (decorative). Le ligature standard sono coppie presenti nella maggior parte dei font: fi, fl, ff, ffi, ffl. Sono considerate necessarie per una tipografia di qualità e sono attivate nel font per impostazione predefinita. Secondo la specifica OpenType, le ligature standard sono codificate con il tag ‘liga’ e devono essere presenti in qualsiasi font professionale.

Effetto visivo: senza ligatura, la coppia fi appare come due caratteri separati con una collisione indesiderata. Con la ligatura, appare come un simbolo armonioso. La differenza è particolarmente evidente nelle dimensioni grandi (titoli, loghi) e nel testo con molte coppie ripetute (ad esempio, in tedesco con häufigen Buchstabenkombinationen).

Tipi di ligature: standard, discrezionali, contestuali

I font OpenType supportano diversi tipi di ligature, ciascuno con il proprio tag e scopo. Standard (tag ‘liga’) sono ligature obbligatorie attivate per impostazione predefinita in un font. Migliorano la leggibilità e non dovrebbero essere disattivate senza un valido motivo. Includono le coppie fi, fl, ff, ffi, ffl e altre specifiche del carattere tipografico.

Ligature discrezionali (tag ‘dlig’) sono ligature decorative che vengono attivate opzionalmente a discrezione del designer. Non sono necessarie per la leggibilità e vengono utilizzate per la stilizzazione del testo: ct, st, sp, Th, Qu e altre. Le ligature discrezionali si trovano spesso in font con carattere storico o calligrafico — ad esempio, in Garamond o Adobe Caslon. Attenzione: un eccesso di ligature discrezionali compromette la leggibilità, soprattutto per gli utenti con dislessia.

Ligature contestuali (tag ‘clig’) sono ligature che dipendono dal contesto circostante del carattere. Vengono applicate solo in determinate condizioni: se il carattere è all’inizio o alla fine di una parola, dopo un segno di punteggiatura specifico, ecc. Le ligature contestuali sono una funzionalità OpenType avanzata non supportata da tutti i font. Ligature storiche (tag ‘hlig’) sono ligature obsolete che imitano lo stile dei vecchi libri stampati (long s, &). Vengono usate raramente, solo in testi storici o stilizzati.

Tipi rari: esistono anche ligature per la composizione matematica (tag ‘dlig’ per simboli matematici) e ligature di iniziali (capolettera), ma non vengono utilizzate nella tipografia di interfaccia e sono supportate solo da font specializzati.

Storia delle ligature: dal carattere metallico ai font digitali

Le ligature sono apparse molto prima della tipografia digitale — già nell’era del carattere metallico nel XV secolo. Il primo stampatore Johannes Gutenberg utilizzava ligature per risparmiare spazio nelle righe della sua Bibbia a 42 righe. Ogni carattere era un blocco metallico fisico, e combinare due caratteri in un unico pezzo risparmiava piombo e semplificava la composizione. Le ligature standard fi, fl, ffi, ffl sono un’eredità di quell’epoca.

Nella fotocomposizione (XX secolo), le ligature persero la loro funzione pratica ma rimasero come elemento estetico della tipografia di qualità. I designer di font continuarono a includere ligature nei loro caratteri, poiché divennero un segno di professionalità e attenzione ai dettagli. Nell’era dei font digitali (PostScript, TrueType), le ligature venivano implementate come glifi separati con sostituzione programmatica.

OpenType (1996) fu una rivoluzione: introdusse il meccanismo GSUB (Glyph Substitution Table), che sostituisce automaticamente una sequenza di caratteri con una ligatura senza intervento dell’utente. GSUB supporta sostituzioni contestuali, condizioni e varianti di fallback. Ciò ha permesso ai font di avere centinaia di ligature attivabili/disattivabili tramite tag. Font moderni — SF Pro, Roboto, Inter — supportano le ligature OpenType su tutte le piattaforme: iOS, Android, macOS, Windows, web.

Implementazione delle ligature su iOS tramite UIFontDescriptor

Su iOS, le ligature possono essere controllate tramite UIFontDescriptor utilizzando l’attributo featureSettings. Questo attributo accetta un array di dizionari, ciascuno dei quali descrive una funzionalità OpenType. Controllare le ligature tramite un descrittore è l’unico modo per gestire singoli tipi di ligature senza influenzare altre funzionalità OpenType del font.

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

// Attiva ligature discrezionali
let ligatureDescriptor = descriptor.addingAttributes([
    .featureSettings: [
        [
            UIFontDescriptor.FeatureIdentifier: kLigaturesType,
            UIFontDescriptor.TypeIdentifier: kCommonLigaturesOnSelector
        ]
    ]
])

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

NSAttributedString supporta anche l’attributo ligature: NSNumber. Il valore 0 disattiva tutte le ligature, 1 attiva standard (predefinito), 2 attiva tutte (incluse discrezionali). Tuttavia, l’attributo ligature in NSAttributedString non fornisce un controllo fine sui tipi di ligature — solo attivazione/disattivazione globale. Per un controllo selettivo, utilizza UIFontDescriptor con featureSettings.

SwiftUI non fornisce un modificatore diretto per le ligature. Per controllare le ligature in SwiftUI, crea un UIFont con le impostazioni desiderate tramite UIFontDescriptor e usalo attraverso Font(descriptor:size:). In alternativa, utilizza AttributedString (iOS 15+) con l’attributo .ligature per NSMutableAttributedString nelle viste AppKit/UIKit.

// SwiftUI con ligature personalizzate tramite AttributedString
var attributedText: AttributedString {
    var text = AttributedString(
        "Effective typography with ligatures"
    )

    // Attiva tutte le ligature per l’intero testo
    text.ligature = .all

    return text
}

var body: some View {
    Text(attributedText)
}

Controllo delle ligature in CSS e Android

Sul web, le ligature sono controllate tramite la proprietà CSS font-variant-ligatures, che accetta parole chiave: common-ligatures (standard attivate), no-common-ligatures (standard disattivate), discretionary-ligatures, no-discretionary-ligatures, contextual, no-contextual. La proprietà è supportata da tutti i browser moderni dal 2015. Per impostazione predefinita, i browser attivano le ligature standard e contestuali.

/* 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 non ha un’API diretta per controllare le ligature. Su Android, le ligature sono controllate a livello di font e dal motore di rendering Minikin (Android 10+). Se il font contiene una tabella OpenType GSUB, le ligature vengono applicate automaticamente. Per disattivare le ligature su Android, vengono utilizzati Typeface personalizzati creati tramite Typeface.Builder o la pre-elaborazione del testo (sostituzione dei caratteri prima della visualizzazione). Limitazione: su Android precedente alla versione 10, le ligature potrebbero non funzionare correttamente con alcuni font TTF.

Controllo di basso livello: su tutte le piattaforme, è possibile utilizzare CSS @font-face con il parametro font-feature-settings per le funzionalità OpenType. Questo metodo fornisce accesso a qualsiasi tag OpenType, incluse le ligature. Esempio: font-feature-settings: ‘liga’ 1, ‘dlig’ 1. Tuttavia, font-feature-settings è una sintassi di basso livello e MDN raccomanda di utilizzare font-variant-ligatures come alternativa di livello superiore.

Ligature nei font di programmazione

Una classe speciale di ligature — ligature di programmazione — combina operatori e simboli di codice in glifi più leggibili. I font di programmazione come Fira Code, JetBrains Mono, Cascadia Code includono ligature discrezionali per operatori comuni: != (diventa ≠), >= (diventa ≥), -> (diventa freccia), => (diventa freccia spessa), === (diventa triplo uguale).

Le ligature di programmazione sono un argomento controverso nella comunità degli sviluppatori. I sostenitori sostengono che le ligature accelerano la lettura del codice perché gli operatori vengono percepiti come concetti unici. Uno studio (Kera et al., PLATEAU 2020) ha mostrato che le ligature non influenzano la velocità di lettura del codice, ma il 67% degli sviluppatori le apprezza soggettivamente. Gli oppositori delle ligature notano che distorcono il codice: il simbolo != nell’editor viene visualizzato come ≠, ma nel file di testo viene memorizzato come due caratteri, il che può creare confusione durante la collaborazione.

Implementazione tecnica: le ligature di programmazione sono ligature discrezionali OpenType (tag ‘dlig’). Sono disattivate per impostazione predefinita e vengono attivate nell’editor di codice tramite le impostazioni del font. Gli sviluppatori che utilizzano tali font devono configurare l’editor per attivare le ligature discrezionali. Nei terminali (iTerm2, Windows Terminal), le ligature sono supportate anche tramite le impostazioni del font. Compatibilità: non tutti gli editor e i terminali supportano le ligature OpenType. Prima di scegliere un font, verifica la compatibilità con il tuo ambiente di strumenti.

// Esempio: ligature di operatori in JetBrains Mono
val isEqual = a != b  // != renderizzato come ≠
val arrow = x -> x + 1  // -> renderizzato come →
val range = 1 .. 10  // .. renderizzato come intervallo

Font popolari con ligature di programmazione: Fira Code (il primo font di massa con ligature, 2015), JetBrains Mono (ottimizzato per la lettura del codice, 2020), Cascadia Code (di Microsoft, 2019), Iosevka (font personalizzabile con sistema modulare di ligature). Ogni font ha il proprio set di ligature — da 50 a 150+ sostituzioni. Raccomandazione: inizia con Fira Code o JetBrains Mono — hanno il miglior supporto negli editor e negli IDE.