“Ligadura” en el desarrollo móvil — fundamentos y aplicación de las conexiones de caracteres

Autor: IT Sectr Publicado: 2026-07-24 Tiempo de lectura: 9 min

Ligadura es una combinación gráfica de dos o más caracteres en un único signo tipográfico para mejorar la legibilidad y la estética del texto. Los ejemplos clásicos incluyen los pares fi, fl, ff, ffi — donde el elemento saliente de la letra f se fusiona con el carácter adyacente, evitando un conflicto visual. En el desarrollo móvil y web moderno, las ligaduras se controlan a nivel de fuente a través de las funciones OpenType y son compatibles con iOS, Android y los navegadores. Según MDN Web Docs, la propiedad CSS font-variant-ligatures permite al desarrollador activar y desactivar varios tipos de ligaduras: estándar, discrecionales (decorativas) y contextuales.

Puntos clave

  • Ligadura — combinación de varios caracteres en un elemento gráfico único para mejorar la legibilidad
  • Las ligaduras estándar (fi, fl, ff) están activadas por defecto en las fuentes profesionales
  • Las ligaduras discrecionales (ct, st, sp) son decorativas y se activan opcionalmente
  • En iOS se controlan mediante UIFontDescriptor con featureSettings para las funciones OpenType
  • En las fuentes de programación, las ligaduras combinan operadores: !=, >=, ->, =>

Qué es una ligadura en tipografía

Ligadura es una técnica tipográfica en la que dos o más caracteres se sustituyen por un único glifo especialmente diseñado. El objetivo principal de una ligadura es eliminar conflictos visuales entre caracteres adyacentes y mejorar la percepción del texto. En el par fi, por ejemplo, la protuberancia superior de la letra f choca con el punto de la letra i — la ligadura los fusiona en un único símbolo elegante.

Las ligaduras se dividen en obligatorias (estándar) y opcionales (decorativas). Las ligaduras estándar son pares que se encuentran en la mayoría de las fuentes: fi, fl, ff, ffi, ffl. Se consideran necesarias para una tipografía de calidad y están activadas en la fuente por defecto. Según la Especificación OpenType, las ligaduras estándar se codifican con la etiqueta ‘liga’ y deben estar presentes en cualquier fuente profesional.

Efecto visual: sin ligadura, el par fi parece dos caracteres separados con una colisión no deseada. Con ligadura, parece un símbolo armonioso. La diferencia es especialmente notable en tamaños grandes (títulos, logotipos) y en textos con muchas parejas repetidas (por ejemplo, en alemán con häufigen Buchstabenkombinationen).

Tipos de ligaduras: estándar, discrecionales, contextuales

Las fuentes OpenType admiten varios tipos de ligaduras, cada una con su propia etiqueta y propósito. Estándar (etiqueta ‘liga’) son ligaduras obligatorias activadas por defecto en una fuente. Mejoran la legibilidad y no deben desactivarse sin una razón de peso. Incluyen los pares fi, fl, ff, ffi, ffl y otros específicos de la familia tipográfica.

Ligaduras discrecionales (etiqueta ‘dlig’) son ligaduras decorativas que se activan opcionalmente a criterio del diseñador. No son necesarias para la legibilidad y se utilizan para estilizar el texto: ct, st, sp, Th, Qu y otras. Las ligaduras discrecionales se encuentran a menudo en fuentes de carácter histórico o caligráfico — por ejemplo, en Garamond o Adobe Caslon. Precaución: un exceso de ligaduras discrecionales perjudica la legibilidad, especialmente para usuarios con dislexia.

Ligaduras contextuales (etiqueta ‘clig’) son ligaduras que dependen del contexto circundante del carácter. Se aplican solo bajo ciertas condiciones: si el carácter está al principio o al final de una palabra, después de un signo de puntuación específico, etc. Las ligaduras contextuales son una funcionalidad OpenType avanzada que no todas las fuentes soportan. Ligaduras históricas (etiqueta ‘hlig’) son ligaduras obsoletas que imitan el estilo de los libros impresos antiguos (long s, &). Se usan raramente, solo en textos históricos o estilizados.

Tipo de ligaduraEtiqueta OpenTypeEjemplosPor defecto
Estándarligafi, fl, ff, ffiActivadas
Discrecionalesdligct, st, sp, ThDesactivadas
ContextualescligDepende de la posiciónActivadas
Históricashliglong s, ct (hist.)Desactivadas

Tipos raros: también existen ligaduras para composición matemática (etiqueta ‘dlig’ para símbolos matemáticos) y ligaduras de iniciales (capitulares), pero no se usan en la tipografía de interfaz y solo son compatibles con fuentes especializadas.

Historia de las ligaduras: del tipo metálico a las fuentes digitales

