Bold Text w aplikacjach mobilnych: co to jest, konfiguracja pogrubionego tekstu

Czym jest Bold Text w dostępności?

Bold Text — to systemowe ustawienie systemów operacyjnych, które nakazuje używanie pogrubionej czcionki dla wszystkich elementów tekstowych interfejsu zamiast standardowej (regular lub normal). W przeciwieństwie do prostego zwiększenia rozmiaru czcionki, Bold Text nie zmienia skali — zwiększa grubość linii liter, czyniąc je bardziej nasyconymi i kontrastowymi na tle.

Funkcja należy do kategorii display accommodations — ustawień ekranu, pomagających osobom z zaburzeniami wzroku wygodniej odbierać informacje. Bold Text jest szczególnie skuteczny przy niskiej ostrości wzroku (ambliopia), starczowzroczności (presbiopia) i niektórych formach dysleksji, przy których litery „podwajają się” lub „pływają” przy standardowej grubości.

Pogrubiona czcionka zwiększa readability — szybkość i dokładność rozpoznawania poszczególnych znaków. Badania Usability.gov pokazują, że pogrubienie zwiększa dokładność czytania o 12–18% u użytkowników z zaburzeniami wzroku w porównaniu do zwykłej czcionki tego samego rozmiaru. Przy tym Bold Text nie zastępuje powiększenia tekstu — obie funkcje można łączyć.

Różnica między Bold Text a powiększeniem czcionki

Kluczowa różnica między Bold Text a Dynamic Type (iOS) lub Font Size (Android) — mechanizm działania. Powiększenie czcionki zmienia rozmiar liter, Bold Text — tylko grubość. Przy powiększeniu czcionki cierpi pojemność ekranu (na jeden ekran mieści się mniej treści), Bold Text zachowuje liczbę widocznych elementów. Dla użytkowników z presbiopią we wczesnych stadiach Bold Text często jest wystarczający bez powiększania tekstu.

Kto potrzebuje Bold Text

Główna grupa docelowa Bold Text — osoby z ambliopią (obniżenie ostrości wzroku, nieskorygowane okularami), presbiopią (starczowzroczność po 40–45 roku życia) i niektórymi formami dysleksji. Funkcja jest również przydatna podczas czytania w jasnym słońcu — pogrubiona czcionka zachowuje kontrastowość przy odblaskach. Technologie wspomagające, takie jak VoiceOver i TalkBack, działają niezależnie od Bold Text — ustawienie wpływa tylko na wyświetlanie wizualne.

Bold Text w iOS: konfiguracja i zasada działania

W iOS Bold Text — jedna z najstarszych funkcji dostępności, która pojawiła się w iOS 7 (2013). Ustawienie znajduje się w Settings > Display & Brightness > Bold Text i wymaga ponownego uruchomienia iPhone'a: system przebudowuje wszystkie czcionki w aplikacjach systemowych (Settings, Mail, Messages, Calendar, Notes) i aplikacjach zewnętrznych, które używają systemowej czcionki San Francisco.

Technicznie iOS zastępuje plik systemowej czcionki San Francisco na jej pogrubiony wariant (SF Pro Bold / SF Pro Rounded Bold) na poziomie frameworka CoreText. Po włączeniu Bold Text wszystkie wiersze na ekranie — od nagłówków nawigacji po tekst przycisków — są wyświetlane z font-weight 700 zamiast 400. Deweloper nie może nadpisać tego zachowania dla elementów systemowych, ale może zarządzać czcionkami we własnym UI przez Dynamic Type.

Dla dewelopera włączony Bold Text oznacza, że wszystkie UIFont z textStyle (.body, .headline, .caption i inne) automatycznie otrzymują pogrubienie. UIFontWeight występuje w dwóch wariantach: regular (0.0) i bold (1.0). Przy aktywnym Bold Text system zwiększa fontWeight o 0.3–0.5 dla każdego stylu. Stan można sprawdzić przez UIAccessibility.isBoldTextEnabled.

Sprawdzanie Bold Text w aplikacji iOS

Deweloper może sprawdzić, czy Bold Text jest włączony na urządzeniu, i dostosować interfejs. Na przykład, jeśli nagłówki tabeli już używają pogrubienia, przy włączonej funkcji może być konieczne zmniejszenie grubości, aby uniknąć wizualnego szumu. Kod sprawdzania używa frameworka UIAccessibility.

import UIKit

class BoldTextManager {

    // Sprawdzanie stanu Bold Text
    static var isBoldTextEnabled: Bool {
        return UIAccessibility.isBoldTextEnabled
    }

    // Dostosowanie czcionki do Bold Text
    static func adjustedFont(
        textStyle: UIFont.TextStyle,
        weight: UIFont.Weight
    ) -> UIFont {
        let baseFont = UIFont.preferredFont(
            forTextStyle: textStyle
        )
        guard isBoldTextEnabled else {
            return baseFont
        }
        // Zmniejszamy grubość, aby uniknąć 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
        )
    }

    // Buforowana czcionka z obsługą Bold Text
    static func labelFont() -> UIFont {
        return adjustedFont(
            textStyle: .body,
            weight: .regular
        )
    }
}

