WCAG Operable Support

According to the Web Content Accessibility Guidelines (WCAG) definition of the Operable accessibility principle, "user interface components and navigation must be operable".

The Operable principle provides the following categories of success criteria:

• Keyboard Accessible
• Enough Time
• Seizures and Physical Reactions
• Navigable
• Input Modalities

Keyboard Accessible

The 2.1 Keyboard Accessible WCAG category requires you to "make all functionality available from a keyboard" and includes the following success criteria:

• 2.1.1 Keyboard, Conformity Level A.
  • Enable keyboard navigation to make the Grid accessible with the keyboard.
  • The Chart is currently not accessible with the keyboard.
• 2.1.2 No Keyboard Trap, Conformity Level A.
  • The Kendo UI for Angular components do not embed plug-in content that can create keyboard traps.
  • (Tip) Avoid creating focus traps in templates—for example, by embedding Flash content.
• 2.1.3 Keyboard (No Exception), Conformity Level AAA.
  • (Tip) Use a link template to render anchors in the Menu.
• 2.1.4 Character Key Shortcuts, Conformity Level A.
  • The Kendo UI for Angular components use single-character shortcuts only when focused—for example, the Menu component.

Enough Time

The 2.2 Enough Time WCAG category requires you to "provide users enough time to read and use content" and includes the following success criteria:

• 2.2.1 Timing Adjustable, Conformity Level A.
  • The Kendo UI for Angular components do not set time limits.
  • (Tip) Avoid setting time limits for user input.
• 2.2.2 Pause, Stop, Hide, Conformity Level A.
  • The Kendo UI for Angular components respond to updates instantaneously.
  • (Tip) Allow the user to pause live updates.
• 2.2.3 No Timing, Conformity Level AAA.
  • The Kendo UI for Angular components do not impose time limits on user activity.
• 2.2.4 Interruptions, Conformity Level AAA.
  • The Kendo UI for Angular components do not require additional actions to meet this criteria.
  • (Tip) Use the Notification component to provide status updates without interrupting the user.
• 2.2.5 Re-Authenticating, Conformity Level AAA.
  • The Kendo UI for Angular components do not require additional actions to meet this criteria.
• 2.2.6 Timeouts, Conformity Level AAA.
  • The Kendo UI for Angular components do not require additional actions to meet this criteria.
  • (Tip) Use the Notification component to warn the user if the allotted time is expiring.

Seizures and Physical Reactions

The 2.3 Seizures and Physical Reactions WCAG category requires you to "not design content in a way that is known to cause seizures or physical reactions" and includes the following success criteria:

• 2.3.1 Three Flashes or below Threshold, Conformity Level A.
  • The Kendo UI for Angular components do not require additional actions to meet this criteria.
• 2.3.2 Three Flashes, Conformity Level AAA.
  • The Kendo UI for Angular components do not require additional actions to meet this criteria.
• 2.3.3 Animation from Interactions, Conformity Level AAA.
  • Turn off animations by injecting NoopAnimationsModule instead of BrowserAnimationsModule.
  • The Chart animations can be disabled by setting [transitions]="false".

Navigable

The 2.4 Navigable WCAG category requires you to "provide ways to help users navigate, find content, and determine where they are" and includes the following success criteria:

• 2.4.1 Bypass Blocks, Conformity Level A.
  • The Kendo UI for Angular components do not require additional actions to meet this criteria.
• 2.4.2 Page Titled, Conformity Level A.
  • The Kendo UI for Angular components do not require additional actions to meet this criteria.
• 2.4.3 Focus Order, Conformity Level A.
  • The Kendo UI for Angular components do not require additional actions to meet this criteria.
  • (Tip) Avoid setting tabindex to values that are different from -1 or 0. Instead, modify the document structure to follow the logical order.
• 2.4.4 Link Purpose (In Context), Conformity Level A.
  • The Kendo UI for Angular components do not require additional actions to meet this criteria.
• 2.4.5 Multiple Ways, Conformity Level AA.
  • The criteria is not applicable to Kendo UI for Angular because the rendering of a web page within a set of web pages depends on the application logic.
• 2.4.6 Headings and Labels, Conformity Level AA.
  • The Kendo UI for Angular components do not require additional actions to meet this criteria.
  • (Tip) Built-in labels are part of the component messages and can be translated. For more information, refer to the article on translating component messages.
• 2.4.7 Focus Visible, Conformity Level AA.
  • The focused state is visually distinctive in the Kendo UI for Angular components.
  • Enable keyboard navigation to make rows focusable in the Grid.
• 2.4.8 Location, Conformity Level AAA.
  • The criteria is not applicable to Kendo UI for Angular because the implementation of information about the user's location depends on the application logic.
• 2.4.9 Link Purpose (Link Only), Conformity Level AAA.
  • The Kendo UI for Angular components do not require additional actions to meet this criteria.
• 2.4.10 Section Headings, Conformity Level AAA.
  • The criteria is not applicable to Kendo UI for Angular because the display of section headings depends on the application logic.

Input Modalities

The 2.5 Input Modalities WCAG category requires you to "make it easier for users to operate functionality through various inputs beyond keyboard" and includes the following success criteria:

• 2.5.1 Pointer Gestures, Conformity Level A.
  • The Kendo UI for Angular components do not require additional actions to meet this criteria.
• 2.5.2 Pointer Cancellation, Conformity Level A.
  • The Kendo UI for Angular components do not execute actions on pointer or mouse-down events.
• 2.5.3 Label in Name, Conformity Level A.
  • The Kendo UI for Angular components do not require additional actions to meet this criteria.
• 2.5.4 Motion Actuation, Conformity Level A.
  • The criteria is not applicable to Kendo UI for Angular because the components do not respond to device motion.
• 2.5.5 Target Size, Conformity Level AAA.
  • The target size varies across themes and is the largest in the Material theme.
  • None of the themes meet this criteria without modifications.
  • For an example on increasing the target size of Chart points, refer to the article on expanding the touch target area.
• 2.5.6 Concurrent Input Mechanisms, Conformity Level AAA.
  • The Kendo UI for Angular components do not require additional actions to meet this criteria.

Suggested Links

• WCAG 2 Quick Reference Guide
• WCAG 2.2 Guidelines
• Accessibility Support by Kendo UI for Angular