Any keyboard operable user interface has a mode of operation where the keyboard focus indicator is visible. (Level AA)

Rationale

The purpose of this checkpoint is to ensure that the keyboard focus indicator can be visually located so that a person knows which element has the keyboard focus. All focus indicators should be highly visible and distinguishable.

Refer to Understanding SC 2.4.7 for more information (external link to WCAG).

Development Techniques

Review the General techniques as well as other tabs applicable to your technology.  Prioritize the use of technology-specific techniques, and implement the General techniques as needed. You are always required to find, understand and implement accessible code techniques to meet the checkpoint. The documented techniques and supplements are not exhaustive; they illustrate acceptable ways to achieve the spirit of the checkpoint. If numbered, techniques are in order of preference, with recommended techniques listed first. Where used, IBM information that complements the WCAG techniques is indicated as supplemental.

General techniques

Any item in this section represents a technique deemed sufficient. Ensure you review WCAG Common Failures to avoid development mistakes.

General supplements

The following examples and comments provide additional information beyond that available in the WCAG techniques.

G195 : Using an author-supplied, highly visible focus indicator

When using an author-supplied focus indicator, you must also ensure the indicator is highly visible when platform high-contrast styles are in place. With operating system high contrast activated, make sure keyboard and mouse focus indicators are easily distinguishable. One way to confirm is to ensure the focus indicator achieves sufficient contrast or relative luminence, as per checkpoints 1.4.1 Use of Color and 1.4.3 Contrast (Minimum).

Web (HTML, ARIA, CSS) techniques

In addition to the General techniques, the Web techniques in this section represent a technique or combination of techniques deemed sufficient for meeting this checkpoint.

Mobile (iOS) techniques

Instructions: In addition to the General techniques, the iOS techniques in this section represent a technique or combination of techniques deemed sufficient for meeting this checkpoint. 

Meet G165: Using the default focus indicator for the platform... with the following:

Meet G195: Using an author-supplied, highly visible focus indicator with the following:

Notes: iOS supports visual focus when VoiceOver is active. iOS supports the caret in editable fields regardless of VoiceOver use.

Hybrid Notes: When VoiceOver is active, mobile Safari displays a solid black line around elements having focus (including text elements). When a text field receives focus, mobile Safari initially displays a solid black line around the field. When the text field is double tapped, mobile Safari displays the caret in the field to indicate that the field has focus.

Set the accessibility attribute of controls

When using the standard iOS controls, developers must set the accessibility attribute of the control. In Interface Builder, this is done by selecting the Accessibility checkbox Enabled. This is found on the Identity Inspector tab.

Accessibility can be enabled programmatically with the setIsAccessibilityElement and setAccessibilityLabel methods:

[self.myButton setIsAccessibilityElement:YES];
[self.myButton setAccessibilityLabel: @"label text for button"];

Implementing the UI Accessibility Protocol and providing focus

Software that creates custom controls must implement the UI Accessibility Protocol and provide focus location. Developers should refer to the Accessibility Programming Guide for iOS.

Eclipse techniques

There are no specific Eclipse techniques for this checkpoint. Refer to the General techniques section.

Windows-based (MSAA+IA2) techniques

There are no specific Windows-based (MSAA+IA2) techniques for this checkpoint. Refer to the General techniques section.


Most links in this checklist reside outside ibm.com at the Web Content Accessibility Guidelines (WCAG) 2.0. W3C Recommendation 11 December 2008: http://www.w3.org/TR/WCAG20/

Copyright © 1994-2017 World Wide Web Consortium, (Massachusetts Institute of Technology, European Research Consortium for Informatics and Mathematics, Keio University, Beihang University). All Rights Reserved.

Copyright © 2001, 2017 IBM Corporation