Loading Ableway
Loading Ableway
Last Updated: August 27, 2026
Ableway is built by a founder from the disability community, for everyone the map forgot. Accessibility is not an afterthought — it is the reason the company exists. We aim to make https://ableway.co usable by everyone, including people who use assistive technology. Because Ableway is pre-launch, this statement covers the landing page, waitlist, and optional survey today. When the full navigation platform ships, this statement will be expanded to cover the product.
Our goal is to meet WCAG 2.2 Level AA across this landing page. We are not yet third-party-audited; we plan to commission an external audit before public launch. The pages below describe what we have built and what is genuinely supported today, with each claim pointing at the underlying code.
Every row below is a concrete feature in the codebase, not aspirational copy.
| Feature | Where it lives | What it does |
|---|---|---|
| Skip-to-content link | src/app/layout.tsx (<a class="skip-link">) | Hidden until focused, jumps to #main. Keyboard-only — visible only when keyboard focus is on it. |
| Semantic landmarks | src/app/layout.tsx, src/app/page.tsx, src/app/unsubscribe/page.tsx, src/components/landing/Nav.tsx | <header>, <nav aria-label="Primary">, <main id="main">, <footer>. Every page uses <h1> once and descends without skipping levels. |
| Form labels | src/components/landing/WaitlistForm.tsx | Both inputs have an associated screen-reader-only <label> element (Email address, Your city (optional)). Error messages use role="alert" so screen readers announce them. |
| Honeypot hidden from AT | src/components/landing/WaitlistForm.tsx | Hidden <input name="company"> with tabIndex={-1}, aria-hidden="true", off-screen position. Bot submissions that fill it are silently dropped. |
| Hero canvas labeled | src/components/landing/HeroCanvas.tsx | Hero canvas is decorative (aria-hidden); it conveys no essential information that is not also present in text elsewhere on the page. |
| Static fallback for canvas | src/components/landing/HeroCanvas.tsx (StaticFallback) | Renders when WebGL is unavailable, when prefers-reduced-motion: reduce is set, when the device is in saveData mode, on low-core devices (hardwareConcurrency ≤ 2), on low-memory devices (deviceMemory ≤ 2), or when only software rendering is available (failIfMajorPerformanceCaveat). |
| Reduced-motion respect | src/components/landing/Manifesto.tsx, src/components/landing/HeroCanvas.tsx, src/app/globals.css | Marquee, WebGL, grain overlay, and tickers all bail to static when reduced motion is requested. |
| Focus indicators | src/app/globals.css (:focus-visible global rule) | Every interactive element gets a 2px solid signal-accent outline with 3px offset. Form fields use a wrapper-level focus ring (the inner input suppresses its own outline to avoid a double ring). |
| Legal-document headings | src/components/legal/LegalDoc.tsx | Every <h2> and <h3> in the rendered markdown has a stable id, so anchors work and screen readers can navigate by heading. |
| OpenNext dev-mode config | next.config.ts | Lets next dev resolve Cloudflare bindings, which keeps local testing aligned with production behaviour. |
| Target size (WCAG 2.2 §2.5.8) | src/components/landing/Nav.tsx, src/components/landing/WaitlistForm.tsx | All interactive targets are ≥24×24px CSS. The nav CTA is ~40px tall; the mobile menu toggle is 40×40px. |
| Focus not obscured (WCAG 2.2 §2.4.11) | src/components/landing/Nav.tsx | The sticky nav uses backdrop-blur (not a solid background) so focused content behind it remains visible. |
| Consistent help (WCAG 2.2 §3.2.6) | src/components/landing/Footer.tsx | A contact email (hello@ableway.co) is in the same relative position in the footer across every page. |
| Redundant entry prevention (WCAG 2.2 §3.3.7) | src/components/landing/WaitlistForm.tsx | Email and city inputs use autoComplete="email" and autoComplete="address-level2" so the browser pre-fills previously entered data. |
| Survey step navigation | src/components/survey/SurveyFlow.tsx | The survey moves focus to each step's heading on step change, announces progress via a polite live region, and errors use role="alert". Every question offers "Prefer not to say," and the access-need section is skippable entirely. |
| No-JS readability | All pages | Article prose, legal documents, and CTAs render as static HTML — not wrapped in scroll-reveal animations that start invisible — so the site is fully readable with JavaScript disabled. |
| Light/dark theme control | src/components/ui/ThemeToggle.tsx | The theme follows the OS prefers-color-scheme by default and a persistent toggle overrides it; the choice is stored locally. |
| WCAG 2.2 regression tests | scripts/test-accessibility.mjs | 47 source-level checks covering WCAG 2.2 AA criteria run on every CI build via npm test. |
We document these honestly so they are not surprises.
src/components/ui/CustomCursor.tsx renders
a custom cursor with mix-blend-mode: difference on devices reporting
(pointer: fine). It is suppressed on (pointer: coarse) and inside
text inputs, but users with low vision, motion sensitivity, or certain
cognitive styles may find a custom cursor disorienting. Native cursor
behaviour always takes precedence for keyboard and touch input.--fg-60 at 80% alpha (~14:1 vs #fafaf8) and --fg-40 at 58%
(~6.5:1); dark mode floors its dimmest text token at 50% alpha
(~5:1 vs #080808). The WebGL hero
background stays dark in both themes (brand decision) — the Hero and
CityDivider sections use a .theme-dark-scope class to force dark
tokens over the canvas so text remains readable.src/components/providers/LenisProvider.tsx
intercepts native scroll to enable smooth animation. It preserves
prefers-reduced-motion (disables itself) and forwards
scrollIntoView calls, so keyboard navigation by heading-anchor still
works. Some assistive technology may see delayed scroll events; we
monitor.next/font. If the font request fails, the page falls back to system
fonts that may have different metrics and slightly different line
lengths. The fallback is graceful but not pixel-identical.We want to know when something is broken for you. Email access@ableway.co with:
We aim to acknowledge accessibility reports within 48 hours and resolve them where feasible within 7 days. If you would rather speak with us on the phone or via video, write access@ableway.co and we will work out a channel.
| Phase | Commitment |
|---|---|
| Pre-launch | Targeting WCAG 2.2 AA for this landing page (in progress; external audit pending) |
| Launch | Third-party audit; address all findings |
| Post-launch | WCAG 2.2 AAA where feasible; captioning for any video content |
This statement is provided in accordance with:
Ableway believes accessibility is a human right, not a feature. We are committed to continuous improvement and welcome your input.