Bold Text sa mga mobile app: ano ito, pag-configure ng bold na teksto

Ano ang Bold Text sa accessibility?

Bold Text — ay isang system setting ng mga operating system na nag-uutos ng paggamit ng bold na font para sa lahat ng tekstwal na elemento ng interface sa halip na standard (regular o normal). Hindi tulad ng simpleng pagpapalaki ng laki ng font, hindi binabago ng Bold Text ang scale — pinapataas nito ang kapal ng mga linya ng letra, ginagawa itong mas puspos at contrast sa background.

Ang function ay kabilang sa kategoryang display accommodations — mga setting ng screen na tumutulong sa mga taong may kapansanan sa paningin na mas kumportableng makita ang impormasyon. Ang Bold Text ay lalong epektibo para sa mababang visual acuity (amblyopia), age-related farsightedness (presbyopia) at ilang anyo ng dyslexia kung saan ang mga letra ay "dodoble" o "lumulutang" sa standard na kapal.

Ang bold na font ay nagpapataas ng readability — bilis at katumpakan ng pagkilala ng mga indibidwal na karakter. Ipinapakita ng pananaliksik ng Usability.gov na ang bold ay nagpapataas ng katumpakan ng pagbasa ng 12–18% sa mga gumagamit na may kapansanan sa paningin kumpara sa regular na font ng parehong laki. Hindi pinapalitan ng Bold Text ang pagpapalaki ng teksto — maaaring pagsamahin ang parehong function.

Pagkakaiba ng Bold Text at pagpapalaki ng font

Ang pangunahing pagkakaiba ng Bold Text at Dynamic Type (iOS) o Font Size (Android) — mekanismo ng epekto. Ang pagpapalaki ng font ay nagbabago ng laki ng mga letra, ang Bold Text — kapal lamang. Sa pagpapalaki ng font, nababawasan ang kapasidad ng screen (kaunting nilalaman ang kasya sa isang screen), pinapanatili ng Bold Text ang bilang ng nakikitang elemento. Para sa mga gumagamit na may presbyopia sa maagang yugto, ang Bold Text ay madalas sapat nang walang pagpapalaki ng teksto.

Sino ang nangangailangan ng Bold Text

Ang pangunahing target na audience ng Bold Text — mga taong may amblyopia (pagbaba ng visual acuity na hindi naitatama ng salamin), presbyopia (age-related farsightedness pagkatapos ng 40–45 taon) at ilang anyo ng dyslexia. Ang function ay kapaki-pakinabang din kapag nagbabasa sa maliwanag na araw — ang bold na font ay nagpapanatili ng contrast sa liwanag na nakasisilaw. Ang mga pantulong na teknolohiya tulad ng VoiceOver at TalkBack ay gumagana nang hiwalay sa Bold Text — ang setting ay nakakaapekto lamang sa visual na display.

Bold Text sa iOS: pag-configure at prinsipyo ng paggana

Sa iOS, ang Bold Text — isa sa pinakamatatandang tampok na accessibility, na lumitaw sa iOS 7 (2013). Ang setting ay nasa Settings > Display & Brightness > Bold Text at nangangailangan ng pag-restart ng iPhone: itinatayo muli ng system ang lahat ng font sa mga system app (Settings, Mail, Messages, Calendar, Notes) at mga third-party na app na gumagamit ng system font na San Francisco.

Sa teknikal, pinapalitan ng iOS ang file ng system font na San Francisco ng Bold variant nito (SF Pro Bold / SF Pro Rounded Bold) sa antas ng CoreText framework. Pagkatapos i-activate ang Bold Text, lahat ng linya sa screen — mula sa mga navigation title hanggang sa teksto ng mga button — ay ipinapakita na may font-weight 700 sa halip na 400. Hindi maaaring i-override ng developer ang gawi na ito para sa mga elemento ng system, ngunit maaaring pamahalaan ang mga font sa kanyang sariling UI sa pamamagitan ng Dynamic Type.

