You are on page 1of 30

WCAG WCAG # Level Check VISUAL Ensure that ALL CAPS is not used for long sections of text

# Set page to 200% zoom and make sure all elements are intact and usable without any additional horizontal scrolling#

PDT

QA Integratio

x x

1.4.4

AA

2.4.4

2.4.7

AA

Does all link text make sense on its own, and imply where it will take the user? Are text blocks shorter than 80 characters per line? Is it visually apparent which page element has the current keyboard focus? Make sure there is some visual cue as to where the focus is at any given moment Form elements that require a specific format, value, or length are appropriately explained through help text or form field layout. Are there sufficient instructions and cues in context to help in form completion and submission? Are all fields that should be required indicated as such? Redundant coding - meaning isn't conveyed solely by one type of sensory characteristic, such as visual (color, size, shape, location, orientation) - meaning can be programmatically determined Color: is not the only visual means of conveying info, including prompting a response, action, or distinguishing a visual element Contrast ratio of at least 4.5:1 except for large scale text (3:1), No minimum ratio for logotypes or things that are decorative (inactive UI)

x x x x x

3.3.2

x x

1.3.3

1.4.1

1.4.3

AA

1.4.5 2.4.2 2.4.6 2.4.5 3.3.1

AA A AA AA A

Text used instead of images of text except for customizable images (by user) and essential images (logotype) Web pages have titles that describe topic or purpose Headings and labels describe topic or purpose More than 1 way to locate a web page within a set of pages, except where the page is the result of, or step in, a process If an input error is detected, the item that is in error is identified and the error is described to the user in text If error is automatically detected & suggestions for correction are known, then suggestions are provided to the user (unless it would jeopardize security or purpose of the content). For web pages that cause legal commitments or financial transactions, that modify or delete user-controllable data in data storage systems, or that submit user test responses, at least 1 of following is true: 1-is reversible, 2-data is checked for errors & user is provided opportunity to correct, 3-mechanism is available to review, confirm & correct before finalizing submission MANUAL

x x x x x

3.3.3

AA

3.3.4

AA

Manually check to ensure all user-manipulable aspects can be accessed without a mouse, using keyboard only.

2.1.1 2.1.2

A A No keyboard trap: user focus can be moved to and away from a component of the page Make sure there are no focus stops to elements that can not be found on the screen Is the tabbing order the same as the visual order? Does the order make sense for the task the user is expected to perform? Does the spacebar activate the following controls when they have input focus: checkboxes, radio buttons? Focus: when any component receives focus, it does not initiate a change of context Input: changing the setting of any user interface component doesn't automatically change the context unless the settings change process advises the user of the behavior before invoking the component Navigation mechanisms that are repeated on multiple web pages are in the same consistent order unless a change is initiated by the end user

x x x x x

x x x

1.3.2 2.4.3

A A

x x x

3.2.1

3.2.2

3.2.3

AA

3.2.4

AA

4.1.1

4.1.2

Components that have same functionality within set of web pages are identified consistently Parsing: in content implemented using markup languages, elements have complete start and end tags, elements are nested according to their specifications, elements do not contain duplicate attributes, & IDs are unique (except where specs allow these features) Name, role, value: for all UI components, the name & role can be programmatically determined; states, properties & values set by the user can be programmatically set; and notification of changes to these items is available to user agents, including assistive technologies. SCREEN READER Use a screen reader with the page open to ensure that the page can be read/spoken by the screenreader The navigation order of links, form elements, etc. is logical and intuitive. Does the order make sense for the task the user is expected to perform? Is the reading order correct? Is the reading order the same as the visual order? Is the page broken into appropriate groups of content? Is this reflected in the hierarchy of headers (whether off-screen or onscreen)? Are all items visually presented as headers also coded as such?

n/a n/a n/a 1.3.2 1.3.2 1.3.1

A A

x x

n/a

1.1.1 n/a

Is there appropriate alt text for images and unlabeled buttons (i.e. icon-only buttons)? Any fields that are part of a field group, each input has its own offscreen label. Provide a way to bypass blocks of content that are repeated on multiple pages If an input error is detected, the item that is in error is identified and the error is described to the user in text Name, role, value: for all UI components, the name & role can be programmatically determined; states, properties & values set by the user can be programmatically set; and notification of changes to these items is available to user agents, including assistive technologies.

x x

x x

2.4.1 3.3.1

A A

4.1.2

QA System Level UX Core Notes

Link purpose (in context): 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

Labels or instructions are provided when content requires user input

