Accessibility Trait: सार, प्रकार और डेवलपमेंट में यह कैसे काम करता है

Accessibility Trait क्या है

Accessibility Trait एक UIView तत्व पर सेट किया गया फ़्लैग है जो VoiceOver को इसकी शब्दार्थ भूमिका इंगित करता है। ट्रेट Apple की एक्सेसिबिलिटी त्रयी के तीन घटकों में से एक है: Label (नाम), Hint (विवरण), Trait (भूमिका)। iOS UIAccessibilityTraits बिटमास्क (UInt64) का उपयोग करता है, जहाँ प्रत्येक बिट एक विशिष्ट भूमिका से मेल खाता है। VoiceOver Label और Hint के बाद भूमिका पढ़ता है: «सबमिट बटन। एक फ़ॉर्म खुलेगा» — «बटन» UIAccessibilityTraitButton ट्रेट की बदौलत जोड़ा गया है।

डिफ़ॉल्ट रूप से, UIButton को UIAccessibilityTraitButton मिलता है, UILabel को UIAccessibilityTraitStaticText मिलता है, UIImageView को UIAccessibilityTraitImage मिलता है। कस्टम कंट्रोल का उपयोग करते समय, डेवलपर को मैन्युअल रूप से ट्रेट सेट करना होता है। Apple Human Interface Guidelines, 2024, इसे «एक्सेसिबिलिटी सुनिश्चित करने में सबसे महत्वपूर्ण कदमों में से एक» कहते हैं।

सही ट्रेट के बिना, उपयोगकर्ता नहीं जानता कि कौन सा जेस्चर लागू करना है: सिंगल टैप (बटन सक्रियण), डबल टैप (ज़ूम) या स्वाइप जेस्चर (टॉगल)। ट्रेट यह निर्धारित करता है कि तत्व पर VoiceOver के कौन से जेस्चर सक्रिय होते हैं।

UIAccessibilityTraits का तकनीकी कार्यान्वयन

UIAccessibilityTraits एक typealias UInt64 है। प्रत्येक ट्रेट एक कॉन्स्टेंट है जिसमें ठीक एक बिट सेट होता है। उदाहरण के लिए, UIAccessibilityTraitButton = 0x0000000000000001, UIAccessibilityTraitLink = 0x0000000000000002, UIAccessibilityTraitHeader = 0x0000000000000008। संयोजन बिटवाइज़ OR से प्राप्त होते हैं: 0x0001 | 0x0008 = 0x0009। VoiceOver मास्क का विश्लेषण करता है और व्यवहार निर्धारित करता है।

iOS ट्रेट्स के मुख्य प्रकार

iOS 15 से अधिक ट्रेट कॉन्स्टेंट प्रदान करता है। आइए 90% परिदृश्यों में उपयोग किए जाने वाले मुख्य ट्रेट्स पर नज़र डालें:

कॉन्स्टेंट iOS 3.0 से UIKit में उपलब्ध हैं। iOS 14+ ने .accessibilityAddTraits() मॉडिफ़ायर के माध्यम से SwiftUI में UIAccessibilityTraits का समर्थन जोड़ा।

दुर्लभ लेकिन उपयोगी ट्रेट्स

UIAccessibilityTraitAdjustable — समायोज्य मानों के लिए (स्लाइडर्स, पिकर्स, वॉल्यूम स्लाइडर्स)। VoiceOver accessibilityIncrement और accessibilityDecrement के माध्यम से परिभाषित चरण के साथ मान बदलने के लिए ऊपर/नीचे स्वाइप करने की अनुमति देता है। UIAccessibilityTraitUpdatesFrequently — बार-बार बदलने वाले मानों वाले तत्वों के लिए (टाइमर, प्रगति संकेतक)। VoiceOver हर बदलाव पर मान नहीं पढ़ता बल्कि एक विराम लेता है। UIAccessibilityTraitAllowsDirectInteraction — उन तत्वों के लिए जिनके साथ उपयोगकर्ता सीधे इंटरैक्ट कर सकता है (कीबोर्ड, ड्रॉइंग), VoiceOver जेस्चर को दरकिनार करते हुए।

ट्रेट्स का संयोजन

एक तत्व में एक साथ कई ट्रेट्स हो सकते हैं — संयोजन बिटवाइज़ OR (|) के माध्यम से सेट किया जाता है। उदाहरण: एक बटन जो वर्तमान में चयनित है — Button | Selected। VoiceOver घोषणा करेगा: «चयनित। मूल्य के अनुसार फ़िल्टर किया गया। बटन।»

कोड में ट्रेट्स सेट करना:

filterButton.accessibilityTraits.insert(.button)
filterButton.accessibilityTraits.insert(.selected)

// या मास्क के माध्यम से:
filterButton.accessibilityTraits = [.button, .selected]

कस्टम UIView के लिए जहाँ ट्रेट डिफ़ॉल्ट रूप से सेट नहीं है:

