Frontend Accessibility

Screen reader accessibility requires semantic HTML elements, ARIA attributes for roles and labels, and proper heading hierarchies. Use native `<nav>`, `<button>`, and `<form>` elements, add `aria-label` and `aria-describedby` where semantic meaning isn't implicit, and test with screen reader software to ensure all content is announced correctly.

Keyboard navigation requires managing focus states and ensuring all interactive elements are reachable via Tab. Implement visible focus indicators, use semantic HTML elements that are natively keyboard-accessible, manage focus programmatically in modals and menus, and test with keyboard-only navigation to verify all interactions work without a mouse.

WCAG contrast compliance requires maintaining sufficient color ratios between text and background: 4.5:1 for normal text and 3:1 for large text. Use contrast-checking tools to validate your color pairs, test with common colorblindness simulations, and ensure interactive elements remain distinguishable beyond color alone.

Forms are accessible across frameworks (.jsx, .vue, .svelte) by applying universal patterns: associate labels with inputs using `<label>` or `aria-label`, add `aria-invalid` and `aria-describedby` for validation messaging, ensure keyboard tab order is logical, and validate color contrast for error states and focus indicators.

Alt text for images must be descriptive, concise, and convey the image's purpose or content. Avoid redundant phrases like 'image of'; instead describe what the image shows or its function. For decorative images, use empty alt text (`alt=""`). For complex diagrams or media, provide longer descriptions via `aria-describedby` or linked text alternatives.

Accessible modals require managing focus to the modal on open, preventing interaction with background content, implementing keyboard escape to close, and restoring focus when closed. Use ARIA `role="dialog"` and `aria-modal="true"`, test with keyboard and screen readers, and verify focus trapping and restoration work correctly.