Home / Accessibility

Accessibility

Last updated: 2026-04-25

MDSwap is built to meet Web Content Accessibility Guidelines (WCAG) 2.1 Level AA. This is a self-statement: we test against axe-core in CI and audit manually with keyboard and screen reader. It is not a third-party VPAT. We'll commission one if usage justifies the cost; for now, here is what we've actually done and what we know we haven't.

What we do

• Skip link as the first focusable element on every page, jumping to #main.
• Landmarks on every page: <header role="banner">, <main id="main" tabindex="-1">, <footer role="contentinfo">, plus <nav aria-label="..."> for primary, footer, and pagination nav.
• Keyboard: every interactive element is reachable and operable from the keyboard, in a sensible order, with a visible focus ring that meets contrast requirements. Esc dismisses dialogs and clears search.
• Focus management: on route change #main receives focus so screen-reader users land on the new page's heading. Modal dialogs trap focus and restore it on close. aria-modal="true" and aria-labelledby point to the dialog title.
• Color and contrast: body text against background meets AA Normal in every theme. The Daylight (light) accent is tuned to #4a2cdc for AA against white. Muted/secondary text is lifted in dark themes to keep AA Normal.
• Reduced motion: prefers-reduced-motion: reduce disables all transition and animation that isn't essential.
• Forced colors and high contrast: forced-colors: active and prefers-contrast: more are honored; we use system colors and ensure outlines remain visible.
• Color scheme: prefers-color-scheme picks Daylight or Midnight on first visit; you can override and your choice is remembered.
• Forms and inputs: labels are programmatically associated; required fields are marked with aria-required; error messages are tied to the input with aria-describedby; live regions announce filter result counts and toast messages.
• Stateful nav and controls: aria-pressed on toggles, aria-current="page" on the current page link, aria-expanded on disclosure widgets.
• Star ratings: rendered visually with a numeric label like "4.6 out of 5" so screen-reader users get the same information.
• Touch targets: minimum 44×44 CSS pixels on coarse pointers (mobile and tablet).
• Headings: one <h1> per page, descending order without skipping levels, used for structure not styling.
• Images: meaningful images carry alt text; decorative images use alt="" or aria-hidden="true".
• Code and content: markdown bodies render with semantic HTML (lists are real lists, code is in <code> and <pre>, tables have headers).
• Language: html lang="en" set on every page.
• Zoom: layout reflows at 200% zoom without horizontal scrolling on widths down to 320px.

Known gaps

• The markdown editor uses a <textarea> rather than a content-editable rich editor. Functional, but does not announce inline formatting changes.
• Syntax-highlighted code blocks are colored for sighted users; the underlying text is read normally by screen readers, but the colors themselves don't carry semantic meaning that's announced.
• Some user-submitted markdown may include images without alt text; we encourage authors but do not yet enforce.
• We have not commissioned a third-party audit. Items marked done are based on our own testing with axe-core, NVDA on Windows, VoiceOver on macOS and iOS, and keyboard-only navigation in Firefox and Chrome.

Standards we target

WCAG 2.1 Level AA. Where 2.2 success criteria are stricter (focus appearance, dragging movements, target size minimum) we treat them as targets, not yet a guarantee.

How to report a barrier

If a feature is unusable for you, email us with the page URL, what you were trying to do, and what assistive technology you use. We aim for an acknowledgement within 5 business days and a fix or workaround timeline within 10. If a fix isn't possible, we'll explain why and what we're doing instead.

This page itself is the first thing we audit when we change the visual system or interactive components. If you find this statement out of date, that's also a bug.

Contact: muhammedeliwat@gmail.com