ARIA वेब मानकों और HTML Apps पहुँच में एक नज़र
एक वास्तविक रूप से खुली और समावेशी वेब को ऐसी तकनीकों की आवश्यकता होती है जो अक्षम उपयोगकर्ताओं को गतिशील वेब सामग्री और आधुनिक वेब एप्लिकेशन का आनंद लेने के लिए सहायक तकनीकों पर निर्भर करती है। W3C की एक्सेसिबिलिटी वेब मानकों का उद्देश्य एक्सेसिबल रिच इंटरनेट एप्लिकेशन (ARIA) के साथ वेब को पॉप्युलेट करना है जिसे डिसेबिलिटी वाले उपयोगकर्ता कुशलतापूर्वक उपयोग कर सकते हैं.
ARIA वेब एक्सेसिबिलिटी इंटेस्टिव (WAI) द्वारा प्रकाशित कई पहुँच मानकों और दिशानिर्देशों में से एक है। यह एक अतिरिक्त मार्कअप प्रदान करता है जिसे आसानी से HTML दस्तावेजों में डाला जा सकता है। WAI-ARIA एक क्रॉस-प्लेटफ़ॉर्म है जो एक क्रॉस-डिवाइस समाधान है जो ओपन वेब प्लेटफ़ॉर्म को लक्षित करता है, इसलिए न केवल वेबसाइटों के बारे में सोचें, बल्कि गेम, डिजिटल मनोरंजन, स्वास्थ्य सेवा, मोबाइल और अन्य प्रकार के ऐप्स के बारे में भी सोचें.
इस पोस्ट में हम इस पर एक नज़र डालेंगे कि आप WAI-ARIA मानकों की मदद से अपने HTML दस्तावेज़ों तक पहुँच को कैसे जोड़ सकते हैं.
ARIA फ्रेमवर्क
HTML का सिंटैक्स हमेशा डेवलपर्स को ठीक से तत्वों का वर्णन करने, उनकी भूमिकाओं की पहचान करने और उनके बीच संबंधों को निर्दिष्ट करने की अनुमति नहीं देता है। हालांकि, यह शायद ही कभी आगंतुकों के लिए एक समस्या है जो अपनी इंद्रियों के पूर्ण कब्जे में हैं, यह सहायक प्रौद्योगिकी उपयोगकर्ताओं को यह समझने से रोक सकता है कि स्क्रीन पर क्या हो रहा है और उनके विकल्पों की खोज की जा रही है.
यही वह बिंदु है जहां ARIA हमारी मदद के लिए आता है, क्योंकि इसकी सहायता से विभिन्न तत्वों के उद्देश्य को परिभाषित करना संभव हो जाता है ऐतिहासिक भूमिकाएँ, और उनके स्वभाव का वर्णन करें aria- उपसर्ग विशेषताएँ. Aria- उपसर्गों के गुण दो प्रकार के होते हैं: गुण उन विशेषताओं का वर्णन करते हैं जो पूरे जीवन-चक्र में बदलने की संभावना कम होती हैं, और राज्यों उन चीजों के बारे में जानकारी प्रदान करता है जो उपयोगकर्ता इंटरैक्शन के कारण अक्सर बदल सकते हैं.
लैंडमार्क रोल्स
ऐतिहासिक भूमिकाएँ ARIA के रोल्स मॉडल के सबसे प्रसिद्ध रूप हैं (अन्य सार रोल्स, विजेट रोल्स और दस्तावेज़ संरचना रोल्स हैं)। लैंडमार्क भूमिकाएं डेवलपर्स को बड़ी पहचान करने में सक्षम बनाती हैं विचार करने योग्य क्षेत्र वेब पेज पर जो सहायक प्रौद्योगिकी उपयोगकर्ता जल्दी पहुंचना चाहते हैं.
8 प्रकार के ARIA लैंडमार्क भूमिकाएँ हैं, और उन्हें संबंधित HTML टैग में विशेषताओं के रूप में जोड़े जाने की आवश्यकता है.
भूमिका =”बैनर”
बैनर की भूमिका मुख्य रूप से सामग्री के लिए उपयोग की जाने वाली है, जो कि संपूर्ण साइट से संबंधित है, न कि केवल व्यक्तिगत पृष्ठों पर। यह आमतौर पर लोगो और अन्य महत्वपूर्ण साइट-विस्तृत जानकारी के लिए साइट के मुख्य शीर्षक के लिए एक विशेषता के रूप में जोड़ा जाता है। यह महत्वपूर्ण है कि आप किसी भी HTML दस्तावेज़ या एप्लिकेशन में केवल एक बार बैनर भूमिका का उपयोग कर सकते हैं.
भूमिका =”मुख्य”
मुख्य लैंडमार्क भूमिका दस्तावेज़ की मुख्य सामग्री से संबंधित है। यह किसी भी HTML पृष्ठ पर एक से अधिक बार उपयोग नहीं किया जा सकता है। यह आमतौर पर इस प्रकार है नेविगेशन भूमिका का उपयोग उस क्षेत्र को इंगित करने के लिए किया जाता है जिसमें किसी साइट पर लिंक और सूचियों जैसे नेविगेशनल तत्व होते हैं. पूरक मील का पत्थर भूमिका अतिरिक्त सामग्री का वर्णन करती है जो साइट की मुख्य सामग्री से संबंधित है। यह डोम पदानुक्रम में समान स्तर पर रखा जाना चाहिए सामग्री की भूमिका उपयोगकर्ता एजेंटों को एक ऐसे क्षेत्र की उपस्थिति के बारे में सूचित करती है जहां विभिन्न प्रकार के मेटाडेटा, जैसे कि कॉपीराइट जानकारी, कानूनी और गोपनीयता कथन मिल सकते हैं। यह आमतौर पर किसी साइट के पाद लेख के लिए उपयोग किया जाता है. प्रपत्र लैंडमार्क भूमिका उपयोगकर्ता इनपुट के लिए प्रतीक्षा करने वाले फ़ॉर्म को इंगित करती है। खोज प्रपत्रों के लिए आपको उपयोग करना चाहिए खोज भूमिका बहुत ही आत्म-व्याख्यात्मक है, यह एक वेबसाइट की खोज कार्यक्षमता की पहचान करने में सहायक तकनीकों की मदद करने के लिए है. आप उस क्षेत्र के लिए एप्लिकेशन लैंडमार्क भूमिका का उपयोग कर सकते हैं जिसे आप वेब दस्तावेज़ के बजाय वेब ऐप के रूप में घोषित करना चाहते हैं। इसे पारंपरिक वेबसाइटों में शामिल करने की अनुशंसा नहीं की जाती है, क्योंकि यह सहायक तकनीकों को सामान्य ब्राउज़िंग मोड से एप्लिकेशन ब्राउज़िंग मोड में स्विच करने के लिए संकेत देता है। आपको केवल इस लैंडमार्क भूमिका का बड़े ध्यान से उपयोग करना चाहिए. जबकि भूमिकाएँ आपको एचटीएमएल टैग के अर्थ को परिभाषित करने में सक्षम बनाती हैं, राज्य और गुण उपयोगकर्ता को उनके साथ बातचीत करने के बारे में अतिरिक्त जानकारी प्रदान करते हैं। दोनों राज्यों और संपत्तियों के साथ चिह्नित हैं aria- उपसर्ग विशेषताएँ वाक्य रचना के साथ aria- *. सबसे प्रसिद्ध एआरआईए गुण शायद aria- आवश्यक संपत्ति और aria-check राज्य हैं। Aria- आवश्यक एक है संपत्ति क्योंकि यह एक इनपुट तत्व की स्थायी विशेषता है (यानी उपयोगकर्ता को इसे भरना होगा), जबकि एरिया-चेक एक है राज्य क्योंकि उपयोगकर्ता की सहभागिता के कारण एक चेकबॉक्स अक्सर अपना मूल्य बदल सकता है. स्टेट्स और प्रॉपर्टीज कभी-कभी टोकन वैल्यू लेते हैं (पूर्वनिर्धारित मूल्यों का एक सीमित सेट), उदाहरण के लिए aria-live प्रॉपर्टी के कई अलग-अलग मूल्य हो सकते हैं: बंद, सभ्य, मुखर. इस उदाहरण में सिंटैक्स इस तरह दिखता है: अन्य मामलों में aria-prefixed विशेषताओं के मूल्यों द्वारा प्रतिनिधित्व किया जाता है तार, संख्या, पूर्णांकों, आईडी संदर्भ या सही गलत मान. अपनी साइट पर विभिन्न तत्वों के बीच संबंधों को इंगित करने के लिए संबंध विशेषताओं का उपयोग करें, जिसे अन्यथा दस्तावेज़ संरचना से निर्धारित नहीं किया जा सकता है। उदाहरण के लिए जब आप अपने HTML पृष्ठ पर एक विचारशील क्षेत्र के लिए ARIA लैंडमार्क भूमिका सेट करते हैं, तो यह ARIA-पूर्वनिर्मित राज्यों और स्क्रीन पर होने वाली घटनाओं के अनुसार बाल तत्वों के गुणों को बदलने पर सहायक तकनीकों को बहुत मदद कर सकता है। यह महत्वपूर्ण हो सकता है जहां उपयोगकर्ताओं को साइट के साथ बातचीत करनी होती है, उदाहरण के लिए किसी फ़ॉर्म को भरना या खोज क्वेरी चलाना. एक्सेसिबिलिटी डिज़ाइन के अंगूठे का सामान्य नियम यह है कि उपयोगकर्ता इंटरफ़ेस की वर्तमान स्थिति को हमेशा सहायक तकनीकों द्वारा विचार करने योग्य होना चाहिए। उदाहरण के लिए यदि उपयोगकर्ता किसी प्रपत्र में विकल्प चुनता है, तो उसे सहायक तकनीकों के लिए भी चयनित होना आवश्यक है। निम्नलिखित सिंटैक्स के साथ aria चयनित राज्य का उपयोग करके इसे आसानी से प्राप्त किया जा सकता है: W3C का WAI-ARIA ऑथरिंग प्रैक्टिस गाइडलाइन आपको कई अन्य बेहतरीन विचार दे सकता है कि कैसे आपकी साइट के दृश्य और सुलभ इंटरफेस को ठीक से समाहित किया जाए।. ARIA भूमिकाओं और विशेषताओं का उपयोग करना कभी-कभी बेमानी हो सकता है। जब आप HTML5 जैसे शब्दार्थ टैग का उपयोग करते हैं उदाहरण के लिए इसका उपयोग करना अनावश्यक है प्रपत्र को परिभाषित करने के लिए ऐतिहासिक भूमिका तो अगर आपने पहले ही जोड़ लिया है छिपा हुआ HTML एक फार्म इनपुट के लिए विशेषता है, यह जोड़ने के लिए अनावश्यक है aria-छिपा हुआ राज्य, चूंकि ब्राउज़र इसे डिफ़ॉल्ट रूप से शामिल करता है.. बाद वाले को मैपिंग के उद्देश्य से W3C स्पेक्स में जोड़ा गया मुख्य एक अर्थपूर्ण HTML तत्व के लिए ARIA की ऐतिहासिक भूमिका. भूमिका =”पथ प्रदर्शन”
भूमिका =”पूरक”
भूमिका = "मुख्य". संबंधित पोस्ट, लोकप्रिय लेख, नवीनतम टिप्पणियाँ स्वायत्त पूरक सामग्री के विशिष्ट उदाहरण हैं.भूमिका =”contentinfo”
भूमिका =”प्रपत्र”
भूमिका = "खोज" बजाय.भूमिका =”खोज”
भूमिका =”आवेदन”
राज्यों और गुण
ऐरिया-उपसर्ग के गुण का सिंटैक्स
एआरआईए राज्यों और गुणों का उपयोग कैसे करें
1. संबंधों के साथ तत्वों के बीच संबंधों का निर्माण करें
aria-labelledby गुण तत्व को पहचानता है जो वर्तमान तत्व को लेबल करता है.aria-labelledby - कई अन्य बातों के अलावा - निम्नलिखित तरीके से ARIA के लैंडमार्क क्षेत्रों के लिए शीर्षक बाँध सकते हैं:यह एक प्रमुख है
मुख्य सामग्री… 2. तत्व के जीवनचक्र के साथ राज्यों और गुणों को सिंक्रनाइज़ करें
3. विजुअल और द एक्सेसिबल इंटरफेसेस का मिलान करें
.अति मत करो
या , आधुनिक वेब ब्राउज़र डिफ़ॉल्ट रूप से उपयुक्त ARIA शब्दार्थ जोड़ते हैं। इस मामले में ARIA लैंडमार्क भूमिकाओं को अलग करने के लिए इसका कोई अर्थ नहीं है. तत्व। के स्थान पर सिंटैक्स यह पूरी तरह से बस का उपयोग करने के लिए पर्याप्त है . यह उपयुक्त ARIA विशेषता के साथ HTML की मूल विशेषताओं का उपयोग करने के लिए भी बहुत कम है.
