Zenovay

Accessibility

Accessibility isn't an afterthought—it's a requirement. We target WCAG 2.1 AA compliance as our baseline. Everyone should be able to use Zenovay regardless of ability.

Color Contrast

All text meets minimum contrast ratios: 4.5:1 for body text, 3:1 for large text. We don't rely on color alone to convey meaning—icons and text provide backup.

Our color palette was designed with accessibility in mind. Every semantic color (success, warning, error) works for colorblind users when paired with appropriate icons.

Keyboard Navigation

Every interactive element is reachable via keyboard. Focus states are visible and consistent. Tab order follows visual order. No keyboard traps.

  • Tab and Shift+Tab navigate between elements
  • Enter activates buttons and links
  • Escape closes modals and dropdowns
  • Arrow keys navigate within components

Screen Readers

We use semantic HTML first, ARIA when necessary. Images have alt text. Dynamic content announces changes. Complex widgets have proper roles and states.

  • Headings create document structure (h1, h2, h3)
  • Lists group related items
  • Buttons vs links: buttons for actions, links for navigation
  • Form fields have associated labels
  • Live regions announce dynamic updates

Motion

We respect the prefers-reduced-motion media query. Essential information is never conveyed through motion alone. Animations are subtle and purposeful.

Users who prefer reduced motion see instant state changes instead of transitions. The experience is equally functional without animation.

Testing

We test accessibility regularly:

  • Automated testing with axe-core in CI
  • Manual keyboard navigation testing
  • VoiceOver and NVDA screen reader testing
  • Zoom testing up to 200%
  • Color contrast checking in Figma