# ARIA से छिपा एलिमेंट फ़ोकस होने लायक नहीं होना चाहिए, और न ही उसमें फ़ोकस होने लायक एलिमेंट होने चाहिए

<https://www.fixreports.com/hi/issues/aria-hidden-focus>

WCAG 4.1.2 Name, Role, Value · लेवल A

फ़ोकस हो सकने वाले एलिमेंट स्क्रीन रीडर से छिपे हैं, लेकिन कीबोर्ड से अब भी उन तक पहुंचा जा सकता है।

## यह नियम क्या जाँचता है
सुनिश्चित करता है कि aria-hidden एलिमेंट फ़ोकस होने लायक न हों और उनमें फ़ोकस होने लायक एलिमेंट न हों.

## यह क्यों ज़रूरी है
कीबोर्ड इस्तेमाल करने वाले ऐसे एलिमेंट पर पहुंचते हैं जिन्हें स्क्रीन रीडर नहीं पढ़ते (WCAG 4.1.2)।

## इसे कैसे ठीक करें
### किसी भी वेबसाइट पर
1. जिन कंटेनर में फ़ोकस हो सकने वाले एलिमेंट हैं, उनसे aria-hidden हटाएं, या छिपे हुए ऑफ़-कैनवस मेन्यू और स्लाइड में tabindex="-1" और inert एट्रिब्यूट जोड़ें।

### Shopify पर
1. जिन कंटेनर में फ़ोकस हो सकने वाले एलिमेंट हैं, उनसे aria-hidden हटाएं, या छिपे हुए ऑफ़-कैनवस मेन्यू और स्लाइड में tabindex="-1" और inert एट्रिब्यूट जोड़ें।

### WooCommerce और WordPress पर
1. जिन कंटेनर में फ़ोकस हो सकने वाले एलिमेंट हैं, उनसे aria-hidden हटाएं, या छिपे हुए ऑफ़-कैनवस मेन्यू और स्लाइड में tabindex="-1" और inert एट्रिब्यूट जोड़ें।

## सुधार की जांच कैसे करें
- स्क्रीन रीडर चालू रखकर पूरे पेज पर Tab करते हुए आगे बढ़ें।

## स्रोत
- axe-core नियम का डॉक्यूमेंटेशन (Deque): https://dequeuniversity.com/rules/axe/4.13/aria-hidden-focus
- WCAG 4.1.2 की व्याख्या (W3C): https://www.w3.org/WAI/WCAG22/Understanding/name-role-value