frontend: Barrierefreiheit — aria-Labels, Fokusreihenfolge, Live-Region
TASKS Phase 2. Jeder Diagramm-Knoten bekommt in render.js (nodeAria) einen sprechenden, lokalisierten aria-label: Label + Status + Aufwand (inkl. „(angenommen)" beim impliziten M) + Zuständige + Link. Die rein visuellen Badges (Größe, Tags, ↗) sind aria-hidden, damit der Screenreader nicht „M", „anna", „↗" kryptisch doppelt vorliest. Neue a11y*-i18n-Keys in allen 9 Sprachen. Alle Knoten sind fokussierbar (tabindex=0 bzw. der Link) in Dokument-/Lese- reihenfolge; sichtbarer :focus-visible-Rahmen (Petrol). #warn ist eine Live-Region (role=status, aria-live=polite) — neue Warnungen werden angesagt. Verifiziert: aria-label folgt dem Sprachwechsel (DE/EN), Badges aria-hidden, keine visuelle Regression, keine Konsolenfehler. Renderer-Snapshots aktualisiert (29 Tests grün). SPEC §9 (Barrierefreiheit) + CLAUDE ergänzt. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Opus 4.8
parent
32a02021ed
commit
15699c321c
+6
-1
@@ -31,7 +31,12 @@ Abhaken beim Erledigen; neue Aufgaben unten anfügen.
|
||||
Phase 2 (`unknownStatus`). `tests/warnings.test.js`.
|
||||
|
||||
## Phase 2 — Qualität
|
||||
- [ ] Barrierefreiheit: Fokusreihenfolge, aria-Labels für Status/Größe/Tags.
|
||||
- [x] Barrierefreiheit: Fokusreihenfolge, aria-Labels für Status/Größe/Tags.
|
||||
→ je Knoten ein sprechender `aria-label` (Label+Status+Aufwand+Zuständige+
|
||||
Link, lokalisiert, neue `a11y*`-Keys in allen 9 Sprachen); visuelle Badges
|
||||
`aria-hidden`; Knoten `tabindex="0"` (Fokus = Lesereihenfolge) mit
|
||||
`:focus-visible`-Rahmen; `#warn` als Live-Region (`role=status`,
|
||||
`aria-live=polite`). Snapshots aktualisiert.
|
||||
- [ ] Druck-Stylesheet (Diagramm ohne Editor-Panel).
|
||||
- [ ] Fehlertolerantes Parsen weiter ausbauen (unbekannte Statuszeichen melden).
|
||||
|
||||
|
||||
Reference in New Issue
Block a user