“Ligature” trong phát triển mobile — cơ bản và ứng dụng kết nối ký tự

Ligature trong typography là gì

Ligature là một kỹ thuật typographic trong đó hai hoặc nhiều ký tự được thay thế bằng một glyph đơn lẻ được thiết kế đặc biệt. Mục đích chính của ligature là loại bỏ xung đột thị giác giữa các ký tự liền kề và cải thiện nhận thức văn bản. Trong cặp fi, ví dụ, phần nhô lên trên của chữ f va chạm với dấu chấm của chữ i — ligature hợp nhất chúng thành một biểu tượng thanh lịch duy nhất.

Ligature được chia thành bắt buộc (tiêu chuẩn) và tùy chọn (trang trí). Ligature tiêu chuẩn là các cặp được tìm thấy trong hầu hết các phông chữ: fi, fl, ff, ffi, ffl. Chúng được coi là cần thiết cho typography chất lượng và được bật theo mặc định trong phông chữ. Theo Thông số kỹ thuật OpenType, ligature tiêu chuẩn được mã hóa bằng thẻ 'liga' và phải có mặt trong bất kỳ phông chữ chuyên nghiệp nào.

Hiệu ứng thị giác: không có ligature, cặp fi trông giống hai ký tự riêng biệt với sự va chạm không mong muốn. Với ligature, nó trông giống một biểu tượng hài hòa. Sự khác biệt đặc biệt rõ ràng ở kích thước lớn (tiêu đề, logo) và trong văn bản có nhiều cặp lặp lại (ví dụ, trong tiếng Đức với häufigen Buchstabenkombinationen).

Các loại ligature: tiêu chuẩn, tùy ý, ngữ cảnh

Phông chữ OpenType hỗ trợ một số loại ligature, mỗi loại có thẻ và mục đích riêng. Tiêu chuẩn (thẻ 'liga') là các ligature bắt buộc được bật theo mặc định trong phông chữ. Chúng cải thiện khả năng đọc và không nên tắt mà không có lý do chính đáng. Bao gồm các cặp fi, fl, ff, ffi, ffl và các cặp khác đặc thù cho từng kiểu chữ.

Ligature tùy ý (thẻ 'dlig') là các ligature trang trí được bật tùy chọn theo quyết định của nhà thiết kế. Chúng không cần thiết cho khả năng đọc và được sử dụng để tạo kiểu văn bản: ct, st, sp, Th, Qu và các loại khác. Ligature tùy ý thường được tìm thấy trong các phông chữ có tính chất lịch sử hoặc thư pháp — ví dụ, trong Garamond hoặc Adobe Caslon. Cảnh báo: quá nhiều ligature tùy ý làm giảm khả năng đọc, đặc biệt đối với người dùng mắc chứng khó đọc.

Ligature ngữ cảnh (thẻ 'clig') là các ligature phụ thuộc vào ngữ cảnh xung quanh của ký tự. Chúng chỉ được áp dụng trong các điều kiện nhất định: nếu ký tự ở đầu hoặc cuối từ, sau một dấu câu cụ thể, v.v. Ligature ngữ cảnh là một tính năng OpenType nâng cao không được tất cả các phông chữ hỗ trợ. Ligature lịch sử (thẻ 'hlig') là các ligature cũ mô phỏng phong cách sách in cũ (long s, &). Chúng hiếM khi được sử dụng, chỉ trong các văn bản lịch sử hoặc cách điệu.

Loại hiếM: cũng có ligature cho sắp chữ toán học (thẻ 'dlig' cho ký hiệu toán học) và ligature chữ cái đầu (drop caps), nhưng chúng không được sử dụng trong typography giao diện và chỉ được hỗ trợ bởi các phông chữ chuyên dụng.

Lịch sử ligature: từ chữ kim loại đến phông chữ kỹ thuật số