// Subskrypcja zmian Bold Text (Notification)
NotificationCenter.default.addObserver(
    self,
    selector: #selector(boldTextStatusChanged),
    name: UIAccessibility.boldTextStatusDidChangeNotification,
    object: nil
)

@objc func boldTextStatusChanged() {
    // Aktualizacja UI przy zmianie Bold Text
    updateFonts()
}

Klasa BoldTextManager sprawdza isBoldTextEnabled, dostosowuje wagę czcionki (zmniejsza heavy/bold do semibold/medium przy aktywności funkcji) i subskrybuje powiadomienie boldTextStatusDidChangeNotification. Zapobiega to efektowi double-bold, gdy deweloper już używa pogrubienia dla nagłówków, a system pogrubia je jeszcze bardziej.

Wpływ na UITableView i UICollectionView

Bold Text wpływa na layout komórek UITableView i UICollectionView, ponieważ zwiększenie grubości czcionki może zmienić wysokość wiersza. Przy użyciu self-sizing cells (estimatedRowHeight + UITableView.automaticDimension) iOS automatycznie przelicza wysokość przy zmianie czcionki. Dla stałych wysokości komórek deweloper musi wywołać reloadData() po otrzymaniu powiadomienia boldTextStatusDidChangeNotification, w przeciwnym razie tekst może zostać obcięty.

Ulepszona czytelność w Androidzie: odpowiednik Bold Text

W Androidzie funkcja Bold Text nazywa się „Ulepszona czytelność” (Improve readability) w interfejsie ustawień i znajduje się w sekcji „Dostępność” (Accessibility). W niektórych wersjach Androida, szczególnie na urządzeniach Samsung One UI, funkcja nazywa się „Tekst o wysokim kontraście” lub High Contrast Text. Ustawienie stosuje się do wszystkich elementów systemowych i większości aplikacji zewnętrznych.

Techniczna implementacja Androida różni się od iOS: zamiast wymiany systemowej czcionki Android nadpisuje Typeface na poziomie systemowym przez Resources.Theme. Po aktywacji ustawienia system zmienia atrybut android:textStyle dla wszystkich elementów tekstowych, ustawiając bold lub italic+bold. Deweloper może sprawdzić stan przez Settings.Global.getFloat() lub AccessibilityManager.

Sprawdzanie Bold Text w aplikacji Android

W Androidzie nie ma bezpośredniego odpowiednika API UIAccessibility.isBoldTextEnabled. Sprawdzanie odbywa się przez ContentResolver i Settings.System. Funkcja przechowywana jest w ustawieniach globalnych jako font_weight_adjustment. Dla Jetpack Compose dostępna przez LocalDensity i fontScale.

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

class AndroidBoldTextHelper {

    // Sprawdzanie ulepszonej czytelności przez ustawienia systemowe
    fun isBoldTextEnabled(context: Context): Boolean {
        return try {
            Settings.System.getInt(
                context.contentResolver,
                "font_weight_adjustment"
            ) == 1
        } catch (e: Settings.SettingNotFoundException) {
            false
        }
    }

    // Jetpack Compose — dostosowanie 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 — zastosowanie przez TypedValue
    fun applyBoldStyleFix(context: Context, textView: android.widget.TextView) {
        if (isBoldTextEnabled(context)) {
            val paint = textView.paint
            val fakeBold = paint.isFakeBoldText
            // Zmniejszamy fakeBold, jeśli jest już włączony przez system
            if (fakeBold) {
                paint.isFakeBoldText = false
                textView.invalidate()
            }
        }
    }
}

Klasa AndroidBoldTextHelper odczytuje systemowe ustawienie font_weight_adjustment, dostosowuje FontWeight w Jetpack Compose i usuwa duplikujący się fakeBold w XML View. W przeciwieństwie do iOS, Android nie udostępnia kanału powiadomień dla zmiany Bold Text — deweloper sprawdza ustawienie przy starcie Activity lub przez ContentObserver.

ContentObserver do śledzenia zmian

Do śledzenia zmian Bold Text w czasie wykonania deweloper Androida może użyć ContentObserver. Przy zmianie ustawienia font_weight_adjustment system powiadamia ContentResolver, a aplikacja może zaktualizować UI. Jest to ważne dla AccessibilityService i niestandardowych launcherów, które muszą natychmiast reagować na zmiany ustawień użytkownika.

CSS font-weight: typy nasycenia czcionki

W tworzeniu stron internetowych nasycenie czcionki zarządzane jest przez właściwość CSS font-weight z wartościami od 100 (Thin) do 900 (Black). Standardowe wartości: normal = 400, bold = 700. Bold Text w systemie operacyjnym nie wpływa bezpośrednio na CSS font-weight — przeglądarki internetowe nie otrzymują sygnału systemowego o włączonym Bold Text na poziomie CSS. Jednak deweloper może użyć funkcji media CSS, jeśli platforma ją obsługuje.

