MY Consumer Compass logoMY Consumer Compass

Accessibility

Accessibility report & checklist

MY Consumer Compass aims at WCAG 2.1 Level AA. This page shows the contrast numbers measured live from the current theme, plus the checks run across the guide, budgeting tools and community workbook.

Contrast test results

Measured live in your browser from the theme's colour tokens with standard contrast. Toggle high contrast in the header and these numbers update.

Measuring…

Contrast ratios for text colour pairs used across the app
Text pairRatioAAAAA

Keyboard access

WCAG 2.1.1, 2.4.1, 2.4.3, 2.4.7

  • Every interactive element is reachable by TabAll 10 routes were walked with an automated tab-order pass: 0 unreachable controls.
  • Visible focus ring on every focused controlEach focused element showed a focus ring; high contrast raises it to a 3px outline.
  • "Skip to main content" link first in tab orderLets keyboard users bypass the 11-item navigation on the landing, free and app shells.
  • Dialogs trap focus and close with EscapeWelcome, FTC disclosure and PDF dialogs return focus to the trigger button on close.

Screen reader announcements

WCAG 1.3.1, 2.4.6, 4.1.2

  • One h1 per page and no skipped heading levelsModule pages announce the module name as h1; disclosure sections use h2/h3 in order.
  • Dialogs announce a title and descriptionThe FTC disclosure modal announces its name plus the effective date on open.
  • Links and buttons carry meaningful namesWorkbook sessions announce "Session 1: Your starting point — 0 of 4 fields filled"; module arrows announce "Previous/Next module".
  • Icon-only buttons have aria-labelsCalendar month arrows, contrast toggle and dialog close buttons are all labelled.
  • Landmarks: header, nav, main, complementary, footerExactly one <main> per page; the FTC disclosure is a labelled complementary region.

Text size & reflow

WCAG 1.4.4, 1.4.10

  • Small / medium / large text setting in the headerScales the root font size (15px / 16px / 20px), so every rem-based size scales with it.
  • No horizontal scrolling at 320px wideChecked at 320 CSS px with the large text setting on: content reflows to one column.
  • Text wraps instead of clippingLong disclosure copy and worksheet titles use break-words on narrow screens.

Colour & contrast

WCAG 1.4.3, 1.4.11

  • High-contrast mode for the rustic themeRemoves parchment grain and wood textures and darkens text; saved on your device.
  • Colour is never the only signalCompletion uses a filled check icon plus a counted label, not just green.
  • Disabled controls stay readableDisabled opacity is raised to 0.75 to keep text above 4.5:1.

Print & PDF output

WCAG 1.4.3, 1.4.8

  • Ink-light print stylesTextures and shadows are stripped for print so text prints as dark type on white.
  • FTC disclosure stays bold on every exportShared PDF branding puts the educational-purposes and commission disclosure on each file.

Found a barrier?

If any page, worksheet or PDF is hard to read or use with a keyboard or screen reader, tell us and we will fix it. Meanwhile, the text size and high-contrast controls above travel with you across every page on this device.

Back to the planCommunity workbook