HTML में "भूमिका" विशेषता का उद्देश्य क्या है?


1165

मैं कुछ लोगों के काम में भूमिका की विशेषताएं देखता रहता हूं। मैं भी इसका उपयोग करता हूं, लेकिन मैं इसके प्रभाव के बारे में निश्चित नहीं हूं।

उदाहरण के लिए:

<header id="header" role="banner">
    Header stuff in here
</header>

या:

<section id="facebook" role="contentinfo">
    Facebook stuff in here
</section>

या:

<section id="main" role="main">
     Main content stuff in here
</section>

क्या यह भूमिका आवश्यक है?

क्या यह गुण शब्दार्थ के लिए बेहतर है?

क्या यह एसईओ में सुधार करता है?

यहां भूमिकाओं की एक सूची मिल सकती है , लेकिन मैं देख रहा हूं कि कुछ लोग अपनी खुद की बनाते हैं। क्या इसकी अनुमति या भूमिका विशेषता का सही उपयोग है?

इस पर कोई विचार?

जवाबों:


1005

आपके द्वारा देखी जाने वाली अधिकांश भूमिकाओं को ARIA 1.0 के भाग के रूप में परिभाषित किया गया था, और फिर बाद में HTML5 में शामिल किया गया। नए HTML5 तत्वों में से कुछ (संवाद, मुख्य, आदि) मूल ARIA भूमिकाओं पर भी आधारित हैं।

http://www.w3.org/TR/wai-aria/

आपके मूल सिमेंटिक तत्व के अलावा भूमिकाओं का उपयोग करने के दो प्राथमिक कारण हैं।

कारण # 1। उस भूमिका को ओवरराइड करने में जहां कोई मेजबान भाषा तत्व उपयुक्त नहीं है या, विभिन्न कारणों से, एक कम शब्दार्थ उपयुक्त तत्व का उपयोग किया गया था।

इस उदाहरण में, एक लिंक का उपयोग किया गया था, भले ही परिणामस्वरूप कार्यक्षमता नेविगेशन लिंक की तुलना में अधिक बटन जैसी हो।

<a href="#" role="button" aria-label="Delete item 1">Delete</a>

स्क्रीन रीडर इसे एक बटन के रूप में सुनेंगे (लिंक के विपरीत), और आप क्लास-इटिस और डि-इटिस से बचने के लिए CSS विशेषता चयनकर्ता का उपयोग कर सकते हैं।

*[role="button"] {
  /* style these a buttons w/o relying on a .button class */
}

कारण # 2।ARIA भूमिका को लागू करने वाले ब्राउज़रों का समर्थन करने के लिए मूल तत्व की भूमिका का समर्थन करते हुए, लेकिन अभी तक मूल तत्व की भूमिका को लागू नहीं किया है।

उदाहरण के लिए, "मुख्य" भूमिका को कई वर्षों तक ब्राउज़रों में समर्थन दिया गया है, लेकिन यह HTML5 के लिए अपेक्षाकृत हाल ही में जोड़ा गया है, इसलिए कई ब्राउज़र अभी तक अर्थ के लिए समर्थन नहीं करते हैं <main>

<main role="main"></main>

यह तकनीकी रूप से बेमानी है, लेकिन कुछ उपयोगकर्ताओं की मदद करता है और कोई नुकसान नहीं पहुंचाता है। कुछ वर्षों में, यह तकनीक संभवतः अनावश्यक हो जाएगी।

आपने भी लिखा:

मैं देख रहा हूं कि कुछ लोग अपना खुद का मेकअप करते हैं। क्या इसकी अनुमति या भूमिका विशेषता का सही उपयोग है?

जब तक वास्तविक भूमिका शामिल नहीं होती है, तब तक यह विशेषता का एक मान्य उपयोग है। टोकन सूची में ब्राउज़र पहली मान्यता प्राप्त भूमिका को लागू करेगा।

<span role="foo link note bar">...</a>

सूची से बाहर, केवल linkऔर noteमान्य भूमिकाएँ हैं, और इसलिए लिंक भूमिका को लागू किया जाएगा क्योंकि यह पहले आता है। यदि आप कस्टम भूमिकाओं का उपयोग करते हैं, तो सुनिश्चित करें कि वे ARIA या आपके द्वारा उपयोग की जाने वाली होस्ट भाषा (HTML, SVG, MathML, इत्यादि) के साथ संघर्ष नहीं करते हैं।


19
यह लिंक मददगार भी हो सकता है। HTML में ARIA का उपयोग करना। rawgithub.com/w3c/aria-in-html/master/index.html
जेम्स क्रेग

6
आपने [भूमिका = "बटन"] के सामने सार्वभौमिक चयनकर्ता क्यों रखा?
एवगेनी

5
@EugeneXa मेरा अनुमान है कि [role="button"]इच्छा के साथ किसी भी तत्व को इंगित करना हैa[role="button"], span[role="button"]
एनजीप्लेग्राउंड

