Bold Text في التطبيقات المحمولة: ما هو وكيفية ضبط النص العريض

ما هو Bold Text في إمكانية الوصول؟

Bold Text هو إعداد نظام في أنظمة التشغيل يفرض استخدام وزن خط عريض لجميع عناصر النص في الواجهة بدلاً من الوزن القياسي (regular أو normal). على عكس مجرد زيادة حجم الخط، لا يغير Bold Text المقياس — بل يزيد من سمك حدود الحروف، مما يجعلها أكثر ثراءً وتباينًا على الخلفية.

تنتمي هذه الميزة إلى فئة display accommodations — إعدادات الشاشة التي تساعد الأشخاص ذوي الإعاقات البصرية على إدراك المعلومات بشكل أكثر راحة. Bold Text فعال بشكل خاص لضعف حدة البصر (الحول)، مد البصر المرتبط بالعمر (الغمش)، وبعض أشكال عسر القراءة حيث تظهر الحروف مزدوجة أو ضبابية بالسمك القياسي.

يزيد النص العريض من readability — سرعة ودقة التعرف على الأحرف الفردية. تظهر الدراسات من 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 — يؤثر الإعداد فقط على العرض المرئي.

Bold Text في iOS: الإعداد ومبدأ العمل

في iOS، يعد Bold Text من أقدم ميزات إمكانية الوصول، حيث تم تقديمه في iOS 7 (2013). يوجد الإعداد في Settings > Display & Brightness > Bold Text ويتطلب إعادة تشغيل iPhone: يعيد النظام بناء جميع الخطوط في تطبيقات النظام (Settings، Mail، Messages، Calendar، Notes) وتطبيقات الطرف الثالث التي تستخدم خط النظام San Francisco.

من الناحية الفنية، يستبدل iOS ملف خط النظام San Francisco بنسخته Bold (SF Pro Bold / SF Pro Rounded Bold) على مستوى إطار عمل CoreText. بعد تفعيل Bold Text، يتم عرض جميع النصوص على الشاشة — من رؤوس التنقل إلى تسميات الأزرار — بوزن خط 700 بدلاً من 400. لا يمكن للمطور تجاوز هذا السلوك لعناصر النظام ولكن يمكنه إدارة الخطوط في واجهته الخاصة من خلال Dynamic Type.

بالنسبة للمطورين، عندما يكون Bold Text مفعّلاً، تتلقى جميع نسخ UIFont مع textStyle (.body، .headline، .caption وغيرها) وزنًا عريضًا تلقائيًا. يوجد UIFontWeight في شكلين: regular (0.0) و bold (1.0). مع تفعيل Bold Text، يزيد النظام fontWeight بمقدار 0.3–0.5 لكل نمط. يمكن التحقق من الحالة عبر UIAccessibility.isBoldTextEnabled.

التحقق من Bold Text في تطبيق iOS

يمكن للمطور التحقق مما إذا كان 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
    updateFonts()
}

تتحقق فئة BoldTextManager من isBoldTextEnabled، وتكييف وزن الخط (تقلل heavy/bold إلى semibold/medium عند تفعيل الميزة)، وتشترك في boldTextStatusDidChangeNotification. يمنع هذا تأثير double-bold، حيث يستخدم المطور الخط العريض بالفعل للعناوين ويقوم النظام بتسميكها أكثر.

التأثير على UITableView و UICollectionView

يؤثر Bold Text على تخطيط خلايا UITableView و UICollectionView، حيث يمكن أن تؤدي زيادة سمك الخط إلى تغيير ارتفاع الصف. عند استخدام خلايا ذاتية التحجيم (estimatedRowHeight + UITableView.automaticDimension)، يعيد iOS حساب الارتفاع تلقائيًا عند تغيير الخط. بالنسبة لارتفاعات الخلايا الثابتة، يحتاج المطور إلى استدعاء reloadData() بعد تلقي boldTextStatusDidChangeNotification، وإلا فقد يتم اقتطاع النص.

تحسين readability في Android: نظير Bold Text

