# स्क्रीन रीडर — वेब एक्सेसिबिलिटी (A11y)

Source: https://www.geekswithgeeks.com/hi/accessibility/a11y-screen-readers

> उन उपयोगकर्ताओं के लिए सामग्री को अनुकूलित करें जो सुनते हैं न कि देखते हैं।

## स्क्रीन रीडर कैसे काम करते हैं

लोकप्रिय: NVDA (Windows, मुफ्त), JAWS (Windows, वाणिज्यिक), VoiceOver (macOS/iOS), TalkBack (Android)। ये **accessibility tree** को पढ़ते हैं—पृष्ठ शब्दार्थ का एक अमूर्त प्रतिनिधित्व। उचित HTML, labels, alt text, और ARIA इस tree को सक्षम बनाते हैं।

## सामान्य स्क्रीन रीडर समस्याएं

लापता labels, अस्पष्ट link text ('Click here'), वर्णनात्मक छवियों के साथ alt, unlabeled form fields, कोई page title नहीं, कोई heading hierarchy नहीं, inaccessible carousels, infinite scroll।

## aria-label और aria-describedby का उपयोग

स्क्रीन रीडर उपयोगकर्ताओं के लिए दृश्य या छिपा हुआ context प्रदान करें।

```html
<!-- aria-label for icon-only button -->
<button aria-label="Close menu">✕</button>

<!-- aria-describedby for additional info -->
<input 
  id="password" 
  type="password" 
  aria-describedby="pwd-hint"
/>
<p id="pwd-hint">Min 8 chars with upper, lower, number</p>

<!-- aria-label for image -->
<img src="logo.svg" aria-label="Company logo" />
```

## Updates के लिए Live regions

Notifications के लिए aria-live="polite" का उपयोग करें, jरूरी alerts के लिए aria-live="assertive"। Live regions में जोड़ी गई सामग्री automatically announce होती है।

## NVDA के साथ परीक्षण

Forms mode (forms को Tab करें), Browse mode (arrow keys से navigate करें), और Focus mode (controls के साथ interact करें) का उपयोग करें। Real screen readers के साथ समय बिताएँ।