class CustomToggle: UIControl {
    override var accessibilityTraits: UIAccessibilityTraits {
        get {
            if isOn {
                return [.button, .selected]
            } else {
                return .button
            }
        }
        set {}
    }
}

संयोजन नियम: प्रति तत्व 3-4 ट्रेट्स से अधिक नहीं। अत्यधिक ट्रेट्स (जैसे Button + Link + Header) VoiceOver घोषणा को बहुत लंबा और भ्रमित करने वाला बनाते हैं। Apple के अनुसार, «प्रत्येक अतिरिक्त गुण उपयोगकर्ता पर संज्ञानात्मक भार बढ़ाता है»।

SwiftUI: ट्रेट मॉडिफ़ायर

SwiftUI में, ट्रेट्स .accessibilityAddTraits() और .accessibilityRemoveTraits() मॉडिफ़ायर के माध्यम से सेट किए जाते हैं। उदाहरण: Text(«शीर्षक»).font(.largeTitle).accessibilityAddTraits(.isHeader)। .isHeader मॉडिफ़ायर UIAccessibilityTraitHeader जोड़ता है। SwiftUI ट्रेट सूची: .isButton, .isHeader, .isLink, .isSelected, .isImage, .isSearchField, .isKeyboardKey, .isStaticText, .isSummaryElement, .isToggle, .playsSound, .startsMediaSession, .updatesFrequently, .allowsDirectInteraction, .causesPageTurn, .isModal, .tabBar।

ट्रेट चुनने में सामान्य गलतियाँ

बटन के बजाय StaticText — एक कस्टम कंट्रोल जो देखने में बटन जैसा दिखता है, डिफ़ॉल्ट रूप से StaticText ट्रेट प्राप्त करता है। VoiceOver कोई सक्रियण जेस्चर प्रदान नहीं करता, इसलिए उपयोगकर्ता तत्व को «दबा» नहीं सकता। समाधान: स्पष्ट रूप से .button सेट करें।

बिना ट्रेट वाली छवि — एक्सेसिबिलिटी सक्षम UIImageView को Image ट्रेट मिलता है, भले ही वह वास्तव में फ़ोटो बड़ा करने का बटन हो। .button और Label «फ़ोटो बड़ा करें» असाइन करें। WWDC 2023, «Deliver an Exceptional Accessibility Experience» के अनुसार, नए ऐप वर्ज़न में 40% एक्सेसिबिलिटी रिग्रेशन ट्रेट बेमेल के कारण होते हैं।

हर तत्व पर Header — Header ट्रेट स्क्रीन के संरचनात्मक हेडर्स के लिए है। यदि प्रत्येक UILabel को हेडर बना दिया जाए, तो VoiceOver रोटर «हेडर्स» मोड में बेकार हो जाता है — वह हर शब्द पर रुकेगा।

कैसे ठीक करें: जाँच सूची

• प्रत्येक इंटरैक्टिव कस्टम तत्व को Button, Link या Adjustable ट्रेट मिलता है
• सेक्शन हेडर्स को Header ट्रेट मिलता है (StaticText नहीं)
• इमेज बटन को चयनित स्थिति में Button + Selected ट्रेट मिलता है
• बिना जेस्चर वाले तत्व — StaticText या Image (केवल पढ़ें)

UIButton को UIControl से बदलने पर रिग्रेशन बग्स

ट्रेट खोने का एक सामान्य कारण रीफ़ैक्टरिंग है: डेवलपर कस्टम डिस्प्ले के लिए UIButton को UIControl से बदल देता है। UIButton स्वचालित रूप से Button ट्रेट प्राप्त करता है, UIControl नहीं करता। रीफ़ैक्टरिंग के बाद, आपको स्पष्ट रूप से accessibilityTraits = .button सेट करना होगा। कोड समीक्षा में एक जाँच जोड़ें: «यदि आपने UIButton को UIControl से बदला है — ट्रेट की जाँच करें»।

ट्रेट्स और गतिशील स्थितियाँ

बदलती स्थिति वाले तत्वों के लिए (जैसे लाइक बटन), ट्रेट को गतिशील रूप से बदलना चाहिए। «पसंद नहीं किया गया» स्थिति में — Button, «पसंद किया गया» स्थिति में — Button + Selected + Image (यदि आइकन है)। VoiceOver घोषणा बदलता है: «पसंद करें। बटन।» बनाम «चयनित। पसंद करें। बटन।» यदि Selected ट्रेट अपर्याप्त है तो स्थिति बताने के लिए accessibilityValue का उपयोग करें। सब्सक्राइब बटन, पसंदीदा, फ़िल्टर और टॉगल के लिए प्रासंगिक।

Android समकक्ष: role और className

Android में, ट्रेट्स का कोई सीधा समकक्ष नहीं है। बिटमास्क के बजाय, निम्नलिखित का उपयोग किया जाता है:

