# ✅ Vérification humaine — `dev-verif-5` (Accessibilité)

**Branche :** `dev-verif-5` (empilée sur `dev-verif-4`)
**Lot :** Accessibilité — focus, reduced-motion, skip-link, contraste breadcrumb
**Date :** 2026-06-01

## Items d'audit traités

| Item (spec) | Avant | Après | État |
|---|---|---|---|
| accessibility / **reduced-motion** | ❌ aucun garde | ✅ `@media (prefers-reduced-motion)` global | **fixé** |
| accessibility / **focus-indicators** | ⚠️ pas de `:focus-visible` global | ✅ outline global orange-700 | **fixé** |
| accessibility / **skip-links** | ❌ absent | ✅ skip-link → `#main-content` | **fixé** |
| accessibility / **color-contrast** (breadcrumb) | ❌ gris trop clair | ⚠️ composant breadcrumb passé en `text-gray-600` | partiel |

## Changements (fichiers)

- `app/globals.css` — `:focus-visible { outline: 2px solid #c2410c }` + bloc `@media (prefers-reduced-motion: reduce)` (coupe animations/transitions).
- `app/layout.tsx` — skip-link (premier focusable, `sr-only` → visible au focus) + wrapper `<div id="main-content" tabIndex={-1}>` autour de `{children}` (cible du skip-link, sans créer un 2e landmark `main`).
- `components/ui/breadcrumb.tsx` — `text-muted-foreground` → `text-gray-600` (contraste ≈ 7:1 sur blanc).

## Preuves (build prod local :3001)

```
home : href="#main-content" + "Aller au contenu principal"  ✓
home : <div id="main-content">                              ✓
CSS bundle : prefers-reduced-motion + :focus-visible        ✓
pnpm build : exit 0
```

## ⚠️ Non couvert dans ce lot (à traiter / décider)

- [ ] **Contraste texte orange** (`#f54900` ≈ 3.59:1) : c'est une **décision design** (assombrir l'orange de marque utilisé en texte → orange-700/800). Non fait à l'aveugle. Le `.prose` utilise déjà orange-800 ; à étendre aux composants UI.
- [ ] **Vidéo hero autoplay** sous reduced-motion : le CSS coupe animations/transitions mais **pas** l'autoplay `<video>` (attribut). Ajouter une garde JS (`prefers-reduced-motion` → pas d'autoplay) côté composant hero.
- [ ] **Breadcrumb** : le composant `ui/breadcrumb` ne semble monté nulle part (aucun `aria-label="breadcrumb"` rendu) — le fil d'Ariane visible est globalement **absent** (cf. audit P1 seo/breadcrumbs). Mon edit durcit le composant s'il est utilisé.
- [ ] **Heading `/contact`** (h1→h3) et **form-errors** (`aria-invalid`, `role="alert"` sur le toast) : `aria-describedby` est déjà partiellement présent ; amélioration fine à part.
- [ ] **data-tables** (caption/scope) : concerne les tables MDX (`components/mdx`).

> Plusieurs items a11y (contraste réel, visibilité du focus, lecteur d'écran) **nécessitent une vérif navigateur** que l'audit headless ne fait pas — d'où le gate ci-dessous.

## Décision

- [ ] Tester au clavier (Tab) : skip-link visible au 1er Tab, focus visible partout.
- [ ] Tester `prefers-reduced-motion: reduce` (réglage OS) : animations coupées.
- [ ] **Lot validé** → mergeable.
- [ ] Corrections demandées :

> _Notes du vérificateur :_