Task 026: Accessibility Improvements for Interactive Elements

Status: DONE

Motivation

The published GitHub Pages reports contain interactive elements (SVG orbital diagrams, brachistochrone calculator, orbital animation controls) that lack proper ARIA attributes. This makes them inaccessible to screen reader users and keyboard-only navigation.

Scope

1. SVG orbital diagrams (templates.ts): Add role="img", aria-label, <title> and <desc> elements
2. Calculator form controls (templates.ts): Add aria-label to range sliders, aria-live="polite" to results, aria-describedby for context
3. Animation controls (orbital-animation.js): Add aria-label to play/pause, aria-valuenow/min/max to time slider

Progress

• [x] Read existing template and animation code
• [x] Add ARIA attributes to SVG diagrams (role="img", aria-label)
• [x] Add ARIA attributes to calculator controls (aria-label, aria-describedby, aria-live)
• [x] Add ARIA attributes to animation controls (aria-label, aria-valuenow/min/max, aria-live, role="group")
• [x] Add tests for new accessibility attributes (11 new tests)
• [x] All tests pass (52 Rust + 480 TS = 532 total, 0 failures)
• [x] Commit and push

Depends on

• Task 014 (orbital diagrams) — DONE
• Task 019 (orbital animation) — DONE
• Task 007 (calculator) — DONE