Bold Text trong ứng dụng di động: nó là gì và cách cấu hình chữ in đậm

Bold Text trong trợ năng là gì?

Bold Text là một cài đặt hệ thống trong các hệ điều hành buộc sử dụng trọng số phông chữ in đậm cho tất cả các thành phần văn bản của giao diện thay vì trọng số tiêu chuẩn (regular hoặc normal). Không giống như chỉ đơn giản tăng kích thước phông chữ, Bold Text không thay đổi tỷ lệ — nó tăng độ dày của nét chữ, làm cho chữ đậm hơn và tương phản hơn trên nền.

Tính năng này thuộc loại display accommodations (điều chỉnh màn hình) — các cài đặt màn hình giúp người khiếm thị cảm nhận thông tin thoải mái hơn. Bold Text đặc biệt hiệu quả đối với thị lực kém (nhược thị), viễn thị do tuổi tác (lão thị) và một số dạng chứng khó đọc, nơi các chữ cái xuất hiện đôi hoặc mờ ở độ dày tiêu chuẩn.

Chữ in đậm làm tăng khả năng đọc — tốc độ và độ chính xác nhận dạng các ký tự riêng lẻ. Các nghiên cứu từ Usability.gov cho thấy kiểu chữ in đậm cải thiện độ chính xác đọc từ 12–18% ở người dùng khiếm thị so với kiểu chữ thông thường cùng cỡ chữ. Tuy nhiên, Bold Text không thay thế việc phóng to văn bản — cả hai tính năng có thể được kết hợp.

Sự khác biệt giữa Bold Text và phóng to phông chữ

Sự khác biệt chính giữa Bold Text và Dynamic Type (iOS) hoặc Font Size (Android) là cơ chế tác động. Phóng to phông chữ thay đổi kích thước chữ cái, trong khi Bold Text chỉ ảnh hưởng đến độ dày. Khi phóng to phông chữ, dung lượng màn hình bị ảnh hưởng (ít nội dung vừa trên một màn hình hơn), trong khi Bold Text bảo toàn số lượng các thành phần hiển thị. Đối với người dùng bị lão thị ở giai đoạn đầu, Bold Text thường đủ mà không cần phóng to văn bản.

Ai cần Bold Text

Đối tượng chính của Bold Text bao gồm những người bị nhược thị (thị lực kém không thể điều chỉnh bằng kính), lão thị (viễn thị do tuổi tác sau 40–45 tuổi) và một số dạng chứng khó đọc. Tính năng này cũng hữu ích khi đọc dưới ánh sáng mặt trời mạnh — chữ in đậm duy trì độ tương phản khi bị chói. Các công nghệ hỗ trợ như VoiceOver và TalkBack hoạt động độc lập với Bold Text — cài đặt chỉ ảnh hưởng đến hiển thị trực quan.

Bold Text trên iOS: cài đặt và nguyên lý hoạt động

Trên iOS, Bold Text là một trong những tính năng trợ năng lâu đời nhất, được giới thiệu trong iOS 7 (2013). Cài đặt nằm trong Settings > Display & Brightness > Bold Text và yêu cầu khởi động lại iPhone: hệ thống xây dựng lại tất cả phông chữ trong các ứng dụng hệ thống (Settings, Mail, Messages, Calendar, Notes) và các ứng dụng bên thứ ba sử dụng phông chữ hệ thống San Francisco.

Về mặt kỹ thuật, iOS thay thế tệp phông chữ hệ thống San Francisco bằng biến thể Bold (SF Pro Bold / SF Pro Rounded Bold) ở cấp độ framework CoreText. Sau khi bật Bold Text, tất cả văn bản trên màn hình — từ tiêu đề điều hướng đến nhãn nút — được hiển thị với font-weight 700 thay vì 400. Nhà phát triển không thể ghi đè hành vi này cho các thành phần hệ thống nhưng có thể quản lý phông chữ trong giao diện của riêng mình thông qua Dynamic Type.

Đối với nhà phát triển, khi Bold Text được bật, tất cả các phiên bản UIFont có textStyle (.body, .headline, .caption và các loại khác) tự động nhận trọng số in đậm. UIFontWeight tồn tại ở hai biến thể: regular (0.0) và bold (1.0). Khi Bold Text hoạt động, hệ thống tăng fontWeight lên 0.3–0.5 cho mỗi kiểu. Trạng thái có thể được kiểm tra qua UIAccessibility.isBoldTextEnabled.

