दो इनपुट के लिए एकल लेबल

Question

मैं वर्तमान में किसी फॉर्म में कुछ दिनांक इनपुट जोड़ रहा हूं। मेरे पास 'स्टार्ट डेट' और 'एंड डेट' इनपुट है लेकिन दोनों इनपुट के लिए केवल एक लेबल ('तिथियां') का उपयोग करना चाहते हैं।

क्या ऐसा करना संभव है? अभिगम्यता चिंताओं क्या हैं?

मेरी वर्तमान सोच एक लेबल 'तिथियां' है जो दिखाया गया है कि स्क्रीन पाठकों के लिए प्रत्येक इनपुट के लिए दो छिपे हुए लेबल हैं। क्या यह जाने का तरीका है? क्या इस तरह की चीज करने वाली बड़ी वेबसाइटों के कोई उदाहरण हैं (यदि संभव हो तो सरकारी वेबसाइटें)?

यह एक ऐसी परियोजना है जो सरकारी एजेंसी द्वारा उपयोगकर्ता हो सकती है, इसलिए अभिगम्यता का अनुपालन करने पर सख्त नियम हैं।

Answer 1

इस मामले में कुछ के माध्यम से सीएसएस का उपयोग कर पृष्ठ से सेट किया जा सकता

एचटीएमएल

: एक fieldset में आदानों रैप करने के लिए, "तिथियां" के लिए एक legend का उपयोग दोनों inputs के लिए labels का उपयोग करें और छिपाने के लेबल होगा

सीएसएस

fieldset { 
    border: none; 
} 
label { 
    margin-left: -999em; 
} 
input { 
    display: block; 
} 

Fiddle here

यह भी देखें: WCAG 2, H71: Providing a description for groups of form controls using fieldset and legend elements

Answer 2

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

<label for="x">x name</label><input name="x"/> 
<label for="y">y name</label><input name="y"/> 

Answer 3

मुझे लगता है कि प्रत्येक इनपुट के साथ एक लेबल शामिल करना आपकी सबसे अच्छी शर्त होगी। मुझे लगता है कि सबसे अच्छा मार्कअप तब लेबल कि आप वास्तव में पृष्ठ पर प्रदर्शित नहीं करना चाहते हैं के लिए बस

.hide { 
    position: absolute; 
    left: -9999em; 
} 

... या इसी तरह