What accessibility standard does WISEROWS target?

WISEROWS targets WCAG 2.1 Level AA compliance. This includes requirements for color contrast (4.5:1 for normal text, 3:1 for large text), keyboard accessibility, focus management, text alternatives for non-text content, and consistent navigation. We test against these criteria on every release.

Can I navigate the entire UI with just a keyboard?

Yes. Every interactive element is reachable via Tab/Shift+Tab. Enter and Space activate buttons and links. Arrow keys navigate within complex widgets like menus, tabs, and data tables. Escape closes modals, dropdowns, and panels. Skip navigation links let you jump directly to the main content area.

How does WISEROWS handle focus management?

Focus is managed programmatically for dynamic content. When a modal opens, focus moves to the first interactive element inside it. When it closes, focus returns to the trigger element. When content is filtered or sorted, focus stays on the active area. Focus trapping prevents tabbing outside modals and slide-over panels.

Does WISEROWS work with screen readers?

Yes. WISEROWS is tested with VoiceOver (macOS/iOS), NVDA (Windows), and JAWS (Windows). All interactive components use correct ARIA roles, states, and properties. Dynamic content changes announce via ARIA live regions. Form validation errors are associated with their inputs via aria-describedby.

What are ARIA live regions and how does WISEROWS use them?

ARIA live regions tell screen readers to announce content changes without requiring the user to navigate to the changed element. WISEROWS uses assertive live regions for critical notifications (errors, confirmations) and polite live regions for non-critical updates (filter result counts, loading states). This ensures screen reader users stay informed without being interrupted.

How does WISEROWS handle color contrast?

All text meets WCAG 2.1 AA contrast requirements — 4.5:1 for normal text and 3:1 for large text. The OKLCH color system makes contrast predictable by controlling lightness precisely. Focus indicators, borders, and icons also meet minimum contrast ratios. Color is never the sole means of conveying information.

What is reduced motion support?

When the operating system's "reduce motion" preference is enabled, WISEROWS replaces all spring animations with instant state changes. Transitions that normally take 200-400ms complete in 0ms. The UI updates identically — only the animation is removed. This supports users with vestibular disorders or motion sensitivity.

How are form errors communicated to assistive technology?

Invalid form fields receive aria-invalid="true" and aria-describedby pointing to the error message element. The error message appears visually below the field and is announced by screen readers when the user focuses the field. Error summaries at the top of forms are wrapped in an ARIA alert role for immediate announcement.

Does WISEROWS support high contrast mode?

Yes. WISEROWS respects the forced-colors media query (Windows High Contrast Mode). Borders, focus rings, and text adapt to system colors. Custom colors fall back to system keywords (Canvas, CanvasText, LinkText, etc.) ensuring the interface remains usable in forced color environments.

How do data tables handle accessibility?

Tables use proper HTML table semantics with th elements, scope attributes, and aria-sort indicators. Row selection state is communicated via aria-selected. Column resize handles have aria-label descriptions. Inline editing fields announce their context (column name and row identifier) via aria-label. Keyboard navigation follows the WAI-ARIA grid pattern.

Accessibility

Accessible by default

Not bolted on. Not an afterthought. Proper ARIA labels, full keyboard navigation, screen reader support, and WCAG-compliant contrast from day one. Every user gets the same powerful experience.

Keyboard Navigation & Focus Indicators

Dashboard

Entitiesfocused

Chat

Settings

Tabto navigate

Button (focused)

Create Entity

role="button" aria-label="Create new entity"

Checkbox (focused)

Select all

role="checkbox" aria-checked="true"

Input (focused)

Search entities...|

role="searchbox" aria-label="Search entities"

Dropdown (expanded)

Statusv

All

Published

Draft

aria-expanded="true" aria-haspopup="listbox"

Full keyboard navigation

Every feature in WISEROWS is reachable without a mouse. Tab through elements. Enter to activate. Escape to dismiss. Arrow keys to navigate within complex widgets. Skip links to jump to main content. No keyboard traps.

Tab / Shift+Tab to move between interactive elements
Enter and Space to activate buttons and links
Arrow keys for menus, tabs, and table cells
Escape to close modals, dropdowns, and panels
Skip navigation link to jump to main content
No keyboard traps — you can always Tab out

Keyboard Shortcuts

Tab

Move to next interactive element

ShiftTab

Move to previous element

Enter

Activate button / open link

Esc

Close modal / cancel edit

↑↓

Navigate menu / table rows

←→

Navigate tabs / table columns

Space

Toggle checkbox / select option

Home

Jump to first item

End

Jump to last item

Screen reader support

Tested with VoiceOver, NVDA, and JAWS. Every component uses correct ARIA roles, states, and properties. Dynamic changes announce via live regions. Form errors link to inputs. Table cells describe their column and row context.

Correct ARIA roles on every interactive component
aria-label for icon-only buttons and ambiguous elements
aria-describedby for form validation errors
aria-live="polite" for filter result counts
aria-live="assertive" for error notifications
aria-expanded, aria-selected, aria-checked state tracking

Screen Reader Announcements

Open modalFocus move

"Create Entity dialog. Title, edit text."

Apply filterLive region

"12 results. Showing published items."

Save entityAlert

"Entity saved successfully."

Delete errorAlert

"Error: Cannot delete. Entity has dependencies."

Sort columnLive region

"Score, sorted ascending."

Color contrast & focus rings

Every text element meets WCAG AA contrast ratios. Focus indicators use a consistent 2px ring with offset, visible against any background. Color is never the sole means of conveying information — labels, icons, and shapes always accompany color coding.

4.5:1 contrast ratio for normal text (WCAG AA)
3:1 contrast ratio for large text and UI components
2px focus ring with ring-offset for visibility
Focus-visible: only shows focus ring on keyboard navigation
Color + text label for all status indicators
Forced-colors media query support for Windows HCM

Contrast Ratios

Primary text

15.4:1AAA

Secondary text

7.2:1AA

Muted text

4.8:1AA

Link text

5.1:1AA

Placeholder

3.2:1AA (lg)

Focus Ring Styles

ring-2 ring-primary/50 ring-offset-2

Reduced motion support

Vestibular disorders affect millions. When the operating system's "reduce motion" preference is on, WISEROWS replaces all animations with instant state changes. Same functionality. Same visual states. Zero motion.

Detects prefers-reduced-motion automatically
Spring animations become instant transitions
CSS transitions set to 0ms duration
Parallax and scroll-linked animations disabled
Loading spinners replaced with static indicators
No opt-in required — works system-wide

Motion: on

Spring animation

Animating

duration: 0.4s
easing: spring

Motion: reduced

Instant transition

Static

duration: 0ms
easing: none

WCAG compliance

100%

Keyboard navigable

Screen readers tested

4.5:1

Min contrast ratio

How it feels

Everyone gets the full experience.

Tab through the interface and every focus ring is clear. Turn on your screen reader and every button, every table cell, every status badge announces itself correctly. Enable reduced motion and the UI still works perfectly — it just stops moving. Accessibility isn't a mode. It's how the product works.

Frequently asked questions

Your data is incomplete. Fix it.

Define your schema. Import your data. Let AI enrich every record. See quality scores improve in real time. Free to start, no credit card.