Kiểm tra Bold Text trong ứng dụng iOS

Nhà phát triển có thể kiểm tra xem Bold Text có được bật trên thiết bị hay không và điều chỉnh giao diện cho phù hợp. Ví dụ: nếu tiêu đề bảng đã sử dụng in đậm, việc bật tính năng có thể yêu cầu giảm trọng số phông chữ để tránh nhiễu thị giác. Việc kiểm tra sử dụng framework UIAccessibility.

import UIKit

class BoldTextManager {

    // Kiểm tra trạng thái Bold Text
    static var isBoldTextEnabled: Bool {
        return UIAccessibility.isBoldTextEnabled
    }

    // Điều chỉnh phông chữ cho Bold Text
    static func adjustedFont(
        textStyle: UIFont.TextStyle,
        weight: UIFont.Weight
    ) -> UIFont {
        let baseFont = UIFont.preferredFont(
            forTextStyle: textStyle
        )
        guard isBoldTextEnabled else {
            return baseFont
        }
        // Giảm độ đậm để tránh double-bold
        let adjustedWeight: UIFont.Weight
        switch weight {
        case .bold, .heavy:
            adjustedWeight = .semibold
        case .semibold:
            adjustedWeight = .medium
        default:
            adjustedWeight = weight
        }
        return UIFont.systemFont(
            ofSize: baseFont.pointSize,
            weight: adjustedWeight
        )
    }

    // Phông chữ được lưu trong bộ nhớ đệm hỗ trợ Bold Text
    static func labelFont() -> UIFont {
        return adjustedFont(
            textStyle: .body,
            weight: .regular
        )
    }
}

// Đăng ký thay đổi Bold Text (Thông báo)
NotificationCenter.default.addObserver(
    self,
    selector: #selector(boldTextStatusChanged),
    name: UIAccessibility.boldTextStatusDidChangeNotification,
    object: nil
)

@objc func boldTextStatusChanged() {
    // Cập nhật giao diện khi Bold Text thay đổi
    updateFonts()
}

Lớp BoldTextManager kiểm tra isBoldTextEnabled, điều chỉnh trọng số phông chữ (giảm heavy/bold xuống semibold/medium khi tính năng hoạt động) và đăng ký boldTextStatusDidChangeNotification. Điều này ngăn chặn hiệu ứng double-bold, nơi nhà phát triển đã sử dụng in đậm cho tiêu đề và hệ thống làm đậm chúng hơn nữa.

Tác động đến UITableView và UICollectionView

Bold Text ảnh hưởng đến bố cục của các ô UITableView và UICollectionView, vì tăng độ dày phông chữ có thể thay đổi chiều cao hàng. Khi sử dụng ô tự động điều chỉnh kích thước (estimatedRowHeight + UITableView.automaticDimension), iOS tự động tính toán lại chiều cao khi phông chữ thay đổi. Đối với chiều cao ô cố định, nhà phát triển cần gọi reloadData() sau khi nhận boldTextStatusDidChangeNotification, nếu không văn bản có thể bị cắt.

Improve Readability trên Android: tương đương với Bold Text

Trên Android, tính năng Bold Text được gọi là “Improve Readability” trong giao diện cài đặt và nằm trong phần Trợ năng. Trên một số phiên bản Android, đặc biệt là trên thiết bị Samsung One UI, tính năng này được gọi là “High Contrast Text.” Cài đặt áp dụng cho tất cả các thành phần hệ thống và hầu hết các ứng dụng bên thứ ba.

Việc triển khai kỹ thuật trên Android khác với iOS: thay vì thay thế phông chữ hệ thống, Android ghi đè Typeface ở cấp hệ thống thông qua Resources.Theme. Khi cài đặt được kích hoạt, hệ thống thay đổi thuộc tính android:textStyle cho tất cả các thành phần văn bản, đặt bold hoặc italic+bold. Nhà phát triển có thể kiểm tra trạng thái qua Settings.Global.getFloat() hoặc AccessibilityManager.

Kiểm tra Bold Text trong ứng dụng Android

Trên Android, không có API trực tiếp tương đương với UIAccessibility.isBoldTextEnabled. Việc kiểm tra được thực hiện thông qua ContentResolver và Settings.System. Cài đặt được lưu trữ trong tùy chọn toàn cục dưới dạng font_weight_adjustment. Đối với Jetpack Compose, nó có thể truy cập qua LocalDensity và fontScale.

