모바일 앱의 Bold Text: 정의와 굵은 텍스트 설정 방법

접근성에서 Bold Text란?

Bold Text는 운영 체제의 시스템 설정으로, 표준(regular 또는 normal) 두께 대신 모든 텍스트 인터페이스 요소에 굵은 글꼴 두께를 사용하도록 강제합니다. 단순히 글꼴 크기를 늘리는 것과 달리 Bold Text는 배율을 변경하지 않고 — 글자의 획 두께를 증가시켜 배경에 비해 더 풍부하고 대비를 높입니다.

이 기능은 display accommodations(디스플레이 조정) 범주에 속합니다 — 시각 장애가 있는 사람들이 정보를 더 편안하게 인식할 수 있도록 돕는 화면 설정입니다. Bold Text는 낮은 시력(약시), 노안(40–45세 이후의 연령 관련 원시) 및 표준 두께에서 문자가 이중으로 보이거나 흐릿하게 보이는 특정 형태의 난독증에 특히 효과적입니다.

굵은 텍스트는 가독성 — 개별 문자를 인식하는 속도와 정확성을 향상시킵니다. Usability.gov의 연구에 따르면 굵은 서체는 동일한 포인트 크기의 일반 서체와 비교하여 시각 장애가 있는 사용자의 읽기 정확도를 12–18% 향상시킵니다. 그러나 Bold Text는 텍스트 확대를 대체하지 않습니다 — 두 기능을 함께 사용할 수 있습니다.

Bold Text와 글꼴 확대의 차이

Bold Text와 Dynamic Type(iOS) 또는 Font Size(Android)의 주요 차이점은 작동 메커니즘입니다. 글꼴 확대는 글자의 크기를 변경하는 반면, Bold Text는 두께에만 영향을 미칩니다. 글꼴을 확대하면 화면 용량이 저하되지만(한 화면에 더 적은 콘텐츠가 들어감), Bold Text는 표시되는 요소의 수를 유지합니다. 초기 단계 노안 사용자의 경우 텍스트 확대 없이 Bold Text만으로도 충분한 경우가 많습니다.

누가 Bold Text가 필요한가

Bold Text의 주요 대상은 약시(안경으로 교정할 수 없는 낮은 시력), 노안(40–45세 이후의 연령 관련 원시) 및 특정 형태의 난독증이 있는 사람들입니다. 이 기능은 밝은 햇빛 아래에서 읽을 때도 유용합니다 — 굵은 텍스트는 눈부심 속에서도 대비를 유지합니다. VoiceOver 및 TalkBack과 같은 보조 기술은 Bold Text와 독립적으로 작동합니다 — 이 설정은 시각적 표시에만 영향을 미칩니다.

iOS의 Bold Text: 설정 및 작동 원리

iOS에서 Bold Text는 가장 오래된 접근성 기능 중 하나로 iOS 7(2013)에서 도입되었습니다. 설정은 Settings > Display & Brightness > Bold Text에 있으며 iPhone 재시작이 필요합니다. 시스템은 시스템 앱(Settings, Mail, Messages, Calendar, Notes) 및 시스템 글꼴 San Francisco를 사용하는 타사 앱의 모든 글꼴을 재구성합니다.

기술적으로 iOS는 CoreText 프레임워크 수준에서 시스템 글꼴 파일 San Francisco를 Bold 변형(SF Pro Bold / SF Pro Rounded Bold)으로 대체합니다. Bold Text를 활성화하면 화면의 모든 텍스트 — 탐색 헤더부터 버튼 레이블까지 — font-weight 700(기본 400 대신)으로 표시됩니다. 개발자는 시스템 요소의 이 동작을 재정의할 수 없지만 Dynamic Type을 통해 자체 UI의 글꼴을 관리할 수 있습니다.

