Web Accessibility Patterns
Semantic HTML Foundation
Use correct elements:
```tsx // ✅ GOOD Submit
// ❌ BAD
ARIA Attributes
Icon-Only Buttons
```tsx ```
Form Fields
```tsx
Loading States
```tsx
Keyboard Navigation
Ensure keyboard accessibility:
```tsx // Custom interactive element
Focus Management
```tsx Accessible focus state ```
Anti-Patterns
❌ `` instead of `` ❌ Icon without `aria-label` ❌ Redundant `aria-label` on elements with text ❌ Missing keyboard support for custom interactive elements
✅ Semantic HTML ✅ ARIA for icons and dynamic content ✅ Keyboard navigation ✅ Focus visible styles
Token Estimate: ~2,000 tokens