import android.content.Context
import android.provider.Settings
import android.util.TypedValue
import androidx.compose.ui.text.font.FontWeight

class AndroidBoldTextHelper {

    // Kiểm tra khả năng đọc được cải thiện qua cài đặt hệ thống
    fun isBoldTextEnabled(context: Context): Boolean {
        return try {
            Settings.System.getInt(
                context.contentResolver,
                "font_weight_adjustment"
            ) == 1
        } catch (e: Settings.SettingNotFoundException) {
            false
        }
    }

    // Jetpack Compose — điều chỉnh FontWeight
    fun adjustFontWeight(
        context: Context,
        original: FontWeight
    ): FontWeight {
        if (!isBoldTextEnabled(context)) return original

        return when (original) {
            FontWeight.Bold, FontWeight.ExtraBold -> FontWeight.SemiBold
            FontWeight.SemiBold -> FontWeight.Medium
            else -> original
        }
    }

    // XML View — áp dụng qua TypedValue
    fun applyBoldStyleFix(context: Context, textView: android.widget.TextView) {
        if (isBoldTextEnabled(context)) {
            val paint = textView.paint
            val fakeBold = paint.isFakeBoldText
            // Giảm fakeBold nếu đã được bật bởi hệ thống
            if (fakeBold) {
                paint.isFakeBoldText = false
                textView.invalidate()
            }
        }
    }
}

Lớp AndroidBoldTextHelper đọc cài đặt hệ thống font_weight_adjustment, điều chỉnh FontWeight trong Jetpack Compose và loại bỏ fakeBold trùng lặp trong XML View. Không giống như iOS, Android không cung cấp kênh thông báo cho các thay đổi Bold Text — nhà phát triển kiểm tra cài đặt khi khởi động Activity hoặc thông qua ContentObserver.

ContentObserver để theo dõi thay đổi

Để theo dõi các thay đổi Bold Text trong thời gian chạy, nhà phát triển Android có thể sử dụng ContentObserver. Khi cài đặt font_weight_adjustment thay đổi, hệ thống thông báo cho ContentResolver và ứng dụng có thể cập nhật giao diện của mình. Điều này quan trọng đối với AccessibilityService và trình khởi chạy tùy chỉnh phải phản hồi ngay lập tức với các thay đổi cài đặt của người dùng.

CSS font-weight: các loại độ đậm của phông chữ

Trong phát triển web, độ đậm của phông chữ được kiểm soát bởi thuộc tính CSS font-weight với các giá trị từ 100 (Thin) đến 900 (Black). Các giá trị tiêu chuẩn bao gồm normal = 400 và bold = 700. Bold Text trong hệ điều hành không ảnh hưởng trực tiếp đến CSS font-weight — trình duyệt web không nhận được tín hiệu hệ thống về Bold Text được bật ở cấp độ CSS. Tuy nhiên, nhà phát triển có thể sử dụng tính năng media CSS nếu nền tảng hỗ trợ.

Đối với iOS, Safari hỗ trợ chức năng media -webkit-text-size-adjust nhưng không có truy vấn media trực tiếp cho Bold Text. Trên Android, Chrome cũng không cung cấp truy vấn media cho cài đặt chữ in đậm của hệ thống. Các nhà phát triển web được khuyên nên sử dụng prefers-contrast và prefers-reduced-motion để thích ứng, và đối với chữ in đậm — kiểm tra cài đặt qua User-Agent hoặc kiểu dự phòng.

Sử dụng phông chữ biến thiên (Variable Fonts)

Phông chữ biến thiên (OpenType Font Variations) cho phép điều chỉnh độ đậm của phông chữ một cách mượt mà thông qua CSS font-weight trong phạm vi 1–999 với bước nhảy 1 đơn vị. Không giống như phông chữ tiêu chuẩn chỉ có các giá trị rời rạc (400, 700), phông chữ biến thiên cho phép chọn trọng số tối ưu cho mỗi người dùng. Có thể sử dụng phạm vi rộng hơn cho cài đặt trợ năng.

/* Phông chữ biến thiên với điều chỉnh độ dày mượt mà */
@font-face {
    font-family: "Inter Variable";
    src: url("/fonts/Inter-Variable.woff2")
        format("woff2-variations");
    font-weight: 100 900;
    font-stretch: 50% 200%;
}