개발자의 경우 Bold Text가 활성화되면 textStyle(.body, .headline, .caption 등)이 있는 모든 UIFont 인스턴스가 자동으로 굵은 두께를 받습니다. UIFontWeight에는 regular(0.0)와 bold(1.0)의 두 가지 변형이 있습니다. Bold Text가 활성화되면 시스템은 각 스타일의 fontWeight를 0.3–0.5 증가시킵니다. 상태는 UIAccessibility.isBoldTextEnabled를 통해 확인할 수 있습니다.

iOS 앱에서 Bold Text 확인

개발자는 기기에서 Bold Text가 활성화되어 있는지 확인하고 그에 따라 인터페이스를 조정할 수 있습니다. 예를 들어 테이블 헤더가 이미 굵게 표시된 경우 기능을 활성화하면 시각적 혼란을 피하기 위해 글꼴 두께를 줄여야 할 수 있습니다. 확인은 UIAccessibility 프레임워크를 사용합니다.

import UIKit

class BoldTextManager {

    // Bold Text 상태 확인
    static var isBoldTextEnabled: Bool {
        return UIAccessibility.isBoldTextEnabled
    }

    // Bold Text에 맞게 글꼴 조정
    static func adjustedFont(
        textStyle: UIFont.TextStyle,
        weight: UIFont.Weight
    ) -> UIFont {
        let baseFont = UIFont.preferredFont(
            forTextStyle: textStyle
        )
        guard isBoldTextEnabled else {
            return baseFont
        }
        // 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
        )
    }

    // Bold Text 지원이 포함된 캐시된 글꼴
    static func labelFont() -> UIFont {
        return adjustedFont(
            textStyle: .body,
            weight: .regular
        )
    }
}

// Bold Text 변경 구독(알림)
NotificationCenter.default.addObserver(
    self,
    selector: #selector(boldTextStatusChanged),
    name: UIAccessibility.boldTextStatusDidChangeNotification,
    object: nil
)

@objc func boldTextStatusChanged() {
    // Bold Text 변경 시 UI 업데이트
    updateFonts()
}

BoldTextManager 클래스는 isBoldTextEnabled를 확인하고, 글꼴 두께를 조정하며(기능이 활성화된 경우 heavy/bold를 semibold/medium으로 줄임), boldTextStatusDidChangeNotification을 구독합니다. 이는 개발자가 이미 제목에 굵게를 사용했는데 시스템이 더 굵게 만드는 double-bold 효과를 방지합니다.

UITableView 및 UICollectionView에 미치는 영향

Bold Text는 UITableView 및 UICollectionView 셀의 레이아웃에 영향을 미칩니다. 글꼴 두께가 증가하면 행 높이가 변경될 수 있기 때문입니다. self-sizing 셀(estimatedRowHeight + UITableView.automaticDimension)을 사용하는 경우 iOS는 글꼴이 변경될 때 자동으로 높이를 다시 계산합니다. 고정 셀 높이의 경우 개발자는 boldTextStatusDidChangeNotification을 수신한 후 reloadData()를 호출해야 합니다. 그렇지 않으면 텍스트가 잘릴 수 있습니다.

Android의 Improve Readability: Bold Text에 해당하는 기능

Android에서 Bold Text 기능은 설정 인터페이스에서 “Improve Readability”라고 하며 접근성 섹션에 있습니다. 일부 Android 버전, 특히 Samsung One UI 기기에서는 이 기능을 “High Contrast Text”라고 합니다. 이 설정은 모든 시스템 요소와 대부분의 타사 애플리케이션에 적용됩니다.

Android의 기술적 구현은 iOS와 다릅니다. 시스템 글꼴을 대체하는 대신 Android는 Resources.Theme을 통해 시스템 수준에서 Typeface를 재정의합니다. 설정이 활성화되면 시스템은 모든 텍스트 요소의 android:textStyle 속성을 변경하여 bold 또는 italic+bold를 설정합니다. 개발자는 Settings.Global.getFloat() 또는 AccessibilityManager를 통해 상태를 확인할 수 있습니다.

Android 앱에서 Bold Text 확인

