Making the experience work for keyboard, assistive-tech, and mobile users. Product quality, not a compliance checkbox.
When interactive elements don't have accessible labels, screen readers announce them as "button" or "link" with no context — forcing blind users to guess what each control does. Notable accessibility settlements include Bashin's $2M settlement and accessiBe's $1M FTC settlement (Accessibility.Works, 2024). Proper ARIA labels are foundational accessibility requirements under WCAG 2.1.
Open guideApproximately 8% of males and 0.5% of females have colour vision deficiency — roughly 1 in 12 men worldwide (Vision Center). WCAG AA requires a minimum 4.5:1 contrast ratio for normal text. Low contrast also affects everyone reading on mobile screens in bright sunlight. With over 5,100 ADA web accessibility lawsuits filed in 2025 — a 20% increase from 2024 (EcomBack) — contrast failures are actionable legal risk.
Open guideWhen a label isn't programmatically associated with its input (via for/id or wrapping), screen readers don't announce what the field is for, and voice control users can't say "click email field." Form label errors are among the most commonly cited issues in accessibility audits, and they're straightforward to fix — just add matching for and id attributes.
Open guide22.1% of all images on website home pages lack alt text (WebAIM, 2024). Screen readers — used by JAWS (41% market share) and NVDA (38%) users — announce images without alt text as just "image," providing zero context. Missing alt text also means Google Image Search can't index your visuals. Over 5,100 web accessibility lawsuits were filed in 2025 alone (EcomBack), and missing alt text is one of the most commonly cited violations.
Open guide88.8% of screen reader users find headings and landmarks very or somewhat useful for navigation (WebAIM Survey #10, 2024). Without landmarks, navigating your site requires listening to every element sequentially — there's no way to jump to the main content, search bar, or footer. Semantic HTML5 elements (nav, main, aside, footer) automatically create landmarks.
Open guideThis check estimates whether interactive controls are large enough for touch users. Undersized targets increase accidental taps, form errors, and mobile frustration.
Open guideOver 60% of global ecommerce traffic comes from mobile devices (Alli AI). If text is too small to read comfortably (below 16px base) or lines are too cramped (below 1.4 line-height), mobile users either zoom — breaking your layout — or leave. Users with low vision, dyslexia, or age-related presbyopia are disproportionately affected.
Open guideKeyboard-only users and screen reader users must tab through every navigation link on every page load without a skip link. On a site with 50+ nav links, this means pressing Tab 50 times before reaching content. A skip link is one line of HTML and a few lines of CSS — it's the simplest accessibility win with the highest impact for keyboard users.
Open guideAccessibility is product quality in public. If navigation, forms, or content fail for assistive-tech and keyboard users, the experience is broken.
Accessibility issues are rarely isolated to one group of users. A missing form label affects assistive technology, a cramped tap target frustrates anyone on mobile, and weak heading structure makes long content harder for every reader to scan. The same problems that exclude some users often make the product generally harder to use.
This category is about the visible and structural basics that repeatedly break real journeys: readable contrast, meaningful text alternatives, accessible names for controls, clear page regions, mobile-friendly sizing, and the navigation affordances that help users skip repetitive chrome and reach what matters.
Accessibility defects block real users from completing important tasks, not just edge cases from a compliance checklist.
Good structure and labeling improve resilience across browsers, devices, zoom levels, and input methods.
Relying on visual context alone and forgetting the accessible name a control needs when the icon or layout is stripped away.
Applying brand colors and decorative styles without checking the contrast outcome against the actual background.
Alternative text, form labels, and accessible names so important images and controls have a usable meaning.
Heading structure, landmarks, and skip links so the page can be navigated as a coherent document rather than a visual collage.
Fix the blockers on high-value flows first: navigation, primary calls to action, logins, checkout, forms, and support paths.
Use automated checks to identify patterns, then verify with a keyboard and mobile viewport before calling the work complete.