Not likely to be in build unless UXD supplies image. Can be checked by seeing if part of word can be selected using cursor. If not, it's an image of text rather than rendered text.

Also noted in Screen Reader section. This is primarily about providing explicit and meaningful error messaging: http://www.w3.org/TR/UNDERSTANDINGWCAG20/minimize-error-suggestions.html

The KRAD framework provides both client-side and server-side error validation, which meets this critierium (#2).

Can all links, controls, and buttons be activated with the enter key? Does the spacebar activate the following controls when they have input focus: checkboxes, radio buttons? Does the escape key close dialogs?

@UX: What do we do about context switchers, which are placed above the breadcrumbs on some pages? This calls for general UI consistency: http://www.w3.org/TR/UNDERSTANDINGWCAG20/consistent-behavior-consistentfunctionality.html. Adherence to UIM will allow PDTs to meet this critieria.

@UX: Is this done using code checkers? @UX: Is this what ARIA covers? And is this done using code checkers?

Also noted in Screen Reader section.

x x x x x

x x A "Skip to main content" link should be included as part of the applicaition boilerplate

x x

WCAG 2.0 Accessibility Criteria


REQS FOR RICE ALL LEVEL A & SOME AA: TEXT ALTERNATIVES Required (A) TIME-BASED MEDIA Review assumption of none in KRAD UI at this time NA at this time NA at this time NA at this time NA at this time NA at this time NA at this time Criteria 1.1 Must Support Level A Should Support Level AA May Support Level AAA

Text Alternatives: Provide text alternatives for any non-text content. 1.1.1

1.2

Time-based media: Provide alternatives for:

1.2.1 1.2.2 1.2.3 1.2.4 1.2.5

1.2.6

NA at this time 1.2.7 NA at this time 1.2.8 NA at this time ADAPTABLE CONTENT Required (A) Required (A) 1.3 1.2.9

Adaptable: Content can be presented in different ways without losing info 1.3.1 1.3.2

Required (A) DISTINGUISHABLE CONTENT Required (A)

1.3.3

1.4

Distinguishable: Make it easier for users to see & hear content including s 1.4.1

NA at this time (assuming no audio) Required (AA) Required (AA) Required (AA) No

1.4.2

1.4.3 1.4.4 1.4.5 1.4.6

NA at this time

1.4.7

Consider

1.4.8

Consider

1.4.9

KEYBOARD ACCESSIBLE Required (A) Required (A)

2.1

Keyboard Accessible: 2.1.1 2.1.2

Consider 2.1.3 TIMING-SENSITIVE ASPECTS - Review assumption of none in KRAD UI at this time NA at this time NA at this time 2.2 Enough time: provide users enough time to read and use content

2.2.1 2.2.2

NA at this time 2.2.3 NA at this time Consider requiring this one! (AAA) FLASHING ASPECTS: Review assumption of none in KRAD UI at this time NA at this time 2.2.4

2.2.5 2.3 Seizures: Do not design content in a way that is known to cause seizures

2.3.1

NA at this time NAVIGATION Required (A) Required (A) Required (A) 2.4

2.3.2 Navigable: Provide ways to help users navigate, find content, and determ 2.4.1 2.4.2 2.4.3

Required (A) Required (AA) Required (AA) Required (AA) Consider requiring this one! (AAA) Consider requiring this one! (AAA)

2.4.4 2.4.5 2.4.6 2.4.7 2.4.8

2.4.9 Consider requiring this one! (AAA) READABLE 3.1 2.4.10 Readable: content is readable & understandable 3.1.1 NA at this time Consider requiring this one! (AAA) Consider requiring this one! (AAA) 3.1.2

3.1.3 3.1.4

No 3.1.5 Consider requiring this one! (AAA) PREDICTABLE Required (A) 3.2 3.1.6 Predictable: web pages appear & operate in predictable ways 3.2.1

Required (A)

3.2.2

Required (AA) Required (AA) Consider requiring this one! (AAA) HELP & ERROR HANDLING Required (A) Required (A) Required (AA) 3.3

3.2.3 3.2.4

3.2.5 Help users avoid and correct mistakes 3.3.1 3.3.2 3.3.3

Required (AA)

3.3.4

Consider requiring this one! (AAA)

3.3.5

Consider requiring this one! (AAA) 3.3.6 COMPATIBLE 4.1

Compatible: maximize compatibility with current & future user agents, inc

Required (A)

4.1.1

Required (A)

4.1.2

http://www.w3.org/WAI/WCAG20/q uickref/Overview.php
Conformance Level/Priority Descriptions
LEVEL A - Priority 1 (25 criteria)

e text alternatives for any non-text content. All non-text content that is presented to user has a text alternative. See WCAG link above for details on exceptions.

vide alternatives for:

Alternative provided for pre-recorded Audio-only and Video-only Captions provided for pre-recorded audio in synchronized media (except where media is alternative for displayed text) Alternative provided for synchronized media (e.g., audio description of video segments except where video is alternative for displayed text) (Level AA)

(Level AA) (Level AAA)

(Level AAA)

(Level AAA) (Level AAA)

be presented in different ways without losing info or structure Info & relationships: info, structure & relationships can be programmatically determined or are available in text Meaningful sequence: a correct reading sequence can be programmatically determined Sensory characteristics: redundant coding - meaning isn't conveyed solely by one type of sensory characteristic, such as visual (size, shape, location, orientation) or sound - meaning can be programmatically determined easier for users to see & hear content including separating foreground from background Color: is not the only visual means of conveying info, including prompting a response, action, or distinguishing a visual element

Audio control: a mechanism must be available to pause or stop audio content, or to control the volume independently from the overall system volume

(Level AA) (Level AA) (Level AA) (Level AAA)

(Level AAA)

(Level AAA)

(Level AAA)

All functionality & info is operable through a keyboard interface w/o requiring specific timings for individual keystroke (see WCAG link above for exceptions) No keyboard trap: user focus can be moved to and away from a component of the page

(Level AAA)

sers enough time to read and use content Timing adjustable: time limit can be turned off, adjusted or extended by user (see WCAG link above for exceptions) User can pause, stop, or hide any moving, blinking, scrolling, or auto-updating info

(Level AAA) (Level AAA)

(Level AAA)

content in a way that is known to cause seizures Do not include anything that flashes more than 3 times in a second, that violates general flash and red flash levels (affected by frequency, luminance, area, & color).

(Level AAA) s to help users navigate, find content, and determine where they are Provide a way to bypass blocks of content that are repeated on multiple pages Web pages have titles that describe topic or purpose When sequential navigation sequences affect meaning or operation, focusable components receive focus in an order that preserves meaning & operability Link purpose (in context): 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 (Level AA) (Level AA) (Level AA) (Level AAA)

(Level AAA) (Level AAA)

adable & understandable the default human language of each web page can be programmatically-determined

(Level AA)

(Level AAA) (Level AAA)

(Level AAA)

(Level AAA) appear & operate in predictable ways Focus: when any component receives focus, it does not initiate a change of context Input: changing the setting of any user interface component doesn't automatically change the context unless the settings change process advises the user of the behavior before invoking the component

(Level AA) (Level AA)

(Level AAA)

rrect mistakes If an input error is detected, the item that is in error is identified and the error is described to the user in text Labels or instructions are provided when content requires user input

(Level AA)

(Level AA) (Level AAA)

(Level AAA)

compatibility with current & future user agents, including assistive technologies

Parsing: in content implemented using markup languages, elements have complete start and end tags, elements are nested according to their specifications, elements do not contain duplicate attributes, & IDs are unique (except where specs allow these features) Name, role, value: for all UI components, the name & role can be programmatically determined; states, properties & values set by the user can be programmatically set; and notification of changes to these items is available to user agents, including assistive technologies.

Conformance Level/Priority Descriptions


LEVEL AA - Priority 2 (13 criteria)

(See level A)

(See level A) (See level A) (See level A) Captions provided for all live audio (A=for all pre-recorded audio, AA=also for all live audio) Audio descriptions provided for all pre-recorded video segments (synchronized with other sound in the video, unless the existing audio explains all w/o needing the visual) (Level AAA)

(Level AAA)

(Level AAA) (Level AAA)

e (See level A) (See level A)

(See level A)

oreground from background (See level A)

(See level A) Contrast ratio of at least 4.5:1 except for large scale text (3:1), No minimum ratio for logotypes or things that are decorative (inactive UI) Text can be resized up to 200% without assistive technologies (except for captions & images of text) Text used instead of images of text except for customizable images (by user) and essential images (logotype) (Level AAA)

(Level AAA)

(Level AAA)

(Level AAA)

(See level A) (See level A)

(Level AAA)

(See level A) (See level A)

(Level AAA) (Level AAA) (Level AAA)

(See level A)

(Level AAA)

hey are (See level A) (See level A) (See level A)

(See level A) More than 1 way to locate a web page within a set of pages, except where the page is the result of, or step in, a process Headings and labels describe topic or purpose Any keyboard operable UI has mode of operation where keyboard focus indicator is visible (Level AAA)

(Level AAA)

(Level AAA)

(See level A) Multiple languages: for docs with multiple language (passages or words) the language can be identified by assistive technologies (so are pronounced appropriately) (Level AAA) (Level AAA)

(Level AAA)

(Level AAA)

(See level A)

(See level A) Navigation mechanisms that are repeated on multiple web pages are in the same consistent order unless a change is initiated by the end user Components that have same functionality within set of web pages are identified consistently (includes alt text on ) (Level AAA)

(See level A) (See level A) If error is automatically detected & suggestions for correction are known, then suggestions are provided to the user (unless it would jeopardize security or purpose of the content). For web pages that cause legal commitments or financial transactions, that modify or delete user-controllable data in data storage systems, or that submit user test responses, at least 1 of following is true: 1-is reversible, 2-data is checked for errors & user is provided opportunity to correct, 3-mechanism is available to review, confirm & correct before finalizing submission (Level AAA)

(Level AAA)

istive technologies

(See level A)

(See level A)

ons
LEVEL AAA - Priority 3 (23 criteria)

(See level A)

(See level A) (See level A) (See level A) (See level AA) (See level AA) Sign language interpretation is provided for all prerecorded audio content in synchronized media. Where pauses in foreground audio are insufficient to allow audio descriptions to convey the sense of the video, extended audio description is provided for all prerecorded video content in synchronized media. An alternative for time-based media is provided for all prerecorded synchronized media and for all prerecorded videoonly media. An alternative for time-based media that presents equivalent information for live audio-only content is provided

(See level A) (See level A)

(See level A)

(See level A)

(See level A)

(See level AA) (See level AA) (See level AA) Contrast ratio of at least 7:1 except for large-scale text (4.5:1), No minimum ratio for logotypes or things that are decorative (inactive UI). Low or no background audio: For prerecorded audio-only that (1) contains primarily speech in the foreground, (2) is not an audio CAPTCHA or audio logo, and (3) is not vocalization intended to be primarily musical expression such as singing or rapping, at least one of the following is true: the audio doesn't have background sounds, or the background sounds can be turned off, or the background sounds area at least 20 decibels lower than the foreground speech content (4 times quieter). Visual presentation of blocks of text: foreground and background colors can be selected by user, width is no more than 80 characters or glyphs, text is not justified to both right and left margins, line spacing (leading) is at least 1.5 within paragraphs & 1.5 times larger than that between paragraphs, text can be resized without assistive technology up to 200 percent in a way that doesn't require user to scroll horizontally to read a line of text on a full-screen window. Images of text: only used for pure decoration, essential images - inlcudes logotypes. (Same as1.4.5 except no exceptions via user-customization are allowed.)

(See level A) (See level A) All functionality of the content is operable through a keyboard interface without requiring specific timings for individual keystrokes. Same as 2.1.1 except no exceptions are allowed.

(See level A) (See level A)

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. Interruptions can be postponed or suppressed by the user, except interruptions involving an emergency. When an authenticated session expires, the user can continue the activity without loss of data after re-authenticating.

(See level A) Web pages do not contain anything that flashes more than three times in any one second period, over any area of the screen (regardless of general and red flash levels). (See level A) (See level A) (See level A)

(See level A) (See level AA) (See level AA) (See level AA) Information about the user's location within a set of Web pages is available. Link purpose (link only): A mechanism is available to allow the purpose of each link to be identified from link text alone, except where the purpose of the link would be ambiguous to users in general. Section headings are used to organize the content (within writing, 4.1.2 covers this within UI components).

(See level A) (See level AA) Unusual words: A mechanism is available for identifying specific definitions of words or phrases used in an unusual or restricted way, including idioms and jargon. Abbreviations: A mechanism for identifying the expanded form or meaning of abbreviations is available

Reading level: When text requires reading ability more advanced than the lower secondary education level after removal of proper names and titles, supplemental content, or a version that does not require reading ability more advanced than the lower secondary education level, is available. Pronunciation: A mechanism is available for identifying specific pronunciation of words where meaning of the words, in context, is ambiguous without knowing the pronunciation. (See level A)

(See level A)

(See level AA) (See level AA) Change on request: Changes of context are initiated only by user request or a mechanism is available to turn off such changes

(See level A) (See level A) (See level AA)

(See level AA)

Help: Context-sensitive help is available. Error prevention: For Web pages that require the user to submit information, at least one of the following is true: submissions are reversible, or data is checked and user is provided opportunity to correct them, or a mechanism is available for reviewing, confirming and correcting info before finalizing submission

(See level A)

(See level A)