Wevise · Redesign · Accessibility

WCAG 2.1 AA / ADA Assessment

Accessibility review of the 2026 redesign — all eight rebuilt pages plus the shared header/footer. ADA (and Section 508) reference WCAG 2.1 Level AA; that's the bar used here.

Reviewed Aug 7, 2026 Standard WCAG 2.1 AA Scope 8 pages + shell

Overall: substantially conformant to WCAG 2.1 AA once the fixes below land. The foundations are strong — semantic structure, alt text, keyboard skip-link, responsive reflow, and (with the new blue buttons) accessible CTAs. Four items need attention; two are auto-fixed via color swaps, two are quick structural tweaks.

1 Color contrast

WCAG 1.4.3 — normal text ≥ 4.5:1, large text (≥18.7px bold / 24px) ≥ 3:1.

Element	Colors	Ratio	Status
Body text	#5B6B7F on white	5.5:1	Pass AA
Headings	#1B3A5C on white	11.6:1	Pass AAA
Primary buttons (new)	white on #2A6FD0	4.9:1	Pass AA
Hero headline / subhead / eyebrow	on dark photo overlay	8–18:1	Pass AAA
Navy-section & footer text	#C7D3E3 / #8FA4BF on navy	4.6–7.7:1	Pass AA
Gift-tier amounts ($50…)	#3B7DD8, 30px bold	3.9:1	Pass (large)
Footnote / disclaimer text	#9AA7B8 on white	2.4:1	Fixed → #64717F (5.0:1)
Green text-links (→, "View policy")	#04936F on white	3.9:1	Fixed → #2A6FD0 (4.9:1)

2 Structure, alt text & forms

WCAG 1.1.1, 1.3.1, 2.4.6, 3.3.2, 4.1.2.

✓

Images have text alternatives

Headshots, logos, and content images carry alt text; hero photos are CSS backgrounds (decorative) — correct.

1.1.1 Non-text Content · Pass

✓

One H1 per page, page language set

<html lang="en-US"> and a single top-level heading per page.

3.1.1 · 2.4.6 · Pass

Eyebrow labels are marked as <h6> before the <h1>

The small uppercase labels ("GET INVOLVED", "DONATE"…) are heading elements that precede the page's H1, so the heading outline isn't hierarchical. They're visual labels, not document structure. Fix: render them as non-heading elements (Elementor "div" tag) — same look, out of the heading tree.

1.3.1 Info & Relationships · 2.4.6 Headings & Labels

Newsletter email field has no programmatic label

The footer signup input uses only a placeholder ("you@email.com"). Placeholders aren't accessible names and vanish on input. Fix: add an aria-label="Email address" (and hidden <label>) to the MC4WP form field.

1.3.1 · 3.3.2 Labels · 4.1.2 Name/Role/Value

3 Keyboard, links & responsive

WCAG 2.1.1, 2.4.1, 2.4.4, 2.4.7, 1.4.10, 2.5.5.

✓

Skip-to-content link present

Astra provides a keyboard skip link to bypass the nav.

2.4.1 Bypass Blocks · Pass

✓

Buttons & links have discernible text

No icon-only controls without labels; CTAs read clearly.

2.4.4 · 4.1.2 · Pass

✓

Responsive reflow & target size

Layout reflows to a single column on mobile with no horizontal scroll; buttons are ~44px tall.

1.4.10 Reflow · 2.5.5 Target Size · Pass

Two low-priority items to tidy

(a) A couple of "Learn more" links could be more descriptive (e.g., "Learn about Chicago TechPath"). (b) Confirm the custom button style keeps a visible keyboard focus outline — verify during QA once the shell is live.

2.4.4 Link Purpose · 2.4.7 Focus Visible

4 Fix log

What I'm changing now vs. what's recommended.

Fix	How	Status
Footnote grey → #64717F	site-wide color swap	Fixed ✓
Green text-links → blue #2A6FD0	site-wide color swap	Fixed ✓
Eyebrow labels: h6 → div tag	heading-tag swap (keeps styling)	Fixed ✓
Newsletter field aria-label	MC4WP form markup	Fixed ✓
Descriptive "Learn more" links	copy tweak	Recommended
Verify visible focus outline	launch-day QA on live shell	QA

Bottom line: the redesign was built accessibly from the start — the failures are minor and mostly cosmetic (two light colors + label semantics). With the four fixes applied, the site meets WCAG 2.1 AA. Final keyboard-focus and screen-reader spot-checks belong in launch-day QA once the new shell is live.