How does React handle accessibility (a11y)?

React supports HTML's native accessibility features but requires care since JSX introduces pitfalls. Semantic HTML: use the right element — button for actions, a for links, form with label/input pairs. React preserves semantic meaning. ARIA attributes: use camelCase in JSX: aria-label, aria-describedby, role. Focus management: use refs to programmatically manage focus — when a modal opens, move focus inside; when it closes, return focus to the trigger. inputRef.current.focus(). useId for IDs: generate accessible IDs for label-input pairs that are stable across SSR hydration. Live regions: use aria-live="polite" for dynamic content updates that should be announced. Keyboard navigation: ensure all interactive elements are focusable and operable via keyboard. Avoid click-only interactions. Color contrast: meet WCAG 2.1 AA standards (4.5:1 for text). Escape key: handle Escape to close modals/dropdowns. Testing: axe-core (via jest-axe or React Testing Library's axe integration), Lighthouse, screen readers (NVDA, JAWS, VoiceOver). Libraries: Radix UI primitives handle focus management, keyboard nav, and ARIA patterns for common components.