Para sa developer, ang aktibong Bold Text ay nangangahulugan na lahat ng UIFont na may textStyle (.body, .headline, .caption at iba pa) ay awtomatikong nakakakuha ng bold. Ang UIFontWeight ay umiiral sa dalawang variant: regular (0.0) at bold (1.0). Sa aktibong Bold Text, pinapataas ng system ang fontWeight ng 0.3–0.5 para sa bawat estilo. Maaaring suriin ang status sa pamamagitan ng UIAccessibility.isBoldTextEnabled.

Pagsusuri ng Bold Text sa iOS app

Maaaring suriin ng developer kung Bold Text ay aktibo sa device at iakma ang interface. Halimbawa, kung ang mga table header ay gumagamit na ng bold, sa aktibong function ay maaaring kailanganing bawasan ang kapal upang maiwasan ang visual na ingay. Ang code ng pagsusuri ay gumagamit ng UIAccessibility framework.

import UIKit

class BoldTextManager {

    // Pagsusuri ng status ng Bold Text
    static var isBoldTextEnabled: Bool {
        return UIAccessibility.isBoldTextEnabled
    }

    // Pag-aangkop ng font sa Bold Text
    static func adjustedFont(
        textStyle: UIFont.TextStyle,
        weight: UIFont.Weight
    ) -> UIFont {
        let baseFont = UIFont.preferredFont(
            forTextStyle: textStyle
        )
        guard isBoldTextEnabled else {
            return baseFont
        }
        // Binabawasan ang kapal para maiwasan ang 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
        )
    }

    // Naka-cache na font na may suporta sa Bold Text
    static func labelFont() -> UIFont {
        return adjustedFont(
            textStyle: .body,
            weight: .regular
        )
    }
}

// Pag-subscribe sa mga pagbabago ng Bold Text (Notification)
NotificationCenter.default.addObserver(
    self,
    selector: #selector(boldTextStatusChanged),
    name: UIAccessibility.boldTextStatusDidChangeNotification,
    object: nil
)

@objc func boldTextStatusChanged() {
    // Pag-update ng UI kapag nagbago ang Bold Text
    updateFonts()
}

Ang klase na BoldTextManager ay sumusuri ng isBoldTextEnabled, iniakma ang bigat ng font (binabawasan ang heavy/bold sa semibold/medium kapag aktibo ang function) at nag-subscribe sa notification na boldTextStatusDidChangeNotification. Pinipigilan nito ang epekto ng double-bold, kapag ang developer ay gumagamit na ng bold para sa mga header at pinapakapal pa sila ng system.

Epekto sa UITableView at UICollectionView

Ang Bold Text ay nakakaapekto sa layout ng mga cell ng UITableView at UICollectionView, dahil ang pagtaas ng kapal ng font ay maaaring magbago ng taas ng row. Kapag gumagamit ng self-sizing cells (estimatedRowHeight + UITableView.automaticDimension), awtomatikong kinukwenta muli ng iOS ang taas kapag nagbago ang font. Para sa fixed cell heights, kailangang tawagan ng developer ang reloadData() pagkatapos matanggap ang notification na boldTextStatusDidChangeNotification, kung hindi ay maaaring maputol ang teksto.

Pinahusay na Pagiging Madaling Mabasa sa Android: analog ng Bold Text

Sa Android, ang Bold Text function ay tinatawag na "Pinahusay na Pagiging Madaling Mabasa" (Improve readability) sa interface ng mga setting at nasa seksyong "Accessibility". Sa ilang bersyon ng Android, lalo na sa mga Samsung One UI device, ang function ay tinatawag na "Mataas na Contrast na Teksto" o High Contrast Text. Ang setting ay nalalapat sa lahat ng elemento ng system at karamihan sa mga third-party na app.

Ang teknikal na implementasyon ng Android ay naiiba sa iOS: sa halip na palitan ang system font, ina-override ng Android ang Typeface sa antas ng system sa pamamagitan ng Resources.Theme. Kapag na-activate ang setting, binabago ng system ang atribut na android:textStyle para sa lahat ng tekstwal na elemento, nagtatakda ng bold o italic+bold. Maaaring suriin ng developer ang status sa pamamagitan ng Settings.Global.getFloat() o AccessibilityManager.

Pagsusuri ng Bold Text sa Android app

