WCAG 2.2 - Operable Flashcards
What was meant by operable?
User interface components navigation must be operable
Guideline 2.1
Guideline 2.1 Keyboard Accessible: Make all functionality available form a keyboard
SC 2.1.1 Keyboard A
All functionality of the content is operable through a keyboard interface without requiring specific timings for individual keystrokes, except where the underlying function requires input that depends on the path of the user’s movement and not just the endpoints.
SC 2.1.2 No Keyboard Trap: A
If keyboard focus can be moved to a component of the page using a keyboard interface, then focus can be moved away from that component using only a keyboard interface, and, if it requires more than unmodified arrow or tab keys or other standard exit methods, the user is advised of the method for moving focus away.
SC 2.1.3 Keyboard (No Exception) - Level AAA
All functionality of the content is operable through a keyboard interface without requiring specific timings for individual keystrokes.
SC 2.1.4 Character Key Shortcuts: A
If a keyboard shortcut is implemented in content using only letter (including upper- and lower-case letters), punctuation, number, or symbol characters, then at least one of the following is true:
- Turn off: A mechanism is available to turn the shortcut off;
- Remap: A mechanism is available to remap the shortcut to include one or more non-printable keyboard keys (e.g., Ctrl, Alt);
- Active only on focus: The keyboard shortcut for a user interface component is only active when that component has focus.
https://learning.edx.org/course/course-v1:W3Cx+WAI0.1x+3T2019/block-v1:W3Cx+WAI0.1x+3T2019+type@sequential+block@6e4c1abff9594e6a8f5138b1ade5c4cf/block-v1:W3Cx+WAI0.1x+3T2019+type@vertical+block@b66c948dde3a42bfbf15ca7d553032ee
https://www.w3.org/WAI/fundamentals/accessibility-principles/#keyboard
Guideline 2.2
Guideline 2.2 Enough Time: Provide users enough time to read and use content
SC 2.2.1 Timing Adjustable A
For each time limit that is set by the content, at least one of the following is true:
Turn off: The user is allowed to turn off the time limit before encountering it; or
Adjust: The user is allowed to adjust the time limit before encountering it over a wide range that is at least ten times the length of the default setting; or
Extend: The user is warned before time expires and given at least 20 seconds to extend the time limit with a simple action (for example, “press the space bar”), and the user is allowed to extend the time limit at least ten times; or
Real-time Exception: The time limit is a required part of a real-time event (for example, an auction), and no alternative to the time limit is possible; or
Essential Exception: The time limit is essential and extending it would invalidate the activity; or
20 Hour Exception: The time limit is longer than 20 hours.
SC 2.2.2 Pause, Stop, Hide A
For moving, blinking, scrolling, or auto-updating information, all of the following are true:
Moving, blinking, scrolling: For any moving, blinking or scrolling information that (1) starts automatically, (2) lasts more than five seconds, and (3) is presented in parallel with other content, there is a mechanism for the user to pause, stop, or hide it unless the movement, blinking, or scrolling is part of an activity where it is essential; and
Auto-updating: For any auto-updating information that (1) starts automatically and (2) is presented in parallel with other content, there is a mechanism for the user to pause, stop, or hide it or to control the frequency of the update unless the auto-updating is part of an activity where it is essential.
SC 2.2.3 No Timing - Level AAA
Timing is not an essential part of the event or activity presented by the content, except for non-interactive synchronized media and real-time events.
SC 2.2.4 Interruptions - Level AAA
Interruptions can be postponed or suppressed by the user, except interruptions involving an emergency.
SC 2.2.5 Re-authenticating - Level AAA
When an authenticated session expires, the user can continue the activity without loss of data after re-authenticating.
SC 2.2.6 Timeouts - Level AAA
Users are warned of the duration of any user inactivity that could cause data loss, unless the data is preserved for more than 20 hours when the user does not take any actions.
https://learning.edx.org/course/course-v1:W3Cx+WAI0.1x+3T2019/block-v1:W3Cx+WAI0.1x+3T2019+type@sequential+block@6e4c1abff9594e6a8f5138b1ade5c4cf/block-v1:W3Cx+WAI0.1x+3T2019+type@vertical+block@3b020caf4f38401fbe71f056a6fefc84
Guideline 2.3
Guideline 2.3 Seizures and Physical Reactions: Do not design content in a way that is know to cause seizures or physical reactions.
SC 2.3.1 Three Flashed or Below Threshold: A
Web pages do not contain anything that flashes more than three times in any one second period, or the flash is below the general flash and red flash thresholds.
SC 2.3.2 Three Flashes: Level AAA
Web pages do not contain anything that flashes more than three times in any one second period.
2.3.3 Animation From Interactions: Level AAA
Motion animation triggered by interaction can be disabled, unless the animation is essential to the functionality or the information being conveyed.
https://learning.edx.org/course/course-v1:W3Cx+WAI0.1x+3T2019/block-v1:W3Cx+WAI0.1x+3T2019+type@sequential+block@6e4c1abff9594e6a8f5138b1ade5c4cf/block-v1:W3Cx+WAI0.1x+3T2019+type@vertical+block@dbadcb43f04c43749e0729d7393d7db6
https://www.w3.org/WAI/fundamentals/accessibility-principles/#safe
https://trace.umd.edu/peat/
Guideline 2.4
Guideline 2.4 Navigable: Provide ways to help user navigate, find content, and determine they are
SC 2.4.1 Bypass Blocks- Level A
A mechanism is available to bypass blocks of content that are repeated on multiple Web pages. Ex: Skip content link
SC 2.4.2 Page Titled - Level A
Web pages have titles that describe topic or purpose.
SC 2.4.3 Focus Order - Level A
If a Web page can be navigated sequentially and the navigation sequences affect meaning or operation, focusable components receive focus in an order that preserves meaning and operability.
SC 2.4.4. Link Purpose (In Context)- Level A
The purpose of each link can be determined from the link text alone or from the link text together with its programmatically determined link context, except where the purpose of the link would be ambiguous to users in general.
SC 2.4.5 Multiple Ways -Level AA
More than one way is available to locate a Web page within a set of Web pages except where the Web Page is the result of, or a step in, a process.
SC 2.4.6 Headings and Labels - Level AA
Headings and labels describe topic or purpose.
SC 2.4.7 Focus Visible- Level AA
Any keyboard operable user interface has a mode of operation where the keyboard focus indicator is visible.
SC 2.4.8 Location - Level AAA
Information about the user’s location within a set of Web pages is available.
SC Link Purpose (Link Only)- Level AAA
ection headings are used to organize the content.
Note 1: “Heading” is used in its general sense and includes titles and other ways to add a heading to different types of content.
Note 2: This success criterion covers sections within writing, not user interface components. User Interface components are covered under Success Criterion 4.1.2.
SC 2.4.11 Focus Not Obscured (Minimum) - Level AA(Added in 2.2)
When a user interface component receives keyboard focus, the component is not entirely hidden due to author-created content.
Note 1: Where content in a configurable interface can be repositioned by the user, then only the initial positions of user-movable content are considered for testing and conformance of this Success Criterion.
Note 2: Content opened by the user may obscure the component receiving focus. If the user can reveal the focused component without advancing the keyboard focus, the component with focus is not considered hidden due to author-created content.
SC 2.4.12 Focus Not Obscured (Enhanced) Level AAA (Added in 2.2)
When a user interface component receives keyboard focus, no part of the component is hidden by author-created content.
SC 2.4.13 Focus Appearance - Level AAA (Added in 2.2)
hen the keyboard focus indicator is visible, an area of the focus indicator meets all the following:
is at least as large as the area of a 2 CSS pixel thick perimeter of the unfocused component or sub-component, and
has a contrast ratio of at least 3:1 between the same pixels in the focused and unfocused states.
Exceptions:
The focus indicator is determined by the user agent and cannot be adjusted by the author, or
The focus indicator and the indicator’s background color are not modified by the author.
Note 1: What is perceived as the user interface component or sub-component (to determine enclosure or size) depends on its visual presentation. The visual presentation includes the component’s visible content, border, and component-specific background. It does not include shadow and glow effects outside the component’s content, background, or border.
Note 2: Examples of sub-components that may receive a focus indicator are menu items in an opened drop-down menu, or focusable cells in a grid.
Note 3: Contrast calculations can be based on colors defined within the technology (such as HTML, CSS and SVG). Pixels modified by user agent resolution enhancements and anti-aliasing can be ignored.
https://learning.edx.org/course/course-v1:W3Cx+WAI0.1x+3T2019/block-v1:W3Cx+WAI0.1x+3T2019+type@sequential+block@6e4c1abff9594e6a8f5138b1ade5c4cf/block-v1:W3Cx+WAI0.1x+3T2019+type@vertical+block@e90df0b2b0ea41fb9f294faf1a37e1f3
https://www.w3.org/WAI/fundamentals/accessibility-principles/#navigable
Guideline 2.5
Guideline 2.5 Input Modalities: Make it easier for users to operate functionality through various input beyond keyboard
SC 2.5.1 Pointer Gestures - Level A (Added in 2.1)
All functionality that uses multipoint or path-based gestures for operation can be operated with a single pointer without a path-based gesture, unless a multipoint or path-based gesture is essential.
SC 2.5.2 Pointer Cancellation - Level A (Added in 2.1)
For user interface components with labels that include text or images of text, the name contains the text that is presented visually.
No Down-Event: The down-event of the pointer is not used to execute any part of the function;
Abort or Undo: Completion of the function is on the up-event, and a mechanism is available to abort the function before completion or to undo the function after completion;
Up Reversal: The up-event reverses any outcome of the preceding down-event;
Essential: Completing the function on the down-event is essential.
SC 2.5.3 Label in Name- Level A(Added in 2.1)
For user interface components with labels that include text or images of text, the name contains the text that is presented visually.
2.5.4 Motion Actuation - Level A(Added in 2.1)
Functionality that can be operated by device motion or user motion can also be operated by user interface components and responding to the motion can be disabled to prevent accidental actuation, except when:
Supported Interface: The motion is used to operate functionality through an accessibility supported interface;
Essential: The motion is essential for the function and doing so would invalidate the activity.
SC 2.5.5 - Target Size (Enhanced)
Level AAA(Added in 2.1)
The size of the target for pointer inputs is at least 44 by 44 CSS pixels except when:
Equivalent: The target is available through an equivalent link or control on the same page that is at least 44 by 44 CSS pixels;
Inline: The target is in a sentence or block of text;
User Agent Control: The size of the target is determined by the user agent and is not modified by the author;
Essential: A particular presentation of the target is essential to the information being conveyed.
SC 2.5.7 Dragging Movements Level AA(Added in 2.2)
All functionality that uses a dragging movement for operation can be achieved by a single pointer without dragging, unless dragging is essential or the functionality is determined by the user agent and not modified by the author.
Note: This requirement applies to web content that interprets pointer actions (i.e. this does not apply to actions that are required to operate the user agent or assistive technology).
SC 2.5.8 Target Size (Minimum) - Level AA(Added in 2.2)
The size of the target for pointer inputs is at least 24 by 24 CSS pixels, except where:
- Spacing: Undersized targets (those less than 24 by 24 CSS pixels) are positioned so that if a 24 CSS pixel diameter circle is centered on the bounding box of each, the circles do not intersect another target or the circle for another undersized target;
- Equivalent: The function can be achieved through a different control on the same page that meets this criterion;
- Inline: The target is in a sentence or its size is otherwise constrained by the line-height of non-target text;
- User agent control: The size of the target is determined by the user agent and is not modified by the author;
- Essential: A particular presentation of the target is essential or is legally required for the information being conveyed.
Note 1: Targets that allow for values to be selected spatially based on position within the target are considered one target for the purpose of the success criterion. Examples include sliders, color pickers displaying a gradient of colors, or editable areas where you position the cursor.
Note 2: For inline targets the line-height should be interpreted as perpendicular to the flow of text. For example, in a language displayed vertically, the line-height would be horizontal.
https://learning.edx.org/course/course-v1:W3Cx+WAI0.1x+3T2019/block-v1:W3Cx+WAI0.1x+3T2019+type@sequential+block@6e4c1abff9594e6a8f5138b1ade5c4cf/block-v1:W3Cx+WAI0.1x+3T2019+type@vertical+block@7149ecf9f5a44045a6798b71e40544d8
https://www.w3.org/WAI/fundamentals/accessibility-principles/#modalities
If all functionality of a webpage works using only a keyboard, that means it can also be used with which of the following assistive technology devices? (Check all that apply.)
- Speech input device
-On-screen keyboard - Screen reader
- Screen magnifier
- Speech input device
- On-screen keyboard
- Screen reader
A screen magnifier makes part of a webpage larger and does not require webpage elements to work with a keyboard.
Show answer
Submit
A webpage component should not require a computer mouse (True or False)
True
There should be multiple input modalities for each element on a webpage - you should not require a user to use only one method.
When is a component not keyboard accessible? (Check all that apply.)
- when a user cannot move out of a component
- when a user cannot move into a component
- when a component requires a keyboard
- when a user cannot move out of a component
- when a user cannot move into a component
When a keyboard user gets stuck or cannot get out of a component, that is considered not keyboard accessible.
Which of the following groups of people can benefit from having enough time? (Check all that apply)
- people with a learning disability
- people using a switch control
- people whose native language is different than the language of the page
- people with attention disorders
All of the above
Many people can benefit from having enough time.
Providing clear information about time limits - and instructions for extending it - is essential for many people. (True or False)
True
Content should not flash or blink more than three times per second. (True or False)
True
When content flashes or blinks faster than that, there is a risk that you could induce a seizure or make someone ill.
Fast moving animations can make people sick or trigger seizures. (True or False)
True
Avoid fast moving elements on your website, so you don’t inadvertently make someone ill.
Animated media must not auto-play for more than ten seconds. (True or False)
False
Animated media must not auto-play for more than five seconds.
Which of the two titles below is better?
Acme Web Solutions, Inc. | Contact Us
Contact Us | Acme Web Solutions, Inc.
Contact Us | Acme Web Solutions, Inc.
It is important to front-load important information on a page title.