Android에는 UIAccessibility.isBoldTextEnabled에 직접 해당하는 API가 없습니다. 확인은 ContentResolver와 Settings.System을 통해 수행됩니다. 설정은 전역 기본 설정에 font_weight_adjustment로 저장됩니다. Jetpack Compose의 경우 LocalDensity와 fontScale을 통해 액세스할 수 있습니다.

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

class AndroidBoldTextHelper {

    // 시스템 설정을 통한 향상된 가독성 확인
    fun isBoldTextEnabled(context: Context): Boolean {
        return try {
            Settings.System.getInt(
                context.contentResolver,
                "font_weight_adjustment"
            ) == 1
        } catch (e: Settings.SettingNotFoundException) {
            false
        }
    }

    // Jetpack Compose — 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 — TypedValue를 통한 적용
    fun applyBoldStyleFix(context: Context, textView: android.widget.TextView) {
        if (isBoldTextEnabled(context)) {
            val paint = textView.paint
            val fakeBold = paint.isFakeBoldText
            // 시스템에서 이미 활성화된 경우 fakeBold 줄이기
            if (fakeBold) {
                paint.isFakeBoldText = false
                textView.invalidate()
            }
        }
    }
}

AndroidBoldTextHelper 클래스는 시스템 설정 font_weight_adjustment를 읽고, Jetpack Compose에서 FontWeight를 조정하며, XML View에서 중복 fakeBold를 제거합니다. iOS와 달리 Android는 Bold Text 변경에 대한 알림 채널을 제공하지 않습니다 — 개발자는 Activity 시작 시 또는 ContentObserver를 통해 설정을 확인합니다.

변경 사항 추적을 위한 ContentObserver

런타임에 Bold Text 변경 사항을 추적하기 위해 Android 개발자는 ContentObserver를 사용할 수 있습니다. font_weight_adjustment 설정이 변경되면 시스템이 ContentResolver에 알리고 앱이 UI를 업데이트할 수 있습니다. 이는 사용자 설정 변경에 즉시 응답해야 하는 AccessibilityService 및 사용자 정의 런처에 중요합니다.

CSS font-weight: 글꼴 두께 유형

웹 개발에서 글꼴 두께는 CSS 속성 font-weight로 제어되며 값은 100(Thin)에서 900(Black)까지입니다. 표준 값에는 normal = 400 및 bold = 700이 포함됩니다. 운영 체제의 Bold Text는 CSS font-weight에 직접 영향을 미치지 않습니다 — 웹 브라우저는 CSS 수준에서 활성화된 Bold Text에 대한 시스템 신호를 수신하지 않습니다. 그러나 플랫폼이 지원하는 경우 개발자는 CSS 미디어 기능을 사용할 수 있습니다.

iOS의 경우 Safari는 -webkit-text-size-adjust 미디어 기능을 지원하지만 Bold Text에 대한 직접적인 미디어 쿼리는 없습니다. Android에서 Chrome도 시스템 굵은 텍스트 설정에 대한 미디어 쿼리를 제공하지 않습니다. 웹 개발자는 적응을 위해 prefers-contrast 및 prefers-reduced-motion을 사용하고 굵은 텍스트의 경우 User-Agent 또는 대체 스타일을 통해 설정을 확인하는 것이 좋습니다.

가변 글꼴(Variable Fonts) 사용

가변 글꼴(OpenType Font Variations)을 사용하면 1단위 간격으로 1–999 범위의 CSS font-weight를 통해 글꼴 두께를 부드럽게 조정할 수 있습니다. 이산 값(400, 700)만 사용할 수 있는 표준 글꼴과 달리 가변 글꼴을 사용하면 각 사용자에게 최적의 두께를 선택할 수 있습니다. 접근성 설정에 더 넓은 범위를 사용할 수 있습니다.

/* 부드러운 두께 조정이 가능한 가변 글꼴 */
@font-face {
    font-family: "Inter Variable";
    src: url("/fonts/Inter-Variable.woff2")
        format("woff2-variations");
    font-weight: 100 900;
    font-stretch: 50% 200%;
}