في Android، تسمى ميزة Bold Text «Improve Readability» في واجهة الإعدادات وتوجد في قسم إمكانية الوصول. في بعض إصدارات Android، خاصة على أجهزة Samsung One UI، تسمى الميزة «High Contrast Text.» يتم تطبيق الإعداد على جميع عناصر النظام ومعظم تطبيقات الطرف الثالث.

يختلف التنفيذ الفني في Android عن iOS: بدلاً من استبدال خط النظام، يتجاوز Android Typeface على مستوى النظام من خلال Resources.Theme. عند تفعيل الإعداد، يغير النظام السمة android:textStyle لجميع عناصر النص، مع تعيين bold أو italic+bold. يمكن للمطور التحقق من الحالة عبر Settings.Global.getFloat() أو AccessibilityManager.

التحقق من Bold Text في تطبيق Android

في Android، لا توجد واجهة برمجة تطبيقات مباشرة مكافئة لـ UIAccessibility.isBoldTextEnabled. يتم التحقق من خلال 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 {

    // التحقق من improved readability من خلال إعدادات النظام
    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، وتكييف FontWeight في Jetpack Compose، وتزيل fakeBold المكرر في XML View. على عكس iOS، لا يوفر Android قناة إعلام لتغييرات Bold Text — يتحقق المطور من الإعداد عند بدء النشاط أو من خلال ContentObserver.

ContentObserver لتتبع التغييرات

لتتبع تغييرات Bold Text في وقت التشغيل، يمكن لمطور Android استخدام ContentObserver. عندما يتغير إعداد font_weight_adjustment، يخطر النظام ContentResolver ويمكن للتطبيق تحديث واجهته. هذا مهم لـ AccessibilityService والمشغلات المخصصة التي يجب أن تستجيب فورًا لتغييرات إعدادات المستخدم.

CSS font-weight: أنواع سمك الخط

في تطوير الويب، يتم التحكم في سمك الخط بواسطة خاصية CSS font-weight بقيم تتراوح من 100 (Thin) إلى 900 (Black). تتضمن القيم القياسية normal = 400 و bold = 700. لا يؤثر Bold Text في نظام التشغيل بشكل مباشر على CSS font-weight — لا تتلقى متصفحات الويب إشارة نظام حول تفعيل Bold Text على مستوى CSS. ومع ذلك، يمكن للمطور استخدام media feature في CSS إذا كانت المنصة تدعمها.

بالنسبة لـ iOS، يدعم Safari وظيفة -webkit-text-size-adjust لكن ليس لديه استعلام وسائط مباشر لـ Bold Text. على Android، لا يوفر Chrome أيضًا استعلام وسائط لإعداد النص العريض للنظام. يُنصح مطوري الويب باستخدام prefers-contrast و prefers-reduced-motion للتكييف، وللنص العريض — التحقق من الإعداد عبر User-Agent أو الأنماط الاحتياطية.

استخدام الخطوط المتغيرة (Variable Fonts)

الخطوط المتغيرة (OpenType Font Variations) تسمح بضبط سلس لسمك الخط من خلال CSS font-weight في نطاق 1–999 بزيادات وحدة واحدة. على عكس الخطوط القياسية حيث تتوفر قيم منفصلة فقط (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. تسمح الخطوط المتغيرة بزيادة font-weight بمقدار 50–100 وحدة عند تفعيل Bold Text للنظام دون فقدان جودة العرض. للكشف عن حالة Bold Text على العميل، يمكن استخدام JavaScript للتحقق من User-Agent وإضافة فئة إلى عنصر html.

كشف Bold Text باستخدام JavaScript في صفحة ويب

نظرًا لأن 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 للنظام دون فقدان المحتوى أو تداخل العناصر أو اقتطاع النص. الاختبار مع تفعيل Bold Text إلزامي عند التحضير للنشر في App Store و Google Play.

توصيات الاختبار

عند اختبار تطبيق مع 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 للمطورين. من المتوقع أن توفر الإصدارات المستقبلية استعلام وسائط CSS لـ Bold Text، مما يلغي الحاجة إلى الكشف باستخدام JavaScript.