Skip to main content

Frequently Asked Questions

What is OpenKeyNav?

OpenKeyNav is an MIT-licensed JavaScript library that adds on-demand keyboard operation and navigation modes to websites and web apps. Click Mode provides direct access to detected targets, while Move Mode lets applications map specialized source-and-destination workflows.

How is OpenKeyNav different from a one-click accessibility overlay?

OpenKeyNav is a developer-integrated JavaScript library for direct keyboard operation and navigation. Its on-page labels and status are purposeful interaction features. Developers connect its configurable mechanisms to the application's controls, state, focus, feedback, and complete workflows. This code-integration model gives teams a reusable keyboard implementation they can evaluate and evolve with the application.

How do I install OpenKeyNav?

Install it from npm:

npm install openkeynav

Or load the browser build:

<script src="https://cdn.jsdelivr.net/npm/openkeynav/dist/openkeynav.umd.min.js"></script>

See Installation for package-manager, CDN, self-hosting, and framework examples.

How do users turn it on?

The default Shift + O command turns the OpenKeyNav command layer on and off. Provide a visible explanation or control in the final interface so users can discover the feature and its current state.

How does Click Mode work?

After enabling OpenKeyNav, press K. Click Mode scans the visible page and labels the targets it detects. Type a displayed label to focus or activate its target. See Click Mode for discovery coverage and verification guidance.

Does OpenKeyNav support dynamic content?

OpenKeyNav examines the current document whenever a mode starts. On the next mode entry, it discovers newly added elements that match that mode's detection rules. Test every dynamic application state because target visibility, event patterns, Shadow DOM, and embedded content affect discovery.

How can I customize the key bindings?

Pass a keys configuration during initialization:

const openKeyNav = new OpenKeyNav();

openKeyNav.init({
keys: {
click: 'c',
scroll: 'w',
},
});

Developer configuration sets the commands shipped with the application. Test those commands with host shortcuts, browser and operating-system commands, screen readers, and speech input.

Why is a target missing from Click Mode?

Confirm that the target is visible, inside the current document and viewport, and represented by a native control, recognized interactive role, tabindex, editable state, or inline click handler. Map listener-only actions, Shadow DOM, cross-origin frames, covered elements, and specialized widgets through an application-specific keyboard route when discovery leaves them unlabeled.

What does a red diagnostic outline mean?

The development heuristic selected this action for keyboard review, and Click Mode includes it in the direct-selection labels. Review its semantics, accessible name, focus behavior, activation result, and role in the complete workflow. Record the finding as one input to complete workflow evaluation.

Which accessibility requirements does OpenKeyNav support implementing?

OpenKeyNav provides implementation paths for complete keyboard tasks under WCAG 2.1.1 and a persistent on/off mechanism for its character shortcuts under WCAG 2.1.4. The Accessibility and WCAG Support page covers the broader verification workflow. The ADA Title II guide connects that work to the federal WCAG 2.1 Level AA timeline for state and local governments.