Ligature xuất hiện rất lâu trước typography kỹ thuật số — từ thời đại chữ kim loại vào thế kỷ 15. Người in ấn đầu tiên Johannes Gutenberg đã sử dụng ligature để tiết kiệm không gian trong các dòng của cuốn Kinh Thánh 42 dòng của ông. Mỗi chữ cái là một khối kim loại vật lý, và việc kết hợp hai ký tự thành một mảnh duy nhất giúp tiết kiệm chì và đơn giản hóa việc sắp chữ. Các ligature tiêu chuẩn fi, fl, ffi, ffl là di sản của thời đại đó.

Trong sắp chữ ảnh (thế kỷ 20), ligature mất đi chức năng thực tiễn nhưng vẫn tồn tại như một yếu tố thẩm mỹ của typography chất lượng. Các nhà thiết kế phông chữ tiếp tục bao gồm ligature trong các kiểu chữ của họ vì chúng trở thành dấu hiệu của sự chuyên nghiệp và chú ý đến chi tiết. Trong kỷ nguyên phông chữ kỹ thuật số (PostScript, TrueType), ligature được triển khai dưới dạng các glyph riêng biệt với sự thay thế lập trình.

OpenType (1996) là một cuộc cách mạng: nó giới thiệu cơ chế GSUB (Bảng thay thế glyph), tự động thay thế một chuỗi ký tự bằng ligature mà không cần sự can thiệp của người dùng. GSUB hỗ trợ thay thế ngữ cảnh, điều kiện và các biến thể dự phòng. Điều này cho phép phông chữ có hàng trăm ligature có thể được bật/tắt thông qua các thẻ. Phông chữ hiện đại — SF Pro, Roboto, Inter — hỗ trợ ligature OpenType trên tất cả các nền tảng: iOS, Android, macOS, Windows, web.

Triển khai ligature trên iOS qua UIFontDescriptor

Trên iOS, ligature có thể được kiểm soát thông qua UIFontDescriptor bằng thuộc tính featureSettings. Thuộc tính này chấp nhận mảng các từ điển, mỗi từ điển mô tả một tính năng OpenType. Kiểm soát ligature thông qua bộ mô tả là cách duy nhất để quản lý các loại ligature riêng lẻ mà không ảnh hưởng đến các tính năng OpenType khác của phông chữ.

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

// Bật ligature tùy ý
let ligatureDescriptor = descriptor.addingAttributes([
    .featureSettings: [
        [
            UIFontDescriptor.FeatureIdentifier: kLigaturesType,
            UIFontDescriptor.TypeIdentifier: kCommonLigaturesOnSelector
        ]
    ]
])

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

NSAttributedString cũng hỗ trợ thuộc tính ligature: NSNumber. Giá trị 0 tắt tất cả ligature, 1 bật tiêu chuẩn (mặc định), 2 bật tất cả (bao gồm tùy ý). Tuy nhiên, thuộc tính ligature trong NSAttributedString không cung cấp kiểm soát chi tiết đối với các loại ligature — chỉ bật/tắt toàn cục. Để kiểm soát chọn lọc, hãy sử dụng UIFontDescriptor với featureSettings.

SwiftUI không cung cấp bộ sửa đổi trực tiếp cho ligature. Để kiểm soát ligature trong SwiftUI, hãy tạo UIFont với cài đặt mong muốn thông qua UIFontDescriptor và sử dụng nó qua Font(descriptor:size:). Thay vào đó, hãy sử dụng AttributedString (iOS 15+) với thuộc tính .ligature cho NSMutableAttributedString trong các chế độ xem AppKit/UIKit.

// SwiftUI với ligature tùy chỉnh qua AttributedString
var attributedText: AttributedString {
    var text = AttributedString(
        "Effective typography with ligatures"
    )

    // Bật tất cả ligature cho toàn bộ văn bản
    text.ligature = .all

    return text
}

var body: some View {
    Text(attributedText)
}

Kiểm soát ligature trong CSS và Android

Trên web, ligature được kiểm soát thông qua thuộc tính CSS font-variant-ligatures, chấp nhận các từ khóa: common-ligatures (tiêu chuẩn bật), no-common-ligatures (tiêu chuẩn tắt), discretionary-ligatures, no-discretionary-ligatures, contextual, no-contextual. Thuộc tính này được tất cả các trình duyệt hiện đại hỗ trợ từ năm 2015. Theo mặc định, trình duyệt bật ligature tiêu chuẩn và ngữ cảnh.

