WHA Docs

Accessibility

How accessibility is handled across the WHA site, and the editing habits that keep it that way.

Patients use a wide range of devices and assistive technology to find providers and book appointments. The target is WCAG 2.1 AA.

The theme handles what it can in code: semantic HTML, ARIA, keyboard support and focus states (see Theme System → Accessibility). The rest is up to content: alt text, headings, link text and color contrast. A few editing habits cover most of it, and Colors has the contrast-checked pairings.

Editing habits

  • Write meaningful alt text. Describe what the image conveys, not "photo" or "image." Decorative images can have empty alt. Provider headshots should name the provider.
  • Use headings in order. One H1 (the page title), then H2 and H3 in a logical hierarchy. Don't skip levels for visual size, and don't use a heading just to make text big — screen-reader users navigate by heading structure.
  • Write descriptive link text. "Schedule an appointment" or "Read Dr. Smith's bio," not "click here" or "read more" on its own. Links are often read out of context.
  • Don't rely on color alone. Don't convey meaning with color by itself (e.g. "the items in red"). Pair it with text or an icon, and use a contrast-checked pairing.

Color contrast

The brand palette has tested contrast pairings under Design → Colors. Pink isn't safe for body text on light backgrounds, and yellow only works on dark. When in doubt, dark text on a light background — or white on dark — always passes.

Aa13.4:1 · AAAAa4.6:1 · AAAa3.9:1 · fails

Assistive tooling

The site runs the AccessiBe widget, which adds an accessibility menu (text sizing, contrast modes and similar). It supplements correct markup and content; it doesn't replace them.

On this page