/* 클래스를 통한 시스템 Bold Text 적응 */
.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 — 대체 접근 방식 */
@media (prefers-contrast: more) {
    .content {
        --font-weight-increase: 100;
    }
    .content .text {
        font-weight: calc(
            var(--font-weight-base) +
            var(--font-weight-increase)
        );
    }
}

CSS 예제는 가변 글꼴 Inter Variable을 로드하고, 두께 제어를 위해 CSS 사용자 정의 속성을 사용하고, prefers-contrast: more를 통해 적응하는 방법을 보여줍니다. 가변 글꼴을 사용하면 렌더링 품질 저하 없이 시스템 Bold Text가 활성화된 경우 font-weight를 50–100단위 늘릴 수 있습니다. 클라이언트에서 Bold Text 상태를 감지하기 위해 JavaScript가 User-Agent를 확인하고 html 요소에 클래스를 추가할 수 있습니다.

웹 페이지에서 JavaScript로 Bold Text 감지

CSS가 Bold Text에 대한 직접적인 미디어 쿼리를 제공하지 않기 때문에 웹 개발자는 JavaScript를 사용합니다. 알려진 글꼴로 보이지 않는 요소를 만들고, 너비를 측정하고, font-weight를 변경한 다음 차이를 비교합니다. 차이가 예상보다 크면 시스템 Bold Text가 활성화된 것입니다. 이 방법은 자동 스타일 조정을 위한 접근성 라이브러리에서 사용됩니다.

Bold Text가 앱 접근성에 미치는 영향

Bold Text는 시각 장애가 있는 사용자의 특정 문제를 해결합니다. 약시에서 문자 식별성을 개선하고, 장시간 읽기 시 시각적 피로를 줄이며, 밝은 햇빛에서 낮은 디스플레이 대비를 보상합니다. WebAIM Million(2025)에 따르면 전체 페이지의 12.3%에 대비가 불충분한 텍스트가 있습니다 — Bold Text는 사용자 측에서 이 결함을 부분적으로 보상할 수 있습니다.

개발자의 경우 Bold Text 지원은 WCAG 2.2 요구 사항의 일부입니다. 기준 1.4.1(색상 사용) 및 1.4.3(최소 대비)입니다. 앱은 시스템 Bold Text 설정이 활성화된 상태에서 콘텐츠 손실, 요소 겹침 또는 텍스트 잘림 없이 올바르게 표시되어야 합니다. App Store 및 Google Play 게시 준비 시 Bold Text를 활성화한 테스트가 필수입니다.

테스트 권장 사항

Bold Text로 앱을 테스트할 때 확인할 사항: 모든 텍스트 요소가 완전히 표시되는지(잘림 없음), 굵게가 중복되지 않는지(double-bold), 테이블의 셀 높이가 올바르게 다시 계산되는지, 요소가 서로에 대해 이동하지 않는지. Accessibility Inspector(Xcode) 또는 Accessibility Scanner(Android)를 사용하여 Bold Text 문제를 자동으로 감지하십시오.

• Xcode Accessibility Inspector — Bold Text 모드 시뮬레이션을 사용한 글꼴 감사
• Android Accessibility Scanner — 대비 비율 및 font-weight 중복 확인
• UI 테스트 — Bold Text 활성화 및 비활성화 상태의 스크린샷 테스트
• Dynamic Type 테스트 — Bold Text + 확대 글꼴 조합

모바일 플랫폼에서 Bold Text의 미래

최신 iOS 및 Android는 Bold Text를 더 세밀한 제어 방향으로 발전시키고 있습니다. iOS 18(2024)은 굵은 두께를 포함한 앱별 글꼴 설정을 추가했고, Android 16(2025)은 개발자를 위한 font_weight_adjustment API를 확장했습니다. 향후 버전에서는 Bold Text용 CSS 미디어 쿼리가 제공되어 JavaScript 감지의 필요성이 사라질 것으로 예상됩니다.