अर्थवत्ता, लेबल, भूमिकाएँ और फ़ोकस
उचित अर्थवत्ता का उपयोग करें, लेबल को इनपुट से जोड़ें, भूमिकाओं पर भरोसा करें और उपयोगकर्ता की आवश्यकता के अनुसार फ़ोकस ले जाएँ।
अर्थवत्ता, लेबल, भूमिकाएँ और फ़ोकस, CoddyKit पर React Academy का एक निःशुल्क पाठ है। यह 3 में से 1वाँ पाठ है। आप नीचे पूरा पाठ निःशुल्क पढ़ सकते हैं—फिर अंतर्निहित कोड संपादक और 24/7 एआई ट्यूटर के साथ ब्राउज़र में इसका व्यावहारिक अभ्यास कर सकते हैं। यह React Academy सीखने के मार्ग का हिस्सा है और आपकी प्रगति वेब तथा CoddyKit ऐप पर सिंक होती रहती है। React Academy पाठ्यक्रम में कुल 3 पाठ शामिल हैं।
सुलभता की मूल बातें क्यों
लक्ष्य: सहायक तकनीक के लिए UI को समझने योग्य बनाना।
- वास्तविक तत्वों का उपयोग करें (बटन, नेविगेशन, फ़ॉर्म)
- इनपुट को उचित लेबल दें
- प्रवाहों के लिए फ़ोकस प्रबंधित करें
अर्थ-संरचना और भूमिकाओं का अवलोकन
- मूल अर्थ-संरचना को प्राथमिकता दें: डिव के बजाय बटन
- अंतर्निहित भूमिकाएँ वास्तविक तत्वों से मिलती हैं
- जब मूल अर्थ-संरचना पर्याप्त न हो, तभी ARIA जोड़ें
लेबलयुक्त इनपुट (अच्छा)
जुड़े हुए लेबल और प्रतिक्रिया के लिए लाइव क्षेत्र वाले इनपुट बनाएँ।
<div id="root"></div>
बटन और टॉगल की स्थिति
वास्तविक बटन का उपयोग करें और टॉगल की स्थिति aria-pressed से उपलब्ध कराएँ।
<div id="root"></div>
खुलने पर फ़ोकस (अच्छा उपयोगकर्ता अनुभव)
फ़ोकस नए खुले पैनल पर ले जाएँ, ताकि कीबोर्ड का उपयोग करने वाले लोग तुरंत टाइप करना शुरू कर सकें।
<div id="root"></div>
सुझाव और सावधानियाँ
- मूल तत्वों को प्राथमिकता दें; आवश्यकता होने पर ही ARIA जोड़ें
- लेबल इनपुट को विश्वसनीय नाम देते हैं
- ओवरले खोलते समय या नेविगेशन के बाद फ़ोकस प्रबंधित करें
लेबल लगाने की सर्वोत्तम पद्धति
पुनरावलोकन
पुनरावलोकन: वास्तविक अर्थ-संरचना का उपयोग करें, लेबल को इनपुट से जोड़ें, आवश्यकता होने पर भूमिकाओं/ARIA से स्थिति उपलब्ध कराएँ और फ़ोकस को वहाँ ले जाएँ जहाँ उपयोगकर्ता अगली क्रिया करेगा।
एआई शिक्षक के साथ React सीखें — निःशुल्क
अपने ब्राउज़र में वास्तविक कोड लिखें और चलाएँ, चौबीसों घंटे एआई शिक्षक से तुरंत सहायता पाएँ, और वेब या ऐप पर वहीं से शुरू करें जहाँ आपने छोड़ा था।
- पाठ्यक्रम
- 88
- पाठ
- 324
अक्सर पूछे जाने वाले प्रश्न
क्या “अर्थवत्ता, लेबल, भूमिकाएँ और फ़ोकस” पाठ निःशुल्क है?
हाँ—“अर्थवत्ता, लेबल, भूमिकाएँ और फ़ोकस” का पूरा पाठ यहाँ वेब पर निःशुल्क पढ़ा जा सकता है। इंटरैक्टिव अभ्यास (अंतर्निहित कोड संपादक और 24/7 एआई ट्यूटर) करने और React Academy पाठ्यक्रम का बाकी हिस्सा अनलॉक करने के लिए CoddyKit PRO लें। React Academy पाठ्यक्रम में कुल 3 पाठ शामिल हैं।
“अर्थवत्ता, लेबल, भूमिकाएँ और फ़ोकस” में मैं क्या सीखूँगा?
उचित अर्थवत्ता का उपयोग करें, लेबल को इनपुट से जोड़ें, भूमिकाओं पर भरोसा करें और उपयोगकर्ता की आवश्यकता के अनुसार फ़ोकस ले जाएँ। आप ब्राउज़र में सीधे चलाए जाने वाले व्यावहारिक कोड के साथ React Academy का अभ्यास करते हैं, और पाठ पूरा करते समय 24/7 एआई ट्यूटर आपके प्रश्नों के उत्तर देता है।
क्या React Academy शुरू करने के लिए मुझे किसी अनुभव की आवश्यकता है?
पहले के अनुभव की आवश्यकता नहीं है। CoddyKit पर React Academy शुरुआती से लेकर उन्नत शिक्षार्थियों तक सभी के लिए व्यवस्थित किया गया है, इसलिए आप यहीं से या शुरुआत से सीखना शुरू कर सकते हैं और अपनी गति से आगे बढ़ सकते हैं। यह 3 में से 1वाँ पाठ है।
“अर्थवत्ता, लेबल, भूमिकाएँ और फ़ोकस” पाठ पूरा करने में कितना समय लगता है?
CoddyKit का अधिकांश पाठ लगभग 5–10 मिनट में पूरा हो जाता है। हर पाठ छोटा और संवादात्मक है, इसलिए आप लगातार प्रगति करते हैं और वेब या ऐप पर वहीं से सीखना जारी रख सकते हैं जहाँ आपने छोड़ा था।
क्या मैं इस React Academy पाठ में कोड लिख और चला सकता हूँ?
हाँ। हर React Academy पाठ में एक अंतर्निर्मित कोड संपादक शामिल है, जिससे आप सीधे अपने ब्राउज़र में वास्तविक कोड लिख और चला सकते हैं और तुरंत एआई प्रतिक्रिया पा सकते हैं—स्थानीय सेटअप की आवश्यकता नहीं है।
इस पाठ्यक्रम के सभी पाठ
- अर्थवत्ता, लेबल, भूमिकाएँ और फ़ोकस
- कीबोर्ड इंटरैक्शन और स्किप लिंक
- A11y परीक्षण की बुनियाद