Sa Android walang direktang API na katumbas ng UIAccessibility.isBoldTextEnabled. Ang pagsusuri ay ginagawa sa pamamagitan ng ContentResolver at Settings.System. Ang function ay nakaimbak sa mga global setting bilang font_weight_adjustment. Para sa Jetpack Compose ay accessible sa pamamagitan ng LocalDensity at fontScale.

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

class AndroidBoldTextHelper {

    // Pagsusuri ng pinahusay na pagiging madaling mabasa sa pamamagitan ng system settings
    fun isBoldTextEnabled(context: Context): Boolean {
        return try {
            Settings.System.getInt(
                context.contentResolver,
                "font_weight_adjustment"
            ) == 1
        } catch (e: Settings.SettingNotFoundException) {
            false
        }
    }

    // Jetpack Compose — pag-aangkop ng 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 — paglalapat sa pamamagitan ng TypedValue
    fun applyBoldStyleFix(context: Context, textView: android.widget.TextView) {
        if (isBoldTextEnabled(context)) {
            val paint = textView.paint
            val fakeBold = paint.isFakeBoldText
            // Binabawasan ang fakeBold kung naka-activate na ng system
            if (fakeBold) {
                paint.isFakeBoldText = false
                textView.invalidate()
            }
        }
    }
}

Ang klase na AndroidBoldTextHelper ay nagbabasa ng system setting na font_weight_adjustment, iniaakma ang FontWeight sa Jetpack Compose at tinatanggal ang duplicate na fakeBold sa XML View. Hindi tulad ng iOS, hindi nagbibigay ang Android ng notification channel para sa pagbabago ng Bold Text — sinusuri ng developer ang setting sa pagsisimula ng Activity o sa pamamagitan ng ContentObserver.

ContentObserver para sa pagsubaybay ng mga pagbabago

Para sa pagsubaybay ng mga pagbabago ng Bold Text sa runtime, maaaring gumamit ang Android developer ng ContentObserver. Kapag nagbago ang setting na font_weight_adjustment, inaabisuhan ng system ang ContentResolver, at maaaring i-update ng app ang UI. Ito ay mahalaga para sa AccessibilityService at mga custom na launcher na dapat agad na tumugon sa mga pagbabago sa setting ng gumagamit.

CSS font-weight: mga uri ng kapal ng font

Sa web development, ang kapal ng font ay pinamamahalaan ng CSS property na font-weight na may mga halaga mula 100 (Thin) hanggang 900 (Black). Mga standard na halaga: normal = 400, bold = 700. Ang Bold Text sa operating system ay hindi direktang nakakaapekto sa CSS font-weight — hindi natatanggap ng mga web browser ang system signal tungkol sa aktibong Bold Text sa antas ng CSS. Gayunpaman, maaaring gamitin ng developer ang CSS media function kung sinusuportahan ito ng platform.

Para sa iOS, sinusuportahan ng Safari ang media function na -webkit-text-size-adjust, ngunit walang direktang media query para sa Bold Text. Sa Android, hindi rin nagbibigay ang Chrome ng media query para sa system setting ng bold na teksto. Ang mga web developer ay inirerekomenda na gumamit ng prefers-contrast at prefers-reduced-motion para sa pag-aangkop, at para sa bold na teksto — suriin ang setting sa pamamagitan ng User-Agent o mga backup na style.

Paggamit ng mga variable font (Variable Fonts)

Variable Fonts (OpenType Font Variations) ay nagbibigay-daan sa maayos na pagsasaayos ng kapal ng font sa pamamagitan ng CSS font-weight sa saklaw na 1–999 na may hakbang na 1 yunit. Hindi tulad ng mga standard na font kung saan available lamang ang mga discrete na halaga (400, 700), ang variable fonts ay nagbibigay ng kakayahang pumili ng optimal na kapal para sa bawat gumagamit. Sa mga setting ng accessibility, maaaring gumamit ng mas malawak na saklaw.

/* Variable font na may maayos na pagsasaayos ng kapal */
@font-face {
    font-family: "Inter Variable";
    src: url("/fonts/Inter-Variable.woff2")
        format("woff2-variations");
    font-weight: 100 900;
    font-stretch: 50% 200%;
}