• className — AccessibilityNodeInfo.className का मान (android.widget.Button, android.widget.TextView)
• role — एक XML विशेषता (भूमिका View के प्रकार से निर्धारित होती है)
• stateDescription — Selected का समकक्ष: स्थिति विवरण जोड़ना (सक्षम/अक्षम)

Android में कस्टम View के लिए, आपको onInitializeAccessibilityNodeInfo को ओवरराइड करना होगा:

class CustomButton @JvmOverloads constructor(
    context: Context,
    attrs: AttributeSet? = null
) : View(context, attrs) {

    override fun onInitializeAccessibilityNodeInfo(
        info: AccessibilityNodeInfo
    ) {
        super.onInitializeAccessibilityNodeInfo(info)
        info.className = "android.widget.Button"
        info.isClickable = true
    }
}

Flutter डेवलपर्स को Semantics विजेट में semanticsRole पैरामीटर का उपयोग करना चाहिए: button, header, image, link, textField और अन्य। इसके अतिरिक्त, semanticsLabel और semanticsHint उपलब्ध हैं — iOS त्रयी Label + Hint + Trait का पूर्ण समकक्ष।

वेब समकक्ष: WAI-ARIA role

मोबाइल ऐप्स (PWA, WebView) के वेब संस्करणों के लिए, WAI-ARIA से role विशेषता का उपयोग किया जाता है: role="button", role="heading", role="link"। यह accessibilityTraits का सीधा समकक्ष है। हाइब्रिड ऐप्स में, जाँच करें कि WebView ARIA भूमिकाओं को मूल एक्सेसिबिलिटी लेयर पर भेजता है। इसके लिए, iOS में UIAccessibilityContainerDataTable प्रोटोकॉल या Android में setAccessibilityDelegate का उपयोग करें। JavaScript सक्षम WebView ARIA भूमिकाओं को सही ढंग से नहीं भेज सकता — अलग से परीक्षण करें।

AccessibilityNodeInfo: अतिरिक्त क्रियाएँ

Android में, आप AccessibilityNodeInfo में कस्टम क्रियाएँ जोड़ सकते हैं: AccessibilityNodeInfo.AccessibilityAction.ACTION_CLICK और ACTION_LONG_CLICK। यह अतिरिक्त जेस्चर के साथ Button ट्रेट के समकक्ष है। स्लाइडर्स के लिए, ACTION_SET_PROGRESS का उपयोग करें — Adjustable का समकक्ष। Spinner और DatePicker के लिए — ACTION_SET_SELECTION, ACTION_SET_DATE और ACTION_SET_TIME।

ट्रेट्स की जाँच और परीक्षण

Xcode Accessibility Inspector iOS के लिए प्राथमिक उपकरण है: एक तत्व चुनें और Traits फ़ील्ड देखें। यह सेट किए गए ट्रेट्स की सूची दिखाएगा। «तत्व» मोड वाला VoiceOver रोटर स्क्रीन के सभी कंट्रोल पर नेविगेट करने की अनुमति देता है।

ट्रेट जाँचने के लिए स्वचालित Swift परीक्षण:

func testSubmitButtonTrait() {
    let app = XCUIApplication()
    app.launch()
    let submitButton = app.buttons["सबमिट करें"]
    XCTAssertTrue(submitButton.isEnabled)
    // XCUIElement ट्रेट्स तक सीधी पहुँच प्रदान नहीं करता
    // जेस्चर सक्रियण के माध्यम से जाँच
    submitButton.tap()
    XCTAssertTrue(app.staticTexts["फ़ॉर्म सबमिट किया गया"].exists)
}

VoiceOver के माध्यम से मैन्युअल जाँच: VoiceOver चालू करें, तत्व पर स्वाइप करें, डबल-टैप करें — यदि यह Button है तो तत्व सक्रिय होना चाहिए। यदि तत्व डबल-टैप पर प्रतिक्रिया नहीं करता, तो ट्रेट गलत है। मोड के बीच स्विच करने के लिए Rotor जेस्चर का उपयोग करें («हेडर्स», «लिंक्स», «बटन») — प्रत्येक मोड केवल संबंधित ट्रेट वाले तत्व दिखाएगा।

iOS में ट्रेट्स का यूनिट परीक्षण

iOS 14 से पहले, यूनिट टेस्ट के पास accessibilityTraits तक सीधी पहुँच नहीं थी। iOS 14 से शुरू होकर, गुण उपलब्ध है: XCTAssertEqual(customButton.accessibilityTraits, .button)। कस्टम कंट्रोल सत्यापित करने के लिए यूनिट टेस्ट में इसका उपयोग करें। प्रत्येक नए कस्टम UIView का सही ट्रेट के लिए परीक्षण करने की अनुशंसा की जाती है, विशेष रूप से रीफ़ैक्टरिंग या पैरेंट क्लास बदलने के बाद।