Accessibility
ClubShack is for every member of your club, including people who use a screen reader, a keyboard, large text or high contrast. This page says what we aim for, what we check, and what doesn’t work yet.
What we aim for
We’re working to the Web Content Accessibility Guidelines (WCAG) 2.2 at level AA, on phones, tablets and the web. We use the European standard EN 301 549 as a guide too. We don’t yet claim that ClubShack fully meets either: the parts we know fall short are listed below.
What you can do
- Make text bigger up to twice the size, with your phone’s or computer’s settings or with My account › Text size. On a large screen the layout changes to give bigger text room.
- Use a screen reader: VoiceOver, TalkBack, NVDA. Buttons, pictures and charts have names, headings are marked, and changes such as “Saved” are read out.
- Use a keyboard on the web and on tablets: Skip to main content is the first thing you reach; Tab moves through the menu, the list and the screen; Up and Down move through lists; Esc closes a dialog or the item open beside a list; Enter sends a message on a computer.
- See where you are: a clear outline shows what has keyboard focus, and each screen has its own title in the browser tab.
- Choose dark mode and reduce motion in your device’s settings or in the app.
- Tap easily: buttons and rows are at least 48 points, on phones and computers.
- Colour is never the only way something is shown, and text meets the WCAG contrast levels in light and dark, and in every colour a club can choose.
How we check
- Automated tests run on every change: each screen at phone, tablet and computer sizes, at normal and twice the text size, with checks for target size, labels, contrast and keyboard use.
- Every change also builds the web companion and checks it in a real browser with axe, against the WCAG 2.2 A and AA rules.
- Before each release that changes screens, we check it by hand with screen readers (NVDA, VoiceOver and TalkBack), by keyboard alone, at 200% and 400% browser zoom, and with high-contrast settings. Automated checks can’t prove a screen is usable on their own.
What doesn’t work yet
The web companion is built with Flutter, which draws the page itself and makes a separate version for screen readers. That means, on the web:
- Find in page (Ctrl+F or ⌘F), browser translation and reader view don’t see the text. Use the search boxes on Members, Market, Notices and Chat instead.
- Your own text spacing from a browser extension or style sheet isn’t applied (WCAG 1.4.12). The app’s own spacing already meets that level, and Text size makes text bigger.
- Your browser’s font size setting and Windows contrast themes may not reach the app. Use Text size and dark mode instead.
- Rows are links for screen readers, but Ctrl-click or ⌘-click with a mouse doesn’t open them in a new tab. A new tab would ask you to sign in again anyway: on the web, ClubShack keeps you signed in for one tab only, to protect shared computers.
We watch Flutter’s releases for fixes to these, and we’ll update this page when they change.
Tell us about a problem
If something in ClubShack is hard or impossible for you to use, please tell us, even if it isn’t listed here. Email hello@clubshack.app with what you were trying to do, the screen, and the device and any assistive technology you use. We read every message and reply as soon as we can.
Your club’s committee can help you in the meantime: anything you can do in the app, they can do for you or with you.