4
"कुछ वर्षों में, यह तकनीक संभवतः अनावश्यक हो जाएगी"। सुगमता के बारे में कुछ भी आइडी, लेकिन कस्टम टैग बनाने वाले कोणीय और वेब घटकों जैसी चीजों के साथ, मैं कल्पना कर सकता हूं कि यह एक आवश्यकता के रूप में अधिक हो सकता है।
xdhmoore

8
@xdhmoore मुझे लगता है कि वह विशेष रूप से टैग के रूप में एक ही मूल्य पर भूमिका स्थापित करने की निरर्थक तकनीक का मतलब था, roleसामान्य रूप से उपयोग नहीं ।
विल्मा

159

जैसा कि मैं इसे समझता हूं, शुरुआत में एक्सएचटीएमएल द्वारा भूमिकाओं को परिभाषित किया गया था, लेकिन इसे हटा दिया गया था। हालाँकि, अब वे HTML 5 द्वारा परिभाषित किए गए हैं, यहाँ देखें: https://www.w3.org/WAI/PF/aria/roles#abstract_roles_header

भूमिका विशेषता का उद्देश्य एक वेब एप्लिकेशन के भाग के रूप में सॉफ्टवेयर को किसी तत्व (और उसके बच्चों) के सटीक कार्य की पहचान करना है। यह ज्यादातर स्क्रीन रीडर्स के लिए एक्सेसिबिलिटी चीज के रूप में है, लेकिन मैं इसे एम्बेडेड ब्राउजर और स्क्रीन स्क्रेपर्स के लिए उपयोगी होने के रूप में भी देख सकता हूं। असामान्य HTML क्लाइंट के लिए उपयोगी होने के लिए, विशेषता को मेरे द्वारा लिंक की गई भूमिकाओं में से किसी एक भूमिका में सेट करने की आवश्यकता है। यदि आप अपनी खुद की बनाते हैं, तो यह 'भविष्य' की कार्यक्षमता काम नहीं कर सकती है - एक टिप्पणी बेहतर होगी।

यहां प्रैक्टिकल: http://www.accessibleculture.org/articles/2011/04/html5-aria-2011/


20

क्या यह भूमिका आवश्यक है?

उत्तर: हाँ

  • एक्सएमएल-आधारित भाषाओं में भूमिकाओं को परिभाषित करने के लिए एक्सेसिबल रिच इंटरनेट एप्लिकेशन ( WAI-ARIA ) का समर्थन करने के लिए भूमिका विशेषता आवश्यक है , जब भाषाएं अपनी स्वयं की भूमिका विशेषता को परिभाषित नहीं करती हैं।
  • यद्यपि यह कारण है कि प्रोटोकॉल और प्रारूप कार्य समूह द्वारा भूमिका विशेषता प्रकाशित की जाती है , इस विशेषता के साथ-साथ सामान्य उपयोग के मामले भी अधिक हैं।

यह आपको प्रदान करता है:

  • सरल उपयोग
  • डिवाइस अनुकूलन
  • सर्वर-साइड प्रसंस्करण
  • जटिल डेटा विवरण, ... आदि।

3
क्या आप सुलभता, डिवाइस अनुकूलन और जटिल डेटा विवरण का विस्तृत अर्थ बता सकते हैं। मैं वेब प्रोग्रामिंग में नया हूं, इसलिए ये शब्द मेरे लिए थोड़े नए हैं। धन्यवाद!
मनीष जैन

11

मुझे लगता है कि यह एक पुराना सवाल है, लेकिन आपकी सटीक आवश्यकताओं के आधार पर एक और संभावित विचार यह है कि https://validator.w3.org/ पर मान्य करना निम्नानुसार चेतावनी देता है:

चेतावनी: तत्व भूमिका तत्व रूप के लिए अनावश्यक है।


1
शायद नीचे टिप्पणी करने की इच्छा? मैंने ओपी के सवाल का जवाब दिया "क्या यह भूमिका आवश्यक है?"
dotnetnutty

0

भूमिका विशेषता मुख्य रूप से स्क्रीन रीडर का उपयोग करने वाले लोगों के लिए पहुंच में सुधार करती है। कई मामलों के लिए हम इसे एक्सेसिबिलिटी, डिवाइस अनुकूलन, सर्वर-साइड प्रोसेसिंग और जटिल डेटा विवरण जैसे उपयोग करते हैं। अधिक क्लिक जानें: https://www.w3.org/WAI/PF/HTML/wiki/RoleAttribute


2
कृपया किसी भी संबद्धता का खुलासा करें और पोस्टिंग के माध्यम से अपनी साइट को बढ़ावा देने के तरीके के रूप में साइट का उपयोग न करें। देखिए मैं एक अच्छा उत्तर कैसे लिखूं?
यवेटे
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.