specialized

# Specialized Skill

Domain-specific patterns for accessibility, support, design, knowledge management, planning, and risk.

## Quick Reference

| Area | Key Patterns | When to Use |
|------|--------------|-------------|
| **Accessibility** | WCAG, ARIA, screen readers | Inclusive design |
| **Customer Support** | Tickets, FAQs, troubleshooting | Support content |
| **UI/UX Design** | Wireframes, design systems | User experience |
| **Knowledge Graphs** | Obsidian links, connections | Knowledge management |
| **Task Decomposition** | Goal breakdown, workflows | Complex planning |
| **Risk Assessment** | Edge cases, failure modes | Risk analysis |

---

## Accessibility

### WCAG Compliance Levels

| Level | Requirement | Examples |
|-------|-------------|----------|
| **A** | Minimum | Alt text, keyboard access |
| **AA** | Standard | Color contrast 4.5:1, focus visible |
| **AAA** | Enhanced | Contrast 7:1, sign language |

### Quick Checks

```markdown
## Accessibility Checklist

### Perceivable
- [ ] Images have alt text
- [ ] Videos have captions
- [ ] Color contrast meets 4.5:1 (AA)
- [ ] Text resizable to 200%

### Operable
- [ ] All functionality via keyboard
- [ ] Focus visible and logical
- [ ] No keyboard traps
- [ ] Skip links available

### Understandable
- [ ] Language declared
- [ ] Error messages helpful
- [ ] Consistent navigation
- [ ] Labels on form fields

### Robust
- [ ] Valid HTML
- [ ] ARIA used correctly
- [ ] Works with assistive tech
```

### ARIA Patterns

```html
<!-- Button -->
<button aria-label="Close dialog" aria-pressed="false">×</button>

<!-- Navigation -->
<nav aria-label="Main navigation">
  <ul role="menubar">
    <li role="menuitem"><a href="/">Home</a></li>
  </ul>
</nav>

<!-- Live region -->
<div aria-live="polite" aria-atomic="true">
  Status message will be announced
</div>

<!-- Modal -->
<div role="dialog" aria-modal="true" aria-labelledby="modal-title">
  <h2 id="modal-title">Dialog Title</h2>
</div>
```

### Testing To