/* 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 không có API trực tiếp để kiểm soát ligature. Trên Android, ligature được kiểm soát ở cấp độ phông chữ và bởi công cụ kết xuất Minikin (Android 10+). Nếu phông chữ chứa bảng OpenType GSUB, ligature được áp dụng tự động. Để tắt ligature trên Android, sử dụng Typeface tùy chỉnh được tạo qua Typeface.Builder hoặc tiền xử lý văn bản (thay thế ký tự trước khi hiển thị). Hạn chế: trên Android dưới 10, ligature có thể không hoạt động chính xác với một số phông chữ TTF.

Kiểm soát cấp thấp: trên tất cả các nền tảng, bạn có thể sử dụng CSS @font-face với tham số font-feature-settings cho các tính năng OpenType. Phương pháp này cung cấp quyền truy cập vào bất kỳ thẻ OpenType nào, bao gồm ligature. Ví dụ: font-feature-settings: 'liga' 1, 'dlig' 1. Tuy nhiên, font-feature-settings là cú pháp cấp thấp và MDN khuyến nghị sử dụng font-variant-ligatures như một thay thế cấp cao hơn.

Ligature trong phông chữ lập trình

Một lớp ligature đặc biệt — ligature lập trình — kết hợp các toán tử và ký hiệu mã thành các glyph dễ đọc hơn. Các phông chữ lập trình như Fira Code, JetBrains Mono, Cascadia Code bao gồm ligature tùy ý cho các toán tử phổ biến: != (trở thành ≠), >= (trở thành ≥), -> (trở thành mũi tên), => (trở thành mũi tên đậm), === (trở thành ba dấu bằng).

Ligature lập trình là một chủ đề gây tranh cãi trong cộng đồng nhà phát triển. Những người ủng hộ cho rằng ligature tăng tốc đọc mã vì các toán tử được cảm nhận như các khái niệm đơn lẻ. Một nghiên cứu (Kera et al., PLATEAU 2020) cho thấy ligature không ảnh hưởng đến tốc đọc đọc mã, nhưng 67% nhà phát triển thích chúng một cách chủ quan. Những người phản đối ligature lưu ý rằng chúng làm sai lệch mã: ký hiệu != trong trình soạn thảo hiển thị dưới dạng ≠, nhưng trong tệp văn bản, nó được lưu dưới dạng hai ký tự, có thể gây nhầm lẫn khi cộng tác.

Triển khai kỹ thuật: ligature lập trình là ligature tùy ý OpenType (thẻ 'dlig'). Chúng bị tắt theo mặc định và được bật trong trình soạn thảo mã thông qua cài đặt phông chữ. Các nhà phát triển sử dụng phông chữ như vậy phải cấu hình trình soạn thảo để bật ligature tùy ý. Trong thiết bị đầu cuối (iTerm2, Windows Terminal), ligature cũng được hỗ trợ thông qua cài đặt phông chữ. Tương thích: không phải tất cả trình soạn thảo và thiết bị đầu cuối đều hỗ trợ ligature OpenType. Trước khi chọn phông chữ, hãy kiểm tra tương thích với bộ công cụ của bạn.

// Ví dụ: ligature toán tử trong JetBrains Mono
val isEqual = a != b  // != được kết xuất dưới dạng ≠
val arrow = x -> x + 1  // -> được kết xuất dưới dạng →
val range = 1 .. 10  // .. được kết xuất dưới dạng phạm vi

Phông chữ phổ biến với ligature lập trình: Fira Code (phông chữ đại chúng đầu tiên có ligature, 2015), JetBrains Mono (được tối ưu hóa để đọc mã, 2020), Cascadia Code (từ Microsoft, 2019), Iosevka (phông chữ có thể tùy chỉnh với hệ thống ligature mô-đun). Mỗi phông chữ có bộ ligature riêng — từ 50 đến 150+ thay thế. Khuyến nghị: bắt đầu với Fira Code hoặc JetBrains Mono — chúng có hỗ trợ tốt nhất trong các trình soạn thảo và IDE.