Files
Portfolio/docs/accessibility/wcag-2.2-aa-checklist.md

129 lines
21 KiB
Markdown
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# WCAG 2.2 A/AA release checklist
This is a release checkpoint for the portfolio, not a claim that automated
testing can certify accessibility. Automated checks and the current-Chromium
compiled-preview visual review are complete for the current build. The named
physical screen-reader and non-Chromium platform runs remain **pending release
evidence**, not code failures.
## Evidence status
| Evidence | Current result | Re-run trigger |
| ---------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------------- |
| Axe WCAG A/AA scan | **PASS** — default, audio running, Static, reduced motion, scene/media failure, and missing optional social links; desktop and mobile Chromium | Any rendered markup, color token, control, or state change |
| Author target geometry | **PASS** — every enabled `a`, `button`, `input`, `select`, and `textarea` is at least 44×44 CSS px; only a paragraph-contained link with `data-target-size-exception="inline-link"` may be exempt | Any new or restyled interactive element |
| Keyboard and focus geometry | **PASS** — logical navigation reaches Contact; focus is visible, in the visual viewport, and has zero intersection with unrelated fixed controls | Navigation, focus, HUD, or control-surface changes |
| Reflow | **PASS** — 320 CSS px mobile and desktop-Chromium effective 320 CSS px at the 400% zoom boundary | Layout, typography, media, or control changes |
| WCAG text spacing | **PASS** — 1.5 line height, 0.12em letter spacing, 0.16em word spacing, and 2em paragraph spacing preserve content and controls | Copy or layout changes |
| Forced colors | **PASS** — focus, borders, controls, content, and Contact remain visible and usable | Color, border, focus, or control changes |
| No-JavaScript and SSR | **PASS in the project browser/build gates** — semantic sections, native links, and Contact do not depend on hydration | Rendering or hydration changes |
| NVDA + Firefox on Windows | **PENDING PHYSICAL RUN** — use `screen-reader-scripts.md`; record versions and results below | Before public release and after material semantic changes |
| VoiceOver + Safari on macOS | **PENDING PHYSICAL RUN** — use `screen-reader-scripts.md`; record versions and results below | Before public release and after material semantic changes |
| VoiceOver + Safari on iOS | **PENDING PHYSICAL RUN** — use `screen-reader-scripts.md`; record versions and results below | Before public release and after material semantic/touch changes |
| Final visual focus/overflow review | **PASS in current Chromium (2026-09-05)** — desktop, 320 CSS px, zoom-equivalent, Static, reduced-motion, keyboard, no-JavaScript, and print-relevant views inspected | Before public release on the named physical platforms |
| Final encoded-media flash/caption review | **PASS for current still-image surface** — approved screenshots/charts have authored captions and descriptions; no video is published | When any video or replacement derivative is added |
Focused command:
```bash
npm run test:browser -- tests/browser/accessibility-axe.spec.ts tests/browser/accessibility-keyboard.spec.ts tests/browser/accessibility-reflow.spec.ts tests/browser/accessibility-forced-colors.spec.ts
```
The focused run on 2026-09-02 produced 24 passes and two intentional
project-profile skips: the 320 CSS px mobile case runs only in the mobile
profile, and the desktop 400% zoom-equivalent case runs only in the desktop
profile. No axe violation is suppressed. No false-positive exception is
currently recorded.
The 2026-09-05 final content/media acceptance matrix ran the semantic,
keyboard, no-JavaScript, reduced-motion, forced-colors, reflow, responsive,
media-policy/failure, and visual-regression files in desktop and mobile
Chromium. It passed 94 checks with 26 intentional project/capability skips and
no failures. The no-JavaScript oracle includes visible captions, chart
descriptions, and exact-value table text. A clean-context reduced-motion
capture showed the same complete identity hierarchy as Static/default.
## Criterion checklist
Status meanings:
- **Automated PASS**: the current preview has repeatable browser/build evidence.
- **Manual pending**: a physical assistive-technology or visual run is required
before release.
- **N/A current surface**: the current public output does not expose the
relevant feature. Adding that feature reopens the criterion.
| WCAG 2.2 criterion | Status | Current evidence / release action |
| ----------------------------------------------- | ----------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| 1.1.1 Non-text Content | Automated + current visual PASS; platform pending | Decorative world/canvas/poster are hidden or empty-alt; one concise scene description is semantic. Approved screenshots/charts have authored captions and descriptions. |
| 1.2.1 Audio-only and Video-only (Prerecorded) | N/A current surface | Generated ambience is interactive, not prerecorded speech. Reopen for approved prerecorded media. |
| 1.2.2 Captions (Prerecorded) | N/A current surface | No public video. Reopen and verify captions when a video derivative is approved. |
| 1.2.3 Audio Description or Media Alternative | N/A current surface | No public video; the component supports an adjacent structured description if one is later approved. |
| 1.2.4 Captions (Live) | N/A current surface | No live media. |
| 1.2.5 Audio Description (Prerecorded) | N/A current surface | Reopen for approved prerecorded video. |
| 1.3.1 Info and Relationships | Automated PASS; manual pending | Native landmarks, headings, lists, figures, captions, definition lists, and tables; confirm screen-reader output. |
| 1.3.2 Meaningful Sequence | Automated PASS; manual pending | SSR DOM order remains the reading order; decorative world is excluded. |
| 1.3.3 Sensory Characteristics | Automated PASS | Instructions and state do not depend only on location, shape, or color. |
| 1.3.4 Orientation | Automated PASS | Responsive checks do not lock orientation. |
| 1.3.5 Identify Input Purpose | N/A current surface | No personal-data form inputs. |
| 1.4.1 Use of Color | Automated + current visual PASS; platform pending | State controls use visible text and native state, not color alone. |
| 1.4.2 Audio Control | Automated PASS; manual pending | Sound starts only after explicit activation and immediately exposes Mute and Sound volume. |
| 1.4.3 Contrast (Minimum) | Automated + current visual PASS; platform pending | Axe reports no contrast violation in all named states; current-Chromium review found the information layer readable over the scene. |
| 1.4.4 Resize Text | Automated PASS | Desktop Chromium effective 320 CSS px gate represents the 400% zoom boundary. |
| 1.4.5 Images of Text | Automated PASS | Information is text/semantic HTML; project screenshots do not replace portfolio copy. |
| 1.4.10 Reflow | Automated PASS | No horizontal loss at 320 CSS px mobile or desktop zoom-equivalent width. |
| 1.4.11 Non-text Contrast | Automated + current visual PASS; platform pending | Control/focus/border visibility survives forced colors and the current-Chromium visual review. |
| 1.4.12 Text Spacing | Automated PASS | WCAG spacing override preserves all checked content and Contact. |
| 1.4.13 Content on Hover or Focus | N/A current surface | No hover/focus-triggered disclosure or tooltip. |
| 2.1.1 Keyboard | Automated PASS; manual pending | Native links/buttons/select/range and section navigation are operable by keyboard. |
| 2.1.2 No Keyboard Trap | Automated PASS; manual pending | Tab traversal reaches Contact and continues to the drive controls. |
| 2.1.4 Character Key Shortcuts | N/A current surface | No single-character shortcuts. |
| 2.2.1 Timing Adjustable | N/A current surface | No session or content timeout. |
| 2.2.2 Pause, Stop, Hide | Automated PASS; manual pending | Pause/Resume/Static controls stop decorative motion; authored video controls are required when media ships. |
| 2.3.1 Three Flashes or Below Threshold | Automated + current visual PASS; platform pending | The live-scene flash sequence and reviewed states pass; only still project media ships. |
| 2.4.1 Bypass Blocks | Automated PASS; manual pending | First focusable control is the visible Skip to portfolio content link. |
| 2.4.2 Page Titled | Automated PASS | Generated document title names Luca and the hybrid role. |
| 2.4.3 Focus Order | Automated PASS; manual pending | Skip, ordered section navigation, content actions, Contact, then drive controls. |
| 2.4.4 Link Purpose (In Context) | Automated PASS; manual pending | Visible labels identify section, email, and profile destinations. |
| 2.4.5 Multiple Ways | Automated PASS | Persistent section navigation and native document scrolling provide two ways to reach content. |
| 2.4.6 Headings and Labels | Automated PASS; manual pending | Ordered headings and explicit control labels; confirm announcements. |
| 2.4.7 Focus Visible | Automated + current visual PASS; platform pending | At least 2px visible indicator or an inset main-content indicator; keyboard and forced-colors review passes. |
| 2.4.11 Focus Not Obscured (Minimum) | Automated + current visual PASS; platform pending | Focus bounds have zero intersection with unrelated fixed HUD/controls; short viewports move controls into document flow. |
| 2.5.1 Pointer Gestures | N/A current surface | No multipoint or path-based gesture. |
| 2.5.2 Pointer Cancellation | Automated PASS | Native click activation occurs on release; no custom down-only action. |
| 2.5.3 Label in Name | Automated PASS | Visible button/link labels are their accessible names. |
| 2.5.4 Motion Actuation | N/A current surface | No device-motion input. |
| 2.5.7 Dragging Movements | N/A current surface | No drag-only operation. |
| 2.5.8 Target Size (Minimum) | Automated PASS | 44×44 CSS px author-target gate on desktop and mobile; exception syntax/context is validated. |
| 3.1.1 Language of Page | Automated PASS | Generated root document declares English. |
| 3.1.2 Language of Parts | N/A current surface | No passage in another natural language. |
| 3.2.1 On Focus | Automated PASS | Focus alone does not navigate or change context. |
| 3.2.2 On Input | Automated PASS | Quality/volume changes are explicit and do not unexpectedly navigate. |
| 3.2.3 Consistent Navigation | Automated PASS | One canonical ordered section navigation is retained across states. |
| 3.2.4 Consistent Identification | Automated PASS | Motion/audio controls retain consistent names and semantics. |
| 3.2.6 Consistent Help | N/A current surface | No repeated help mechanism. |
| 3.3.1 Error Identification | Automated PASS for current controls | Audio/media failures expose concise text status without blocking content. |
| 3.3.2 Labels or Instructions | Automated PASS; manual pending | Quality and Sound volume are labeled; Start the Drive has adjacent purpose text. |
| 3.3.3 Error Suggestion | N/A current surface | No correctable data-entry error. |
| 3.3.4 Error Prevention (Legal, Financial, Data) | N/A current surface | No transaction or user-data submission. |
| 3.3.7 Redundant Entry | N/A current surface | No multi-step data entry. |
| 3.3.8 Accessible Authentication (Minimum) | N/A current surface | No authentication. |
| 4.1.2 Name, Role, Value | Automated PASS; manual pending | Native controls plus current `aria-current`, status roles, and range/select values; confirm platform output. |
| 4.1.3 Status Messages | Automated PASS; manual pending | Motion/audio/video status text is exposed without forced focus; verify it is useful and not repetitive. |
## Physical evidence log
Do not change a row to PASS without running the literal script in
`screen-reader-scripts.md` on the named platform.
| Date | Platform | Browser + version | Screen reader + version | Build/commit | States covered | Result | Notes/evidence |
| ------- | -------- | ------------------------ | ---------------------------------- | ------------- | ---------------------------------------- | ----------- | ----------------------------------------- |
| Pending | Windows | Firefox — record version | NVDA — record version | record commit | all six | **PENDING** | Physical run required |
| Pending | macOS | Safari — record version | VoiceOver + macOS — record version | record commit | all six | **PENDING** | Physical run required |
| Pending | iOS | Safari — record version | VoiceOver + iOS — record version | record commit | default, reduced, Static, audio, failure | **PENDING** | Physical touch/screen-reader run required |
Any failed manual oracle is a release blocker until fixed or, when genuinely
not applicable, documented with concrete evidence. Pending platform evidence
does not imply that the implementation test suite is failing; it means the
release checkpoint is not yet signed off.