Las ligaduras aparecieron mucho antes de la tipografía digital — ya en la época del tipo metálico en el siglo XV. El primer impresor Johannes Gutenberg usó ligaduras para ahorrar espacio en las líneas de su Biblia de 42 líneas. Cada tipo era un bloque físico de metal, y combinar dos caracteres en una sola pieza ahorraba plomo y simplificaba la composición. Las ligaduras estándar fi, fl, ffi, ffl son un legado de esa época.

En la fotocomposición (siglo XX), las ligaduras perdieron su función práctica pero se mantuvieron como elemento estético de la tipografía de calidad. Los diseñadores de fuentes continuaron incluyendo ligaduras en sus tipografías, ya que se convirtieron en una seña de profesionalismo y atención al detalle. En la era de las fuentes digitales (PostScript, TrueType), las ligaduras se implementaban como glifos separados con sustitución programática.

OpenType (1996) fue una revolución: introdujo el mecanismo GSUB (Glyph Substitution Table), que reemplaza automáticamente una secuencia de caracteres por una ligadura sin intervención del usuario. GSUB admite sustituciones contextuales, condiciones y variantes de respaldo. Esto permitió que las fuentes tuvieran cientos de ligaduras que se activan/desactivan mediante etiquetas. Fuentes modernas — SF Pro, Roboto, Inter — son compatibles con ligaduras OpenType en todas las plataformas: iOS, Android, macOS, Windows, web.

Implementación de ligaduras en iOS mediante UIFontDescriptor

En iOS, las ligaduras se pueden controlar a través de UIFontDescriptor usando el atributo featureSettings. Este atributo acepta un array de diccionarios, cada uno describiendo una funcionalidad OpenType. Controlar las ligaduras a través de un descriptor es la única forma de gestionar tipos individuales de ligaduras sin afectar otras funciones OpenType de la fuente.

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

// Habilitar ligaduras discrecionales
let ligatureDescriptor = descriptor.addingAttributes([
    .featureSettings: [
        [
            UIFontDescriptor.FeatureIdentifier: kLigaturesType,
            UIFontDescriptor.TypeIdentifier: kCommonLigaturesOnSelector
        ]
    ]
])

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

NSAttributedString también soporta el atributo ligature: NSNumber. El valor 0 desactiva todas las ligaduras, 1 activa las estándar (por defecto), 2 activa todas (incluyendo las discrecionales). Sin embargo, el atributo ligature en NSAttributedString no proporciona un control detallado sobre los tipos de ligaduras — solo activación/desactivación global. Para un control selectivo, use UIFontDescriptor con featureSettings.

SwiftUI no proporciona un modificador directo para ligaduras. Para controlar ligaduras en SwiftUI, cree un UIFont con la configuración deseada mediante UIFontDescriptor y úselo a través de Font(descriptor:size:). Alternativamente, use AttributedString (iOS 15+) con el atributo .ligature para NSMutableAttributedString en vistas AppKit/UIKit.

swift
// SwiftUI con ligaduras personalizadas mediante AttributedString
var attributedText: AttributedString {
    var text = AttributedString(
        "Effective typography with ligatures"
    )

    // Habilitar todas las ligaduras para todo el texto
    text.ligature = .all

    return text
}

var body: some View {
    Text(attributedText)
}

Control de ligaduras en CSS y Android

En la web, las ligaduras se controlan mediante la propiedad CSS font-variant-ligatures, que acepta palabras clave: common-ligatures (estándar activadas), no-common-ligatures (estándar desactivadas), discretionary-ligatures, no-discretionary-ligatures, contextual, no-contextual. La propiedad es compatible con todos los navegadores modernos desde 2015. Por defecto, los navegadores activan las ligaduras estándar y contextuales.