Dla iOS Safari obsługuje funkcję media -webkit-text-size-adjust, ale nie ma bezpośredniego media query dla Bold Text. Na Androidzie Chrome również nie udostępnia media query dla systemowego ustawienia pogrubionego tekstu. Deweloperom stron internetowych zaleca się używanie prefers-contrast i prefers-reduced-motion do adaptacji, a dla pogrubionego tekstu — sprawdzanie ustawienia przez User-Agent lub style zastępcze.

Używanie czcionek zmiennych (Variable Fonts)

Variable Fonts (OpenType Font Variations) pozwalają płynnie regulować nasycenie czcionki przez CSS font-weight w zakresie 1–999 z krokiem 1 jednostki. W przeciwieństwie do standardowych czcionek, gdzie dostępne są tylko dyskretne wartości (400, 700), variable fonts dają możliwość doboru optymalnej grubości dla każdego użytkownika. Przy ustawieniach dostępności można użyć szerszego zakresu.

/* Zmienna czcionka z płynną regulacją grubości */
@font-face {
    font-family: "Inter Variable";
    src: url("/fonts/Inter-Variable.woff2")
        format("woff2-variations");
    font-weight: 100 900;
    font-stretch: 50% 200%;
}

/* Dostosowanie do systemowego Bold Text przez klasę */
.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 — podejście zastępcze */
@media (prefers-contrast: more) {
    .content {
        --font-weight-increase: 100;
    }
    .content .text {
        font-weight: calc(
            var(--font-weight-base) +
            var(--font-weight-increase)
        );
    }
}

W przykładzie CSS pokazano podłączenie zmiennej czcionki Inter Variable, zmienne CSS do zarządzania grubością i adaptację przez prefers-contrast: more. Variable fonts pozwalają zwiększyć font-weight o 50–100 jednostek przy włączonym systemowym Bold Text bez utraty jakości renderowania. Do określenia stanu Bold Text na kliencie można użyć JavaScript do sprawdzenia User-Agent i klasy na elemencie html.

JavaScript-detekcja Bold Text na stronie internetowej

Ponieważ CSS nie udostępnia bezpośredniego media query dla Bold Text, deweloperzy stron internetowych używają JavaScript: tworzą niewidoczny element ze znaną czcionką, mierzą jego szerokość, zmieniają font-weight i porównują różnicę. Jeśli różnica jest większa niż oczekiwana — prawdopodobnie systemowy Bold Text jest aktywny. Ta metoda jest stosowana w bibliotekach dostępności do automatycznego dostosowywania stylów.

Jak Bold Text wpływa na dostępność aplikacji

Bold Text rozwiązuje konkretne problemy użytkowników z zaburzeniami wzroku: zwiększa rozróżnialność symboli przy ambliopii, zmniejsza zmęczenie wzroku przy długim czytaniu i kompensuje niski kontrast wyświetlacza w jasnym słońcu. Według WebAIM Million (2025), 12.3% wszystkich stron ma tekst z niedostatecznym kontrastem — Bold Text może częściowo skompensować tę wadę po stronie użytkownika.

Dla dewelopera wsparcie Bold Text wchodzi w wymagania WCAG 2.2: kryterium 1.4.1 (Use of Color) i 1.4.3 (Contrast Minimum). Aplikacja musi poprawnie wyświetlać się przy włączonym systemowym ustawieniu Bold Text bez utraty treści, nakładania się elementów lub obcinania tekstu. Testowanie z włączonym Bold Text jest obowiązkowe podczas przygotowania do publikacji w App Store i Google Play.

Zalecenia dotyczące testowania

Podczas testowania aplikacji z Bold Text sprawdzaj: czy wszystkie elementy tekstowe są w pełni wyświetlane (bez obcinania), czy grubość nie jest dublowana (double-bold), czy wysokości komórek w tabelach są poprawnie przeliczane, czy elementy nie przesuwają się względem siebie. Użyj Accessibility Inspector (Xcode) lub Accessibility Scanner (Android) do automatycznego wykrywania problemów z Bold Text.

• Xcode Accessibility Inspector — audyt czcionek z symulacją trybu Bold Text
• Android Accessibility Scanner — sprawdzanie contrast ratio i duplikowania font-weight
• UI Testing — testy zrzutów ekranu z włączonym i wyłączonym Bold Text
• Dynamic Type testing — połączenie Bold Text + powiększona czcionka

Przyszłość Bold Text na platformach mobilnych

Współczesne iOS i Android rozwijają Bold Text w kierunku bardziej precyzyjnych ustawień: iOS 18 (2024) dodało ustawienia czcionek dla poszczególnych aplikacji, w tym grubość, a Android 16 (2025) rozszerzył API font_weight_adjustment dla deweloperów. Oczekuje się, że przyszłe wersje udostępnią deweloperom stron internetowych CSS media query dla Bold Text, eliminując potrzebę JS-detekcji.