/* Pag-aangkop sa system Bold Text sa pamamagitan ng klase */
.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 — backup approach */
@media (prefers-contrast: more) {
    .content {
        --font-weight-increase: 100;
    }
    .content .text {
        font-weight: calc(
            var(--font-weight-base) +
            var(--font-weight-increase)
        );
    }
}

Sa CSS na halimbawa ay ipinapakita ang pagkonekta ng variable font na Inter Variable, CSS variables para sa pamamahala ng kapal at pag-aangkop sa pamamagitan ng prefers-contrast: more. Ang variable fonts ay nagbibigay-daan sa pagtaas ng font-weight ng 50–100 yunit na may aktibong system Bold Text nang walang pagkawala ng kalidad ng rendering. Para sa pagtukoy ng status ng Bold Text sa client side, maaaring gamitin ang JavaScript check ng User-Agent at class sa html element.

JavaScript detection ng Bold Text sa web page

Dahil ang CSS ay hindi nagbibigay ng direktang media query para sa Bold Text, ang mga web developer ay gumagamit ng JavaScript: gumagawa ng invisible na elemento na may kilalang font, sinusukat ang lapad nito, binabago ang font-weight at ikinukumpara ang pagkakaiba. Kung ang pagkakaiba ay mas malaki kaysa sa inaasahan — malamang na aktibo ang system Bold Text. Ang pamamaraang ito ay ginagamit sa accessibility libraries para sa awtomatikong pagsasaayos ng mga style.

Paano naaapektuhan ng Bold Text ang accessibility ng mga app

Bold Text ay lumulutas ng mga tiyak na problema ng mga gumagamit na may kapansanan sa paningin: pinapataas ang pagkakaiba ng mga simbolo sa amblyopia, binabawasan ang visual na pagkapagod sa mahabang pagbasa at binabayaran ang mababang contrast ng display sa maliwanag na araw. Ayon sa WebAIM Million (2025), 12.3% ng lahat ng pahina ay may teksto na may hindi sapat na contrast — maaaring bahagyang bayaran ng Bold Text ang depektong ito sa panig ng gumagamit.

Para sa developer, ang suporta para sa Bold Text ay bahagi ng mga kinakailangan ng WCAG 2.2: criterion 1.4.1 (Use of Color) at 1.4.3 (Contrast Minimum). Ang app ay dapat maipakita nang tama na may aktibong system setting na Bold Text nang walang pagkawala ng nilalaman, overlap ng mga elemento o pagputol ng teksto. Ang pagsubok na may aktibong Bold Text ay mandatory sa paghahanda para sa publication sa App Store at Google Play.

Mga rekomendasyon sa pagsubok

Kapag sumusubok ng app na may Bold Text suriin: lahat ba ng tekstwal na elemento ay ganap na naipapakita (nang walang pagputol), hindi ba nadodoble ang kapal (double-bold), tama ba ang pagkalkula muli ng taas ng cell sa mga table, hindi ba gumagalaw ang mga elemento relative sa isa't isa. Gamitin ang Accessibility Inspector (Xcode) o Accessibility Scanner (Android) para sa awtomatikong pagtuklas ng mga problema sa Bold Text.

• Xcode Accessibility Inspector — audit ng font na may simulation ng Bold Text mode
• Android Accessibility Scanner — pagsusuri ng contrast ratio at font-weight duplication
• UI Testing — screenshot tests na may aktibo at hindi aktibong Bold Text
• Dynamic Type testing — kombinasyon ng Bold Text + pinalaking font

Kinabukasan ng Bold Text sa mga mobile platform

Ang modernong iOS at Android ay nagpapaunlad ng Bold Text patungo sa mas pinong mga setting: iOS 18 (2024) ay nagdagdag ng per-app font settings kabilang ang kapal, at Android 16 (2025) ay nagpalawak ng API font_weight_adjustment para sa mga developer. Inaasahan na ang mga susunod na bersyon ay magbibigay sa mga web developer ng CSS media query para sa Bold Text, na aalisin ang pangangailangan para sa JS detection.