ARIA क्या है?
ARIA की मदद से, वेब लेखक एक अलग तरह की रीयलिटी बना सकते हैं. इसे सिर्फ़ स्क्रीन रीडर देख सकते हैं.
कभी-कभी, वेब कॉन्टेंट में क्या हो रहा है, इस बारे में स्क्रीन रीडर को बताने के लिए, सच्चाई के बारे में ज़्यादा जानकारी देना या फिर सीधे तौर पर "झूठ" बोलना ज़रूरी होता है. उदाहरण के लिए, "फ़ोकस असल में यहां है!" या "यह असल में एक स्लाइडर है!". यह ठीक वैसा ही है जैसे अपनी वर्कबेंच पर टूल और विजेट के ऊपर जादुई स्टिकी नोट जोड़ना. इन जादुई स्टिकी नोट पर लिखी गई बातों पर सभी लोग यकीन करते हैं.
जब कोई जादुई स्टिकी नोट मौजूद होता है, तो यह हमारे इस विश्वास को बदल देता है कि हर टूल क्या है या क्या करता है. उदाहरण के लिए, अगर आपने ARIA एट्रिब्यूट के तौर पर "यह चीज़ यहां एक ग्लू गन है!" जोड़ा है. भले ही, यह एक खाली नीला बॉक्स है, लेकिन मैजिकल चिपकने वाली नोट से हमें पता चलता है कि यह एक ग्लू गन है. हम "और यह 30% भरा हुआ है!" भी जोड़ सकते हैं. स्क्रीन रीडर अब बताता है कि ग्लू गन में 30% ग्लू है.
वेब पर, इसके बराबर का कोई एलिमेंट बनाने के लिए, एक सादा div बनाएं और उसमें एक इमेज जोड़ें. इसके बाद, ARIA का इस्तेमाल करके बताएं कि यह एक स्लाइडर है और इसकी वैल्यू 100 में से 30 है. ARIA, div को स्लाइडर नहीं बनाता है. यह सिर्फ़ स्क्रीन रीडर को बताता है कि यह एक स्लाइडर है.
ARIA का इस्तेमाल करने से, वेब पेज के दिखने के तरीके या माउस या कीबोर्ड का इस्तेमाल करने के तरीके पर कोई असर नहीं पड़ता. सहायक टेक्नोलॉजी का इस्तेमाल करने वाले लोग ही ARIA के असर को नोटिस करते हैं. वेब डेवलपर, सहायक टेक्नोलॉजी का इस्तेमाल न करने वाले उपयोगकर्ताओं पर असर डाले बिना, अपनी पसंद के मुताबिक कोई भी ARIA जोड़ सकते हैं.
आपने सही पढ़ा है: ARIA, कीबोर्ड फ़ोकस या टैब ऑर्डर के लिए कुछ नहीं करता. यह एचटीएमएल में किया जाता है. कभी-कभी इसमें JavaScript का इस्तेमाल भी किया जाता है.
ARIA कैसे काम करता है?
स्क्रीन रीडर या अन्य सहायक तकनीक, ब्राउज़र से हर एलिमेंट के बारे में जानकारी मांगती है. जब किसी एलिमेंट पर ARIA मौजूद होता है, तो ब्राउज़र उस एलिमेंट के बारे में स्क्रीन रीडर को बताई जाने वाली जानकारी में बदलाव करता है.
यहां एरिया के कुछ सामान्य इस्तेमाल के उदाहरण दिए गए हैं.
- एचटीएमएल में मौजूद नहीं होने वाले खास कॉम्पोनेंट जोड़ें. जैसे, अपने-आप पूरा होने वाला टेक्स्ट, ट्री या स्प्रेडशीट.
- ऐसे कॉम्पोनेंट जोड़ें जो एचटीएमएल में मौजूद हैं, लेकिन लेखक ने तय किया है कि उन्हें फिर से बनाया जाना चाहिए. ऐसा इसलिए हो सकता है, क्योंकि उन्हें स्टैंडर्ड एलिमेंट के व्यवहार या रंग-रूप में बदलाव करना हो. उदाहरण के लिए, एचटीएमएल
<input type="range">एलिमेंट, मूल रूप से एक स्लाइडर होता है. हालांकि, लेखक इसे अलग तरह से दिखाना चाहते हैं.- ज़्यादातर मामलों में, सीएसएस की मदद से इस समस्या को हल किया जा सकता है. हालांकि,
rangeके लिए सीएसएस का इस्तेमाल करना मुश्किल है. लेखक अपना स्लाइडर बना सकते हैं और कीबोर्ड को मौजूदा वैल्यू बताने के लिए,role="slider"के साथaria-valuenowका इस्तेमाल कर सकते हैं.
- ज़्यादातर मामलों में, सीएसएस की मदद से इस समस्या को हल किया जा सकता है. हालांकि,
- स्क्रीन रीडर को पेज के किसी हिस्से में हुए ज़रूरी बदलावों के बारे में बताने के लिए, लाइव रीजन शामिल करें.
- हेडिंग जैसे लैंडमार्क बनाएं. लैंडमार्क की मदद से, स्क्रीन रीडर इस्तेमाल करने वाले लोग अपनी पसंद के कॉन्टेंट को तेज़ी से ढूंढ सकते हैं. लैंडमार्क में, उससे जुड़ा पूरा इलाका शामिल हो सकता है. उदाहरण के लिए, "यह कंटेनर, पेज का मुख्य हिस्सा है" और "यहां मौजूद यह कंटेनर, नेविगेशन पैनल है".
ARIA क्यों?
एचटीएमएल में पहले से काम करने वाले कुछ ARIA जोड़ना फ़ायदेमंद हो सकता है. उदाहरण के लिए, हो सकता है कि हम किसी अमान्य इनपुट के लिए, गड़बड़ी के मैसेज वाली चेतावनी पर ले जाने के लिए फ़ॉर्म कंट्रोल का इस्तेमाल करना चाहें. इसके अलावा, हम किसी टेक्स्ट इनपुट के खास इस्तेमाल के बारे में बताना चाह सकते हैं. इन बदलावों की मदद से, सामान्य वेबसाइटों को स्क्रीन रीडर के साथ ज़्यादा आसानी से इस्तेमाल किया जा सकता है.
मेन्यू बार का उदाहरण
मान लें कि स्थानीय वेब स्टोर में, हमारे काम के सभी विजेट नहीं बेचे जाते. हालांकि, हम MacGyver हैं. हम दूसरे विजेट से अपने विजेट बना सकते हैं! यह ठीक वैसा ही है जैसे किसी वेब लेखक को मेन्यू बार बनाना हो.
<nav> एलिमेंट मौजूद होने के बावजूद, मेन्यू बार को अक्सर divs, इमेज, बटन, क्लिक हैंडलर, बटन दबाने पर होने वाली कार्रवाइयों के हैंडलर, और ARIA का इस्तेमाल करके एक साथ जोड़ा जाता है.
माउस का इस्तेमाल करने वाले लोगों के लिए सहायता
आइए, मिलकर एक मेन्यू बार बनाते हैं. हम कई आइटम को divs नाम के सामान्य बॉक्स एलिमेंट में दिखाते हैं. जब भी कोई उपयोगकर्ता किसी डायव पर क्लिक करता है, तो वह उससे जुड़ा निर्देश लागू करता है. वाह, यह माउस क्लिक करने वाले लोगों के लिए काम करता है!
इसके बाद, हम उसे खूबसूरत बनाते हैं. हम एलिमेंट को अच्छी तरह से अलाइन करने और उनके चारों ओर विज़ुअल आउटलाइन डालने के लिए, सीएसएस का इस्तेमाल करते हैं. हम इसे अन्य मेन्यू बार की तरह ही बनाते हैं, ताकि साइट विज़िटर को पता चले कि यह एक मेन्यू बार है और इसका इस्तेमाल कैसे किया जाता है. हमारा मेन्यू बार, माउस घुमाने पर किसी भी आइटम के बैकग्राउंड के लिए अलग रंग का इस्तेमाल करता है. इससे उपयोगकर्ता को विज़ुअल फ़ीडबैक मिलता है.
मेन्यू के कुछ आइटम पैरंट होते हैं. ये चाइल्ड सबमेन्यू बनाते हैं. जब भी कोई उपयोगकर्ता इनमें से किसी एक आइकॉन पर कर्सर घुमाता है, तो हम एक ऐनिमेशन शुरू करते हैं. यह ऐनिमेशन, चाइल्ड सबमेन्यू को स्लाइड करके बाहर निकालता है.
वेब पर मौजूद कई चीज़ों की तरह, इनका ऐक्सेस भी आसानी से नहीं मिलता.
हमारे मेन्यू बार के कीबोर्ड को ऐक्सेस करने की सुविधा जोड़ना
चलिए, कीबोर्ड की सुलभता सुविधा जोड़ते हैं. इसके लिए, सिर्फ़ एचटीएमएल में बदलाव करने की ज़रूरत होती है, न कि ARIA में. याद रखें कि ARIA, सहायक टेक्नोलॉजी का इस्तेमाल न करने वाले उपयोगकर्ताओं के लिए, दिखने के तरीके, माउस या कीबोर्ड जैसे मुख्य पहलुओं पर असर नहीं डालता.
जिस तरह वेब पेज, माउस के निर्देशों का पालन करता है उसी तरह कीबोर्ड के निर्देशों का भी पालन करता है. हमारा JavaScript, होने वाले सभी कीस्ट्रोक को सुन सकता है और यह तय कर सकता है कि कीस्ट्रोक काम का है या नहीं. अगर ऐसा नहीं होता है, तो यह उसे पेज पर वापस फेंक देता है, जैसे कि खाने के लिए बहुत छोटी मछली. हमारे नियम कुछ इस तरह के हैं:
- अगर उपयोगकर्ता ऐरो बटन दबाता है, तो आइए अपने मेन्यू बार के ब्लूप्रिंट देखें और तय करें कि नया ऐक्टिव मेन्यू आइटम क्या होना चाहिए. हम सभी मौजूदा हाइलाइट हटा देंगे और नए मेन्यू आइटम को हाइलाइट कर देंगे, ताकि देख सकने वाले उपयोगकर्ता को पता चल सके कि वे कहां हैं. इसके बाद, वेब पेज को
event.preventDefault()को कॉल करना चाहिए, ताकि ब्राउज़र सामान्य कार्रवाई (इस मामले में, पेज को स्क्रोल करना) न कर सके. - अगर उपयोगकर्ता Enter बटन दबाता है, तो हम इसे क्लिक की तरह ही इस्तेमाल कर सकते हैं और ज़रूरी कार्रवाई कर सकते हैं. इसके अलावा, हम कोई दूसरा मेन्यू भी खोल सकते हैं.
- अगर उपयोगकर्ता किसी ऐसे बटन को दबाता है जिससे कोई और कार्रवाई होनी चाहिए, तो उसे वापस पेज पर भेजें. उदाहरण के लिए, हमारे मेन्यू बार में Tab बटन की ज़रूरत नहीं है. इसलिए, इसे हटा दें! इसे सही करना मुश्किल है. उदाहरण के लिए, मेन्यू बार के लिए ऐरो बटन की ज़रूरत होती है, लेकिन Alt+ऐरो या Command+ऐरो की ज़रूरत नहीं होती. ये आपके ब्राउज़र टैब के वेब इतिहास में, पिछले और अगले पेज पर जाने के लिए शॉर्टकट हैं. अगर लेखक ज़रूरत के मुताबिक सावधानी नहीं बरतता है, तो मेन्यू बार उनका इस्तेमाल कर लेगा. इस तरह की गड़बड़ी अक्सर होती है. हमने अभी तक ARIA का इस्तेमाल शुरू भी नहीं किया है!
स्क्रीन रीडर के लिए, हमारे मेन्यू बार का ऐक्सेस
हमारा मेन्यू बार, डक्ट टेप और डिव का इस्तेमाल करके बनाया गया था. इस वजह से, स्क्रीन रीडर को यह पता नहीं चलता कि इनमें से कौनसा आइटम चालू है. चालू आइटम का बैकग्राउंड कलर सिर्फ़ एक रंग होता है. मेन्यू आइटम के डाइव, सिर्फ़ सामान्य ऑब्जेक्ट होते हैं. इनका कोई खास मतलब नहीं होता. इस वजह से, हमारे मेन्यू बार के उपयोगकर्ता को यह जानकारी नहीं मिलती कि कौनसी बटन दबानी हैं या वे किस आइटम पर हैं.
लेकिन यह सही नहीं है! मेन्यू बार, उन लोगों के लिए ठीक से काम करता है जो देख सकते हैं.
ARIA की मदद से. ARIA की मदद से, हम स्क्रीन रीडर को यह बता सकते हैं कि फ़ोकस किसी मेन्यू बार में है. अगर लेखक ने सब कुछ सही तरीके से किया है, तो स्क्रीन रीडर के लिए हमारा कस्टम मेन्यू बार, डेस्कटॉप ऐप्लिकेशन के मेन्यू बार की तरह ही दिखेगा.
ARIA का पहला झूठ aria-activedescendant एट्रिब्यूट है. एट्रिब्यूट को ऐक्टिव मेन्यू आइटम के आईडी पर सेट करें. साथ ही, जब भी कोई बदलाव हो, उसे अपडेट करना न भूलें. उदाहरण के लिए,
aria-activedescendant="settings-menuitem". इस वजह से, स्क्रीन रीडर हमारे ARIA ऐक्टिव आइटम को फ़ोकस के तौर पर लेता है. इसे तेज़ आवाज़ में पढ़कर सुनाया जाता है या ब्रेल डिसप्ले पर दिखाया जाता है.
वंश का मतलब है कि कोई आइटम किसी दूसरे आइटम में मौजूद है. इसके उलट, किसी आइटम के पूर्वज होते हैं. इसका मतलब है कि किसी आइटम में पूर्वज शामिल होते हैं. अगले कंटेनर को ऊपर/नीचे करने के लिए, इनमें पैरंट/चाइल्ड जैसे ज़्यादा सटीक शब्दों का इस्तेमाल किया जा सकता है. उदाहरण के लिए, मान लें कि किसी दस्तावेज़ में एक पैराग्राफ़ है और उसमें एक लिंक है. लिंक का पैरंट पैराग्राफ़ है, लेकिन इसमें दस्तावेज़ भी एंसेस्टर के तौर पर मौजूद है. इसके उलट, दस्तावेज़ में कई पैराग्राफ़ चाइल्ड हो सकते हैं और हर पैराग्राफ़ में लिंक हो सकते हैं. ये लिंक, सभी दस्तावेज़ के वंशज हैं.
फ़ोकस किए गए मेन्यू बार से किसी खास मेन्यू आइटम पर जाने के लिए aria-activedescendant का इस्तेमाल करने पर, स्क्रीन रीडर को पता चल जाता है कि उपयोगकर्ता कहां पर है. हालांकि, उसे ऑब्जेक्ट के बारे में कोई जानकारी नहीं मिलती. आखिर यह div क्या है? ऐसे में, भूमिका एट्रिब्यूट का इस्तेमाल किया जाता है. हम पूरी चीज़ के लिए, role="menubar" एलिमेंट का इस्तेमाल करते हैं. इसके बाद, आइटम के ग्रुप के लिए role="menu" और … ड्रमरोल … अलग-अलग मेन्यू आइटम के लिए role="menuitem" का इस्तेमाल करते हैं.
अगर मेन्यू आइटम से चाइल्ड मेन्यू खुलता है, तो क्या होगा? उपयोगकर्ता को यह जानकारी होनी चाहिए.
जिन लोगों को देखना आता है उनके लिए, मेन्यू के आखिर में एक छोटा सा ट्राएंगल दिख सकता है. हालांकि, फ़िलहाल स्क्रीन रीडर, इमेज को अपने-आप पढ़ने की सुविधा नहीं देता. हम हर उस मेन्यू आइटम पर aria-expanded="false" जोड़ सकते हैं जिसे बड़ा किया जा सकता है. इससे यह पता चलता है कि कुछ ऐसा है जिसे बड़ा किया जा सकता है और वह बड़ा नहीं किया गया है. इसके अलावा, लेखक को img त्रिकोण पर role="none" डालना चाहिए, ताकि यह पता चल सके कि यह सिर्फ़ सुंदरता के लिए है. इससे स्क्रीन रीडर, इमेज के बारे में ऐसी कोई जानकारी नहीं देता जो ज़रूरी नहीं है.
कीबोर्ड से जुड़ी गड़बड़ियां ठीक करना
कीबोर्ड ऐक्सेस, मुख्य एचटीएमएल का हिस्सा है. हालांकि, इसे आसानी से बदला जा सकता है. उदाहरण के लिए:
- चेकबॉक्स को टॉगल करने के लिए स्पेसबार का इस्तेमाल किया जाता है, लेकिन लेखक ने
preventDefault()को कॉल करना भूल गया. अब स्पेसबार, चेकबॉक्स को टॉगल करने के साथ-साथ पेज को नीचे भी ले जाता है. यह स्पेसबार के लिए ब्राउज़र का डिफ़ॉल्ट तरीका है. - ARIA मॉडल डायलॉग, टैब नेविगेशन को अपने अंदर ट्रैप करना चाहता है. अगर लेखक, डायलॉग बॉक्स में रहते हुए, Control+Tab को नया टैब खोलने की अनुमति नहीं देता है, तो यह उम्मीद के मुताबिक काम नहीं करेगा.
- कोई लेखक, चुनने के लिए सूची बनाता है और अप और डाउन बटन लागू करता है. हालांकि, लेखक को अब भी होम, एंड, पेजअप, पेजडाउन या पहले अक्षर पर नेविगेट करने की सुविधा जोड़नी होगी.
लेखकों को जाने-पहचाने पैटर्न का इस्तेमाल करना चाहिए. ज़्यादा जानकारी के लिए, संसाधन सेक्शन देखें.
कीबोर्ड से ऐक्सेस करने से जुड़ी समस्याओं का पता लगाने के लिए, स्क्रीन रीडर का इस्तेमाल न करें या वर्चुअल ब्राउज़र मोड बंद करें. स्क्रीन रीडर के बिना, कीबोर्ड से जुड़ी गड़बड़ियों का पता लगाया जा सकता है. ऐसा इसलिए, क्योंकि कीबोर्ड से ऐक्सेस करने की सुविधा को ARIA के बजाय, एचटीएमएल के साथ लागू किया जाता है. आखिरकार, ARIA का असर कीबोर्ड या माउस के व्यवहार पर नहीं पड़ता. इसके बजाय, यह स्क्रीन रीडर को बताता है कि वेब पेज पर क्या है, फ़िलहाल किस पर फ़ोकस किया गया है वगैरह.
कीबोर्ड से जुड़ी गड़बड़ियां, वेब कॉन्टेंट में होती हैं. खास तौर पर, एचटीएमएल और JavaScript में, न कि ARIA में.
इतने सारे क्यों हैं?
लेखक के लिए, ARIA का गलत इस्तेमाल करने के कई तरीके हैं. हर गलती से, पूरी तरह से काम न करने या छोटे-मोटे अंतर की समस्या होती है. छोटी-मोटी समस्याएं ज़्यादा खतरनाक हो सकती हैं, क्योंकि पब्लिश करने से पहले लेखक को उनका पता चलने की संभावना कम होती है.
आखिरकार, जब तक लेखक स्क्रीन रीडर का इस्तेमाल करने में माहिर नहीं होता, तब तक ARIA में कुछ गड़बड़ी होगी. हमारे मेन्यू बार के उदाहरण में, लेखक को लग सकता है कि "option" भूमिका का इस्तेमाल तब किया जाना चाहिए, जब "menuitem" सही हो. हो सकता है कि वे aria-expanded का इस्तेमाल करना भूल जाएं, सही समय पर aria-activedescendant को सेट और हटाना भूल जाएं या अन्य मेन्यू वाले मेन्यू बार को इस्तेमाल करना भूल जाएं.
मेन्यू आइटम की संख्या के बारे में क्या? आम तौर पर, स्क्रीन रीडर मेन्यू आइटम को "पांच में से तीसरा आइटम" जैसे कुछ के साथ दिखाते हैं, ताकि उपयोगकर्ता को पता रहे कि वे कहां हैं. आम तौर पर, ब्राउज़र में यह संख्या अपने-आप गिनी जाती है. हालांकि, कुछ मामलों में और कुछ ब्राउज़र - स्क्रीन रीडर कॉम्बिनेशन में, गलत संख्याएं दिख सकती हैं. ऐसे में, लेखक को इन संख्याओं को aria-posinset और aria-setsize से बदलना होगा.
और यह सिर्फ़ मेन्यू बार है. देखें कि कितने तरह के विजेट हैं. अगर आप चाहें, तो ARIA स्पेसिफ़िकेशन या लेखन के तरीकों को देखें. हर पैटर्न के लिए, ARIA का गलत इस्तेमाल करने के 12 तरीके हैं. ARIA, लेखकों पर भरोसा करता है कि वे क्या कर रहे हैं. ज़्यादातर लेखक स्क्रीन रीडर का इस्तेमाल नहीं करते, तो क्या हो सकता है?
दूसरे शब्दों में, स्क्रीन रीडर का इस्तेमाल करने वाले लोगों के लिए यह ज़रूरी है कि वे ARIA विजेट को आज़माएं. ऐसा करने के बाद ही, उन्हें डिवाइस पर इस्तेमाल करने के लिए उपलब्ध कराया जा सकता है. बहुत ज़्यादा बारीकियां हैं. आम तौर पर, सब कुछ कई अलग-अलग ब्राउज़र-स्क्रीन रीडर कॉम्बिनेशन के साथ आज़माया जाएगा. ऐसा इसलिए, क्योंकि लागू करने के कई तरीके हैं और कुछ तरीके अधूरे हैं.
खास जानकारी
एआरआईए का इस्तेमाल, एचटीएमएल में बताई गई हर चीज़ को बदलने या उसमें कुछ जोड़ने के लिए किया जा सकता है. इसकी मदद से, सुलभता प्रज़ेंटेशन में छोटे बदलाव किए जा सकते हैं या पूरी तरह से नया अनुभव बनाया जा सकता है. इस वजह से, ARIA हमारे उन डेवलपर के लिए काफ़ी असरदार और खतरनाक है जो स्क्रीन रीडर का इस्तेमाल नहीं करते.
ARIA एक मार्कअप लेयर है, जो अन्य विकल्पों को बदल देती है. जब कोई स्क्रीन रीडर पूछता है कि क्या हो रहा है, तो अगर ARIA मौजूद है, तो उपयोगकर्ता को ARIA वर्शन मिलता है.
अन्य संसाधन
W3C के ARIA लेखन के तरीके में, हर उदाहरण के लिए कीबोर्ड नेविगेशन की अहम विशेषताओं के बारे में बताया गया है. साथ ही, इसमें काम करने वाले JavaScript, CSS, और ARIA के बारे में भी बताया गया है. इन उदाहरणों में, फ़िलहाल काम करने वाले तरीकों के बारे में बताया गया है. इनमें मोबाइल के बारे में नहीं बताया गया है.
Accessibility API क्या है?
सुलभता एपीआई की मदद से, स्क्रीन रीडर या अन्य सहायक तकनीक को यह पता चलता है कि पेज पर क्या है और उस पर क्या हो रहा है. उदाहरण के लिए, MSAA, IA2, और UIA. Accessibility API के दो हिस्से होते हैं:
- ऑब्जेक्ट का "ट्री", जो कंटेनर की हैरारकी दिखाता है. उदाहरण के लिए, किसी दस्तावेज़ में कई पैराग्राफ़ हो सकते हैं. पैराग्राफ़ में टेक्स्ट, इमेज, लिंक, और टेक्स्ट डेकोरेशन हो सकते हैं. ऑब्जेक्ट ट्री में मौजूद हर आइटम में प्रॉपर्टी हो सकती हैं. जैसे, भूमिका (मेरी भूमिका क्या है?), नाम या लेबल, उपयोगकर्ता की डाली गई वैल्यू, ब्यौरा, और बूलियन स्टेटस, जैसे कि फ़ोकस किया जा सकता है, फ़ोकस किया गया है, ज़रूरी है, और सही का निशान लगा है. ARIA, इनमें से किसी भी प्रॉपर्टी को बदल सकता है.
- स्क्रीन रीडर, वर्चुअल बफ़र मोड में नेविगेट करने में उपयोगकर्ताओं की मदद करने के लिए ट्री का इस्तेमाल करते हैं. जैसे, "कृपया अगली हेडिंग पर जाएं".
- ट्री में होने वाले बदलावों की जानकारी देने वाले इवेंट की सीरीज़, जैसे कि "फ़ोकस अब यहां है!". स्क्रीन रीडर, उपयोगकर्ता को यह बताने के लिए इवेंट का इस्तेमाल करता है कि अभी क्या हुआ. जब ज़रूरी एचटीएमएल या ARIA मार्कअप में बदलाव होता है, तो स्क्रीन रीडर को यह बताने के लिए एक इवेंट ट्रिगर किया जाता है कि कुछ बदला है.
एचटीएमएल, इन सुलभता एपीआई के साथ अच्छी तरह से काम करता है. जब एचटीएमएल काफ़ी नहीं होता, तो ARIA जोड़ा जा सकता है, ताकि स्क्रीन रीडर को ऑब्जेक्ट ट्री या इवेंट भेजने से पहले, ब्राउज़र एचटीएमएल सेमेटिक्स को बदल दे.