Accessibility Conformance Report
International Edition (VPAT® Version 2.5 — WCAG)
Name of Product/Version: TheAccessibleOrgChart (web application), release 2026-07 (Phase 2 accessibility hardening — commits e2181f6c, 6734e904, e5b965cc)
Product Description: A web application (orgchart.theaccessible.org) that generates WCAG-conformant, self-contained HTML organizational charts from image/PDF uploads (AI vision extraction), CSV import, a developer REST API, or a manual editor. Output templates include indented accessible lists (civic), collapsible trees, cards, and an interactive radial view. Charts can be shared via public/password/expiring links, embedded, or CDN-hosted.
Report Date: July 12, 2026
Product Contact: [email protected]
Notes: This report covers (a) the product’s own application UI (upload, review, editor, preview, share, marketing, and account surfaces) and (b) the generated org chart output that the product hosts on its own domain (share and hosted-chart pages). It does not warrant the accessibility of customer-supplied content embedded in a chart — e.g. photographs uploaded without meaningful alternative text, or color choices a customer selects in a custom palette. Responsibility for such content rests with the customer; the product provides accessible defaults, built-in themes whose solid text/indicator colors are contrast-verified, and editing tools to supply alternatives.
Evaluation Methods Used:
- Internal engineering accessibility review of the application source and generated output.
- Automated testing with axe-core run in continuous integration (
test:a11y) and, for generated output, axe-core executed against rendered HTML in a headless browser as part of the per-chart WCAG validation pipeline, alongside a purpose-built static validator (15 rules). - Programmatic contrast testing of all six built-in radial themes’ solid text and accent-indicator colors (WCAG relative-luminance math) in the automated test suite; translucent/gradient decorative colors (e.g. connector strokes) are excluded and rely on design review.
- Manual keyboard-only testing of interactive surfaces (radial chart, accessible tree, editor, share dialogs, focus traps).
- This is not a third-party audit. No independent accessibility vendor has certified this product. A third-party audit and formal assistive-technology (screen reader) test pass are on the roadmap (see Legend and remarks below); until then, criteria whose conformance depends on real screen-reader behavior are reported conservatively as Partially Supports.
Applicable Standards/Guidelines: Web Content Accessibility Guidelines (WCAG) 2.1 — Level A and Level AA. WCAG 2.1 AA is the standard referenced by the U.S. DOJ ADA Title II web accessibility rule (the compliance target for this product’s higher-education and government buyers).
Conformance Level Definitions (Terms)
| Term | Meaning |
|---|---|
| Supports | The functionality of the product has at least one method that meets the criterion without known defects, or meets it with equivalent facilitation. |
| Partially Supports | Some functionality of the product does not meet the criterion. |
| Does Not Support | The majority of product functionality does not meet the criterion. |
| Not Applicable | The criterion is not relevant to the product. |
Scope abbreviations used in remarks: App = product application UI; Output = generated/hosted org chart pages.
Summary of Results
| Group | Supports | Partially Supports | Does Not Support | Not Applicable |
|---|---|---|---|---|
| WCAG 2.1 Level A (30 criteria) | 21 | 6 | 0 | 3 |
| WCAG 2.1 Level AA (20 criteria) | 12 | 6 | 0 | 2 |
Every criterion reported below reflects the state of the code after the Phase 1 (data integrity, share security) and Phase 2 wave 1 (radial keyboard access, ARIA tree correction, focus traps, input labeling, target sizing, theme contrast) fixes on branch feature/org-chart-phase2-a11y.
Table 1: Success Criteria, Level A
| Criteria | Conformance Level | Remarks and Explanations |
|---|---|---|
| 1.1.1 Non-text Content | Partially Supports | App/Output. Decorative SVG glyphs carry aria-hidden; every radial node exposes a text aria-label (name, title, department, direct-report count) and the accessible tree conveys all data as text; the profile-image fallback renders initials with the real name available as text. Photographs a customer uploads have no per-image alternative-text editor yet, so a chart may contain images whose only description is the person’s name — adequate for identification but customer-dependent. Remediation: add an alt-text field to the person editor (roadmap). |
| 1.2.1 Audio-only and Video-only (Prerecorded) | Not Applicable | The product contains no prerecorded audio-only or video-only media. |
| 1.2.2 Captions (Prerecorded) | Not Applicable | The product contains no prerecorded synchronized media. |
| 1.2.3 Audio Description or Media Alternative (Prerecorded) | Not Applicable | The product contains no prerecorded synchronized media. |
| 1.3.1 Info and Relationships | Supports | App/Output. The accessible tree (shared/AccessibleTree.tsx) uses a valid ARIA tree (role="tree"/treeitem"/group" with aria-level, aria-setsize, aria-posinset, aria-expanded). The invalid ARIA tree previously shipped in the radial list view was replaced by this shared component (commit e5b965cc). The editor’s data grid uses a semantic <table> (the incorrect role="grid" was removed). Generated output uses semantic headings, lists, and labeled form controls, verified by the static validator (heading-hierarchy, list-structure, table-headers, form-labels) and axe-core. |
| 1.3.2 Meaningful Sequence | Supports | App/Output. DOM order matches visual reading order in the application and in generated HTML; axe-core validates sequence on rendered output. |
| 1.3.3 Sensory Characteristics | Supports | App/Output. Instructions do not rely solely on shape, size, or location. The radial chart’s usage hint names the keys (“Use Tab to enter, arrow keys to move…”) rather than pointing at a visual location. |
| 1.4.1 Use of Color | Partially Supports | App/Output. Hierarchy and relationships are conveyed by structure and text labels, not color alone (the tree exposes level/child counts as text; secondary relationships are summarized in text). Some radial themes still distinguish states (e.g. link types) partly by hue; dashed stroke patterns provide a non-color cue for secondary links, but a full audit of every theme for a redundant non-color indicator on all encoded states is pending. Remediation: complete the color-independence review across all six themes. |
| 1.4.2 Audio Control | Not Applicable | The product plays no automatic audio. |
| 2.1.1 Keyboard | Supports | App/Output. The radial SVG is now keyboard operable: nodes are focusable buttons with roving tabindex, Enter/Space activate, arrow/Home/End move focus, and Escape dismisses the tooltip (RadialOrgChart.tsx, commit e5b965cc; covered by radial-a11y.test.tsx). The accessible tree implements the WAI-ARIA APG tree pattern: arrow-key, Home/End, and Enter navigation is covered by tree-a11y.test.tsx, and typeahead plus * (expand-siblings) are implemented per the same pattern (useTreeNavigation). Editor and share dialogs are fully keyboard operable. |
| 2.1.2 No Keyboard Trap | Supports | App. Modal dialogs (share, editor) use useFocusTrap, which cycles Tab/Shift+Tab within the dialog, closes on Escape, and restores focus to the invoking control on close (useFocusTrap.ts, focus-trap.test.tsx). Focus is intentionally contained only while a modal is open; no permanent traps exist. |
| 2.1.4 Character Key Shortcuts | Not Applicable | The product implements no single-character key shortcuts. (Tree typeahead activates only while the tree has focus and does not conflict with global keys.) |
| 2.2.1 Timing Adjustable | Supports | App/Output. No time limits are imposed on user interaction. (Share links have expiry windows, but these govern link validity, not an interaction the user must complete under time pressure.) |
| 2.2.2 Pause, Stop, Hide | Supports | App/Output. No auto-updating or moving content that lasts more than five seconds. Decorative motion respects prefers-reduced-motion. |
| 2.3.1 Three Flashes or Below Threshold | Supports | App/Output. No content flashes more than three times per second. |
| 2.4.1 Bypass Blocks | Supports | App/Output. A “Skip to main content” link is the first focusable element in the application layout; generated HTML includes a skip link, verified by the static validator (skip-navigation). |
| 2.4.2 Page Titled | Supports | App/Output. Application pages set descriptive <title> via Next.js metadata; generated documents include a <title>, verified by the page-title validator rule. |
| 2.4.3 Focus Order | Supports | App. Focus order follows a logical sequence; dialogs move focus in on open and restore it on close. The radial roving-tabindex model keeps a single node in the tab order and moves focus predictably with arrow keys. |
| 2.4.4 Link Purpose (In Context) | Supports | App/Output. Links have discernible text or aria-label; validated by the link-purpose rule and axe-core. |
| 2.5.1 Pointer Gestures | Supports | App. All operations use single-point activation; no path-based or multipoint gestures are required. |
| 2.5.2 Pointer Cancellation | Supports | App. Activation occurs on the up-event (click), which can be aborted by moving off the target. |
| 2.5.3 Label in Name | Supports | App. Visible control labels are contained in their accessible names (labeled inputs in the share dialog and editor; buttons use their visible text). |
| 2.5.4 Motion Actuation | Not Applicable | No functionality is operated by device or user motion. |
| 3.1.1 Language of Page | Supports | App/Output. The application sets <html lang="en">; generated documents receive a lang attribute, verified by the html-lang validator rule. |
| 3.2.1 On Focus | Supports | App/Output. Receiving focus does not trigger an unexpected change of context. In the radial view, focusing a node reveals a tooltip in place (a non-context-changing supplement); activation (a context change) requires Enter/Space or click. |
| 3.2.2 On Input | Supports | App. Changing a form control does not automatically cause a change of context; edits are applied to local state with a debounced background save. |
| 3.3.1 Error Identification | Partially Supports | App. Errors are surfaced in text via role="alert"/aria-live regions rather than the console (share failures, CSV import errors now list specific problems instead of “check console”; copy failures give an actionable inline message). Not every input across the account and upload flows has been audited for programmatic, field-level error association. Remediation: complete an error-identification sweep of the auth, billing, and upload forms. |
| 3.3.2 Labels or Instructions | Partially Supports | App. The editor inputs, share password/expiry controls, and template search now have associated labels (commit e5b965cc). A full inventory of every form control across all account/upload surfaces for a visible label or instruction is not yet complete. Remediation: audit remaining forms. |
| 4.1.1 Parsing | Supports | App/Output. Markup is generated by React/JSX and templated HTML with unique IDs (the static validator includes a duplicate-ID check). Note: WCAG 2.1 4.1.1 is obsolete under WCAG 2.2, but is retained here for the 2.1 edition. |
| 4.1.2 Name, Role, Value | Partially Supports | App/Output. Interactive components expose name/role/value: radial nodes use role="button" with aria-label; the tree exposes ARIA tree semantics with aria-selected/aria-expanded; dialogs use role="dialog", aria-modal, and labelling. The aria-roles validator and axe-core check output. This is reported Partially Supports pending verification with real assistive technology: the radial view exposes node names/roles but relies on aria-activedescendant-free roving focus inside an SVG, a pattern whose announcement quality varies by screen reader and has not yet been confirmed with NVDA/JAWS/VoiceOver. Remediation: formal screen-reader test pass (roadmap). |
Table 2: Success Criteria, Level AA
| Criteria | Conformance Level | Remarks and Explanations |
|---|---|---|
| 1.2.4 Captions (Live) | Not Applicable | No live synchronized media. |
| 1.2.5 Audio Description (Prerecorded) | Not Applicable | No prerecorded synchronized media. |
| 1.3.4 Orientation | Supports | App/Output. Content is not restricted to a single display orientation; layouts are responsive. |
| 1.3.5 Identify Input Purpose | Supports | App. Inputs that collect known data use appropriate autocomplete (e.g. the share password field uses autocomplete="new-password"). |
| 1.4.3 Contrast (Minimum) | Partially Supports | App/Output. Application UI uses the TheAccessible primary palette meeting AA. All six built-in radial themes were re-hued (removing the non-compliant midnight-teal) and are covered by a programmatic contrast test suite (themes-contrast.test.ts) that asserts each theme’s solid text and accent-indicator colors against their solid backgrounds; translucent and gradient decorative colors are excluded from this check. Generated output contrast is checked by the color-contrast validator and axe-core. Reported Partially Supports because customers may select custom palettes or upload photos that place text over low-contrast regions; the product warns and defaults safely but cannot guarantee customer-authored color choices. Remediation: add a contrast check/warning to the custom-palette picker. |
| 1.4.4 Resize Text | Supports | App/Output. Text resizes to 200% without loss of content; no text below the repo’s 12px minimum ships (the former 10px radial labels were raised to ≥12px in commit e5b965cc); the text-resize validator flags fixed sizing in output. |
| 1.4.5 Images of Text | Supports | Output. Generated charts render names, titles, and departments as real DOM text, not images of text. |
| 1.4.10 Reflow | Partially Supports | App/Output. Application pages and text-based templates reflow to a 320px-equivalent width without two-dimensional scrolling. The interactive radial SVG is a large fixed-canvas visualization that pans/zooms rather than reflowing; the keyboard-accessible tree/list is provided as the reflow-friendly equivalent for that data. Remediation: ensure every radial surface links prominently to its list equivalent (partly done via the SVG’s aria-label). |
| 1.4.11 Non-text Contrast | Partially Supports | App/Output. The radial node focus ring is a 3px stroke in the theme’s high-contrast name color, meeting ≥3:1. Solid text and accent-indicator colors on solid backgrounds are verified programmatically by the theme contrast suite (themes-contrast.test.ts); axe-core and the color-contrast check cover generated output. However, the connector/link-line colors (often translucent rgba strokes) and other decorative gradient/translucent fills are not asserted by the suite — they rely on design review rather than programmatic verification. Reported Partially Supports until translucent connector contrast is either verified or brought under automated coverage. |
| 1.4.12 Text Spacing | Supports | App/Output. Content remains readable when users override line height, paragraph, letter, and word spacing; layouts use relative spacing without clipping. |
| 1.4.13 Content on Hover or Focus | Supports | App. The radial tooltip is now focus-reachable (opens on keyboard focus, not hover only), hoverable (the pointer can move into it without it closing), persistent, and dismissible with Escape without moving focus (RadialOrgChart.tsx, commit e5b965cc). |
| 2.4.5 Multiple Ways | Supports | App. Multiple ways to locate content exist: dashboard navigation, in-chart search/typeahead, and direct links to charts. |
| 2.4.6 Headings and Labels | Supports | App/Output. Headings and labels are descriptive; heading hierarchy is validated in output and follows a single-h1 pattern in the application. |
| 2.4.7 Focus Visible | Supports | App/Output. All interactive elements show a visible focus indicator: application controls use focus rings; radial nodes show a dedicated focus-ring circle on focus; the tree shows an outlined active row. The focus-visible validator flags outline suppression in output. |
| 2.5.5 Target Size (Enhanced) (AAA — informational) | Not Applicable | Listed for reference only; not required at AA. AA target sizing is addressed under 2.5.8 in WCAG 2.2. Interactive controls in the app target ≥44×44 CSS px. |
| 3.1.2 Language of Parts | Supports | App/Output. Content is single-language (English); no mixed-language passages requiring per-part lang are generated. |
| 3.2.3 Consistent Navigation | Supports | App. Navigation is consistent across application pages (shared layout, header, footer). |
| 3.2.4 Consistent Identification | Supports | App. Components with the same function (e.g. Share, Copy, Close) are identified consistently. |
| 3.3.3 Error Suggestion | Partially Supports | App. Where errors are detected, actionable text suggestions are provided (e.g. CSV import lists the specific rows/problems; a failed clipboard copy tells the user to select and copy manually). Not all validation paths across account/billing forms have been audited for suggestion quality. Remediation: extend the error-message sweep noted under 3.3.1. |
| 3.3.4 Error Prevention (Legal, Financial, Data) | Partially Supports | App. Destructive and financial actions have safeguards (share links always carry an expiry; the Phase 1 editor rewrite added optimistic state with revert-on-failure so edits are no longer silently dropped). Some destructive actions (e.g. person deletion) still need an explicit confirmation step, and the billing flow’s review/confirm step has not been formally audited against 3.3.4. Remediation: add delete confirmation (tracked) and audit checkout. |
| 4.1.3 Status Messages | Supports | App. Status messages use ARIA live regions announced without moving focus: the tree announces expand/collapse and selection via a polite role="status" region; share copy/expiry and error states use role="status"/role="alert" live regions (replacing the former alert()/prompt() calls). |
Roadmap / Recommended Next Steps
The following are honest gaps this report intentionally does not claim as fully conformant, with the plan to close them:
- Independent third-party audit. No external vendor has certified this product. A formal audit (as Lucidchart commissions for its editor) is recommended before making unqualified conformance claims in procurement. This ACR is a self-assessment.
- Formal assistive-technology test pass. Manual keyboard testing is done; structured testing with NVDA, JAWS, and VoiceOver is pending — this is the main reason 4.1.2 and radial-related criteria are reported conservatively.
- Per-image alternative text for customer-uploaded photos (1.1.1) and a contrast check on the custom-palette picker (1.4.3).
- Color-independence audit of all six radial themes (1.4.1).
- Form/error sweep across auth, billing, and upload surfaces (3.3.1/3.3.2/3.3.3/3.3.4), including a person-delete confirmation.
- Tagged-PDF / PNG export is not yet available; when added it will need its own conformance evaluation (tagged-PDF output is a separate accessibility surface).
This report will be revised as these items land and after any third-party audit. Feedback: [email protected] (five-business-day response target).