css
/* 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 no tiene una API directa para controlar ligaduras. En Android, las ligaduras se controlan a nivel de fuente y mediante el motor de renderizado Minikin (Android 10+). Si la fuente contiene una tabla OpenType GSUB, las ligaduras se aplican automáticamente. Para desactivar ligaduras en Android, se utilizan Typeface personalizados creados mediante Typeface.Builder o preprocesamiento de texto (reemplazo de caracteres antes de la visualización). Limitación: en Android anterior a 10, las ligaduras pueden no funcionar correctamente con algunas fuentes TTF.

Control de bajo nivel: en todas las plataformas se puede usar CSS @font-face con el parámetro font-feature-settings para funciones OpenType. Este método proporciona acceso a cualquier etiqueta OpenType, incluidas las ligaduras. Ejemplo: font-feature-settings: ‘liga’ 1, ‘dlig’ 1. Sin embargo, font-feature-settings es una sintaxis de bajo nivel, y MDN recomienda usar font-variant-ligatures como alternativa de más alto nivel.

Ligaduras en fuentes de programación

Una clase especial de ligaduras — ligaduras de programación — combinan operadores y símbolos de código en glifos más legibles. Las fuentes de programación como Fira Code, JetBrains Mono, Cascadia Code incluyen ligaduras discrecionales para operadores comunes: != (se convierte en ≠), >= (se convierte en ≥), -> (se convierte en flecha), => (se convierte en flecha gruesa), === (se convierte en triple igual).

Las ligaduras de programación son un tema controvertido en la comunidad de desarrolladores. Los partidarios afirman que las ligaduras aceleran la lectura del código, ya que los operadores se perciben como conceptos únicos. Un estudio (Kera et al., PLATEAU 2020) mostró que las ligaduras no afectan la velocidad de lectura del código, pero al 67% de los desarrolladores les gustan subjetivamente. Los opositores señalan que las ligaduras distorsionan el código: el símbolo != en el editor se muestra como ≠, pero en el archivo de texto se almacena como dos caracteres, lo que puede ser confuso durante la colaboración.

Implementación técnica: las ligaduras de programación son ligaduras discrecionales OpenType (etiqueta ‘dlig’). Están desactivadas por defecto y se activan en el editor de código mediante la configuración de la fuente. Los desarrolladores que usan estas fuentes deben configurar el editor para activar las ligaduras discrecionales. En terminales (iTerm2, Windows Terminal), las ligaduras también son compatibles mediante la configuración de la fuente. Compatibilidad: no todos los editores y terminales soportan ligaduras OpenType. Antes de elegir una fuente, verifique la compatibilidad con su conjunto de herramientas.

kotlin
// Ejemplo: ligaduras de operadores en JetBrains Mono
val isEqual = a != b  // != se representa como ≠
val arrow = x -> x + 1  // -> se representa como →
val range = 1 .. 10  // .. se representa como rango

Fuentes populares con ligaduras de programación: Fira Code (la primera fuente masiva con ligaduras, 2015), JetBrains Mono (optimizada para lectura de código, 2020), Cascadia Code (de Microsoft, 2019), Iosevka (fuente personalizable con sistema modular de ligaduras). Cada fuente tiene su propio conjunto de ligaduras — de 50 a 150+ sustituciones. Recomendación: empiece con Fira Code o JetBrains Mono — tienen el mejor soporte en editores e IDE.

Preguntas frecuentes

¿Cómo desactivar las ligaduras en iOS?

Establezca attribute ligature = 0 en NSAttributedString o use UIFontDescriptor con kCommonLigaturesOffSelector. En SwiftUI, cree un AttributedString con .ligature = .disabled.

¿En qué se diferencia una ligadura del kerning?

Ligadura reemplaza dos caracteres por un nuevo glifo, cambiando su forma. Kerning ajusta el espacio entre caracteres sin cambiar su forma. La ligadura es una conexión gráfica; el kerning es un ajuste espacial.

¿Android admite ligaduras?

Sí, a partir de Android 10 (API 29). El renderizado Minikin es totalmente compatible con las tablas OpenType GSUB. En versiones anteriores, la compatibilidad depende del fabricante del dispositivo y la versión del motor de fuentes.

¿Debería usar ligaduras en la interfaz de una aplicación?

Para el texto del cuerpo, las ligaduras estándar (fi, fl, ff) son suficientes — mejoran la legibilidad y son invisibles para el usuario. Use ligaduras discrecionales solo en títulos o texto decorativo, ya que reducen la legibilidad en textos largos.

¿Por qué las ligaduras no se muestran en todos los editores de código?

El editor debe ser compatible con la etiqueta OpenType ‘dlig’ y poder mostrar ligaduras discrecionales. VS Code, IntelliJ IDEA, Sublime Text las soportan. Los terminales y editores antiguos (nano, vim sin GUI) no. Verifique la configuración del editor: active font-ligatures.

Resumen

  • Ligadura — combinación de varios caracteres en un elemento gráfico para estética y legibilidad
  • Las ligaduras estándar (fi, fl, ff) están activadas por defecto en fuentes profesionales
  • Las ligaduras discrecionales (ct, st, sp) son decorativas, se activan mediante CSS font-variant-ligatures
  • En iOS se controlan mediante UIFontDescriptor con featureSettings o el atributo ligature
  • En la web se controlan mediante font-variant-ligatures o font-feature-settings (‘liga’, ‘dlig’)
  • Las ligaduras de programación (Fira Code, JetBrains Mono) combinan operadores: !=, >=, ->
  • Para tipografía de interfaz, use solo ligaduras estándar — las discrecionales reducen la legibilidad

Desarrollaremos una aplicación móvil llave en mano

IT Sectr crea aplicaciones para iOS y Android para startups y empresas desde 2017. Le asesoraremos y le propondremos la mejor solución.

Discutir el proyecto

Lea también