/* Thích ứng với Bold Text hệ thống qua lớp */
.bold-text-enabled {
    --font-weight-body: 500;
    --font-weight-heading: 700;
}

.bold-text-enabled .text-body {
    font-weight: var(--font-weight-body);
}

.bold-text-enabled .text-heading {
    font-weight: var(--font-weight-heading);
}

/* prefers-contrast: more — phương pháp dự phòng */
@media (prefers-contrast: more) {
    .content {
        --font-weight-increase: 100;
    }
    .content .text {
        font-weight: calc(
            var(--font-weight-base) +
            var(--font-weight-increase)
        );
    }
}

Ví dụ CSS cho thấy cách tải phông chữ biến thiên Inter Variable, sử dụng thuộc tính tùy chỉnh CSS để kiểm soát trọng số và thích ứng qua prefers-contrast: more. Phông chữ biến thiên cho phép tăng font-weight lên 50–100 đơn vị khi Bold Text hệ thống được bật mà không mất chất lượng kết xuất. Để phát hiện trạng thái Bold Text trên máy khách, JavaScript có thể kiểm tra User-Agent và thêm một lớp vào phần tử html.

Phát hiện Bold Text bằng JavaScript trên trang web

Vì CSS không cung cấp truy vấn media trực tiếp cho Bold Text, các nhà phát triển web sử dụng JavaScript: họ tạo một phần tử vô hình với phông chữ đã biết, đo chiều rộng của nó, thay đổi font-weight và so sánh sự khác biệt. Nếu sự khác biệt lớn hơn dự kiến, Bold Text hệ thống có khả năng đang hoạt động. Phương pháp này được sử dụng trong các thư viện trợ năng để tự động điều chỉnh kiểu.

Bold Text ảnh hưởng đến khả năng truy cập ứng dụng như thế nào

Bold Text giải quyết các vấn đề cụ thể của người dùng khiếm thị: cải thiện khả năng phân biệt ký tự ở người nhược thị, giảm mỏi mắt khi đọc lâu và bù đắp độ tương phản màn hình thấp dưới ánh sáng mặt trời mạnh. Theo WebAIM Million (2025), 12.3% tổng số trang có văn bản với độ tương phản không đủ — Bold Text có thể bù đắp một phần khiếm khuyết này ở phía người dùng.

Đối với nhà phát triển, hỗ trợ Bold Text là một phần của yêu cầu WCAG 2.2: tiêu chí 1.4.1 (Sử dụng màu sắc) và 1.4.3 (Độ tương phản tối thiểu). Ứng dụng phải hiển thị chính xác với cài đặt Bold Text hệ thống được bật mà không mất nội dung, chồng chéo thành phần hoặc cắt xén văn bản. Kiểm tra với Bold Text được bật là bắt buộc khi chuẩn bị xuất bản lên App Store và Google Play.

Khuyến nghị kiểm tra

Khi kiểm tra ứng dụng với Bold Text, hãy kiểm tra: tất cả các thành phần văn bản có hiển thị đầy đủ không (không bị cắt), độ đậm có bị trùng lặp không (double-bold), chiều cao ô trong bảng có được tính toán lại chính xác không và các thành phần có dịch chuyển so với nhau không. Sử dụng Accessibility Inspector (Xcode) hoặc Accessibility Scanner (Android) để tự động phát hiện các vấn đề với Bold Text.

• Xcode Accessibility Inspector — kiểm tra phông chữ với mô phỏng chế độ Bold Text
• Android Accessibility Scanner — kiểm tra tỷ lệ tương phản và trùng lặp font-weight
• Kiểm tra UI — kiểm tra ảnh chụp màn hình với Bold Text được bật và tắt
• Kiểm tra Dynamic Type — kết hợp Bold Text + phông chữ phóng to

Tương lai của Bold Text trên các nền tảng di động

iOS và Android hiện đại đang phát triển Bold Text theo hướng kiểm soát chi tiết hơn: iOS 18 (2024) đã thêm cài đặt phông chữ cho từng ứng dụng, bao gồm trọng số in đậm và Android 16 (2025) đã mở rộng API font_weight_adjustment cho nhà phát triển. Các phiên bản tương lai dự kiến sẽ cung cấp truy vấn media CSS cho Bold Text, loại bỏ nhu cầu phát hiện bằng JavaScript.