| Criterion | Level | Conformance | Remarks |
|---|---|---|---|
| 1.1.1 Non-text Content | A | Supports | All icons have aria-hidden="true". Formula images have aria-hidden="true"; MathML is the accessible alternative. Mic button has descriptive aria-label. |
| 1.3.1 Info and Relationships | A | Supports | Semantic HTML5 landmarks (header, main, aside, nav). Mode toggle uses role="group" with aria-label. Diff log uses role="status" and aria-live="polite". |
| 1.3.2 Meaningful Sequence | A | Supports | DOM order matches visual reading order. CSS grid layout does not alter logical tab sequence. |
| 1.3.3 Sensory Characteristics | A | Supports | No instructions rely solely on colour or position. Status indicated by text label and icon together. |
| 1.4.1 Use of Colour | A | Supports | Status states (ready/thinking/error) use both colour and a text label. Mode buttons labelled by text, not colour alone. |
| 2.1.1 Keyboard | A | Supports | All functionality operable via keyboard. Spacebar triggers mic. Tab navigates all interactive controls. Formula clickable area redirects focus to command input. |
| 2.1.2 No Keyboard Trap | A | Supports | No keyboard traps present. ASK mode picker dismissable via Escape equivalent. |
| 2.4.1 Bypass Blocks | A | Supports | Skip links provided: "Skip to formula" and "Skip to command input". |
| 2.4.2 Page Titled | A | Supports | Document title "MathVoice Studio v5" identifies purpose. |
| 2.4.3 Focus Order | A | Supports | Focus order follows logical sequence: mode bar → formula → mic → command input → sidebar. |
| 4.1.1 Parsing | A | Supports | HTML validates. No duplicate IDs. KaTeX-generated markup is well-formed. |
| 4.1.2 Name, Role, Value | A | Supports | All form controls have visible or programmatic labels. Mode buttons use aria-pressed. Mic button uses aria-pressed for toggle state. ASR provider uses role="radiogroup". |
| Criterion | Level | Conformance | Remarks |
|---|---|---|---|
| 1.4.3 Contrast (Minimum) | AA | Supports | All text/background combinations meet ≥4.5:1 ratio. Primary text (#0e1117 on #ffffff) = 19.1:1. Muted text (#596070 on #f7f8fa) = 5.1:1. Accent colour (#1a5fff on #ffffff) = 5.7:1. |
| 1.4.4 Resize Text | AA | Supports | Layout is responsive. Text scales to 200% without horizontal scroll or loss of content. KaTeX formulas scale proportionally. |
| 1.4.5 Images of Text | AA | Not Applicable | No images of text used. All text rendered as live text or SVG. |
| 1.4.10 Reflow | AA | Supports | Single-column layout at 320px CSS width. No two-dimensional scrolling required. |
| 1.4.11 Non-text Contrast | AA | Supports | Icon buttons have 3:1+ contrast on background. Focus indicators visible at 3:1+ against surrounding colour. |
| 1.4.12 Text Spacing | AA | Supports | Increased letter-spacing, word-spacing, and line-height via user stylesheet does not cause content loss. |
| 1.4.13 Content on Hover | AA | Not Applicable | No hover-only content. Tooltips are supplementary. |
| 2.4.6 Headings and Labels | AA | Supports | All sections have descriptive headings. Form inputs have visible labels or aria-label. |
| 2.4.7 Focus Visible | AA | Supports | :focus-visible style applied globally: 2px solid #1a5fff with 2px offset. Visible on all interactive elements. |
| 3.1.1 Language of Page | A | Supports | lang="en" set on all HTML documents. |
| 3.2.1 On Focus | A | Supports | No unexpected context changes on focus. |
| 3.2.2 On Input | A | Supports | No context changes on input without user initiation. Form submit requires explicit Run button click or Enter key. |
| 3.3.1 Error Identification | A | Supports | Parse errors announced in aria-live="polite" status region with descriptive text. |
| 3.3.2 Labels or Instructions | A | Supports | Command input has placeholder with example commands. All form controls have accessible names. |
| 4.1.3 Status Messages | AA | Supports | All mutation results, errors, and status changes announced via aria-live="polite" regions. Verified with NVDA on Windows 11. |
| Criterion | Level | Conformance | Remarks |
|---|---|---|---|
| 2.4.11 Focus Appearance (minimum) | AA | Supports | Focus indicator area ≥CSS pixels for perimeter. Offset ensures visibility against adjacent colours. |
| 2.5.3 Label in Name | A | Supports | Visible button labels match or are contained within accessible names. |
| 2.5.7 Dragging Movements | AA | Not Applicable | No drag operations required. |
| 2.5.8 Target Size (minimum) | AA | Supports | Interactive targets are ≥24×24 CSS pixels. Mic button is 38×38px. Primary buttons ≥44px tall. |
| 3.2.6 Consistent Help | A | Supports | Help contact ([email protected]) available in consistent location across pages. |
| 3.3.7 Redundant Entry | A | Not Applicable | No multi-step form flows that would require redundant entry. |
| 3.3.8 Accessible Authentication | AA | Not Applicable | Free tier requires no authentication. Pro tier authentication not included in this scope. |
| Criterion | Conformance | Remarks |
|---|---|---|
| E205.3 — Alternative formats | Supports | MathML output via /api/mathml provides accessible alternative to visual rendering. |
| E207.2 — WCAG 2.0 Level AA | Supports | All WCAG 2.0 AA criteria met as evidenced above. |
| E501.1 — Single point of access | Supports | All features accessible from the Studio web application without separate assistive products (beyond a screen reader). |
MathVoice has specific accessibility considerations related to its core function — rendering and editing mathematical formulas — that go beyond standard WCAG conformance:
<math> MathML element for screen readers. NVDA 2026.1 + MathCAT 0.7.5 supports interactive sub-expression navigation (arrow keys traverse the formula tree).MathVoice Studio supports embedding via LTI 1.3 (Learning Tools Interoperability) in Learning Management Systems including Canvas (Instructure), Moodle, Schoology, and Blackboard. The embedded Studio interface meets all applicable WCAG 2.1 AA criteria listed above when rendered inside an LMS iframe.
| Feature | Conformance | Remarks |
|---|---|---|
| LTI 1.3 OIDC Launch | Supports | OIDC discovery and JWKS endpoints provided at /.well-known/openid-configuration and /api/jwks. |
| iframe embedding (Canvas, Moodle) | Supports | CSP frame-ancestors allows known LMS domains. Keyboard and screen reader access preserved in embedded context. |
| postMessage API | Supports | Host page can control Studio (SET_LATEX, GET_LATEX, SET_MODE, RUN_COMMAND) via postMessage with origin validation. |