# Cheat sheet और Interview Q&A — वेब एक्सेसिबिलिटी (A11y)

Source: https://www.skillbyai.com/hi/accessibility/a11y-cheat-sheet

> Pre-launch checklist, interview प्रश्न-उत्तर और भरोसेमंद learning resources के साथ accessibility दोहराएँ।

## त्वरित चेकलिस्ट

Quick reference के लिए pre-launch accessibility checklist।

```markdown
# Accessibility Pre-Launch Checklist

- [ ] Page has unique, descriptive `<title>`
- [ ] One `<h1>` per page, logical heading hierarchy
- [ ] All images have `alt` text (empty if decorative)
- [ ] All form fields have associated `<label>`
- [ ] Buttons and links have descriptive text
- [ ] Color contrast: text ≥ 4.5:1 (AA)
- [ ] Keyboard navigation works (Tab, Enter, Escape)
- [ ] Focus indicator is visible
- [ ] No keyboard traps
- [ ] Skip link to main content
- [ ] Video has captions and transcript
- [ ] No auto-playing sound
- [ ] ARIA used sparingly and correctly
- [ ] aria-live for dynamic updates
- [ ] Tested with NVDA/VoiceOver
- [ ] Axe DevTools: 0 critical issues
```

## Interview Q&A

**Q: A11y क्या है?** Numeronym for Accessibility। **Q: WCAG levels?** A (बुनियादी), AA (न्यूनतम कानूनी), AAA (इष्टतम)। **Q: Most common issue?** Missing alt text और form labels। **Q: ARIA first rule?** Semantic HTML पहले use करें। **Q: Test SR?** NVDA (मुफ्त), VoiceOver (Mac), JAWS (paid)। **Q: Skip links purpose?** Nav को छोड़कर main content पर jump करें। **Q: Updates announce करें?** aria-live="polite" या aria-live="assertive"। **Q: Keyboard essentials?** Tab/Enter/Escape/Arrow काम करें, focus visible, कोई traps नहीं। **Q: Color पर्याप्त नहीं?** Text/icons के साथ pair करें। **Q: बिना माउस?** केवल Tab/Enter/Arrow/Escape।

## संसाधन

**MDN Web Docs**: accessibility guide। **WCAG 2.1**: आधिकारिक guidelines। **WebAIM**: आलेख + tools। **The A11Y Project**: समुदाय। **axe DevTools**: browser extension। **NVDA**: मुफ्त screen reader।

## अंतिम क्विज़ 1/8

अंतिम क्विज़

**Quiz:** कौन-सा WCAG level सामान्य कानूनी आधार है?

- [ ] A
- [x] AA
- [ ] AAA
- [ ] Level 3

*Answer:* AA. अधिकांश कानून और नीतियाँ AA स्तर माँगती हैं।

## अंतिम क्विज़ 2/8

अंतिम क्विज़

**Quiz:** AA पर सामान्य टेक्स्ट के लिए न्यूनतम contrast ratio क्या है?

- [ ] 2:1
- [ ] 3:1
- [x] 4.5:1
- [ ] 7:1

*Answer:* 4.5:1. सामान्य टेक्स्ट को 4.5:1 चाहिए; बड़े टेक्स्ट को 3:1।

## अंतिम क्विज़ 3/8

अंतिम क्विज़

**Quiz:** ARIA का पहला नियम कौन-सा है?

- [ ] Add role to every element
- [x] Use native semantic HTML when possible
- [ ] Always use aria-hidden
- [ ] Use tabindex above 0

*Answer:* Use native semantic HTML when possible. Native elements में roles, states और keyboard support पहले से होता है।

## अंतिम क्विज़ 4/8

अंतिम क्विज़

**Quiz:** Informative image का alt text क्या करे?

- [ ] Repeat the file name
- [ ] Start with "Image of"
- [x] Describe the image's purpose briefly
- [ ] Be left empty

*Answer:* Describe the image's purpose briefly. Alt text उद्देश्य बताता है; decorative images में alt="" होता है।

## अंतिम क्विज़ 5/8

अंतिम क्विज़

**Quiz:** Visible label को input से कैसे जोड़ें?

- [ ] Use a placeholder only
- [x] Use <label for> matching the input id
- [ ] Use a title attribute
- [ ] Use a bold <span>

*Answer:* Use <label for> matching the input id. for/id से बंधा label announce होता है और click target बड़ा करता है।

## अंतिम क्विज़ 6/8

अंतिम क्विज़

**Quiz:** कौन-सा attribute dynamic updates को politely announce करता है?

- [x] aria-live="polite"
- [ ] aria-hidden="true"
- [ ] role="presentation"
- [ ] tabindex="-1"

*Answer:* aria-live="polite". Live regions focus हटाए बिना content बदलाव announce करते हैं।

## अंतिम क्विज़ 7/8

अंतिम क्विज़

**Quiz:** Skip link का उद्देश्य क्या है?

- [ ] Hide navigation permanently
- [x] Let keyboard users jump past repeated content
- [ ] Speed up page load
- [ ] Replace headings

*Answer:* Let keyboard users jump past repeated content. यह keyboard users को पूरा navigation tab करने से बचाता है।

## अंतिम क्विज़ 8/8

अंतिम क्विज़

**Quiz:** Automated tests को manual testing के साथ क्यों जोड़ें?

- [x] Automation finds only part of the issues
- [ ] Manual tests are faster
- [ ] Automation is deprecated
- [ ] Screen readers replace tests

*Answer:* Automation finds only part of the issues. Tools लगभग एक तिहाई issues पकड़ते हैं; बाकी keyboard और screen reader checks से मिलते हैं।