What does WCAG stand for?
Web content accessibility guidelines
What is the current version of WCAG?
2.2
What does UAAG stand for?
User Agent Accessibility Guidelines
What is the purpose of UAAG?
The “User Agent Accessibility Guidelines” provide guidelines for browsers, media players, and other “user agents”.
The User Agent Accessibility Guidelines (UAAG) documents explain how to make user agents accessible to people with disabilities. User agents include browsers, browser extensions, media players, readers and other applications that render web content. Some accessibility needs are better met in the browser than in the web content, such as text customization, preferences, and user interface accessibility. A user agent that follows UAAG 2.0 will improve accessibility through its own user interface and its ability to communicate with other technologies, including assistive technologies (software that some people with disabilities use to meet their requirements). All users, not just users with disabilities, will benefit from user agents that follow UAAG 2.0.
What does ATAG stand for?
Authoring Tool Accessibility Guidelines
What is the purpose of ATAG?
The “Authoring Tool Accessibility Guidelines” provide guidelines for tools and services that allow authors to create content such as WYSIWYG tools, blog authoring or media creation apps.
Authoring Tool Accessibility Guidelines (ATAG) explains how to:
make the authoring tools themselves accessible, so that people with disabilities can create web content, and help authors create more accessible web content — specifically: enable, support, and promote the production of content that conforms to Web Content Accessibility Guidelines (WCAG).
What are WCAG 2.2 success criteria
WCAG 2.2 success criteria are written as testable statements that are not technology-specific
What are the 4 WCAG princples?
P.O.U.R.
Perceivable - Information and user interface components must be presentable to users in ways they can perceive.
This means that users must be able to perceive the information being presented (it can’t be invisible to all of their senses)
Operable - User interface components and navigation must be operable.
This means that users must be able to operate the interface (the interface cannot require interaction that a user cannot perform)
Understandable - Information and the operation of user interface must be understandable.
This means that users must be able to understand the information as well as the operation of the user interface (the content or operation cannot be beyond their understanding)
Robust - Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.
This means that users must be able to access the content as technologies advance (as technologies and user agents evolve, the content should remain accessible)
What does the P in POUR stand for?
Perceivable
Information and user interface components must be presentable to users in ways they can perceive.
This means that users must be able to perceive the information being presented (it can’t be invisible to all of their senses)
What does the O in POUR stand for?
Operable - User interface components and navigation must be operable.
This means that users must be able to operate the interface (the interface cannot require interaction that a user cannot perform)
What does the U in POUR stand for?
Understandable - Information and the operation of user interface must be understandable.
This means that users must be able to understand the information as well as the operation of the user interface (the content or operation cannot be beyond their understanding)
What does the R in POUR stand for?
Robust - Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.
This means that users must be able to access the content as technologies advance (as technologies and user agents evolve, the content should remain accessible)
Explain 1.1 Text Alternatives
Provide text alternatives for any non-text content so that it can be changed into other forms people need, such as large print, braille, speech, symbols or simpler language.
<p>Rating: <img src="star-filled" alt="3 out of 5 stars"> <img src="star-filled" alt=""> <img src="star-filled" alt=""> <img src="star-empty" alt=""> <img src="star-empty" alt=""> </p> What is this an example of?
Guideline 1.1 – Text Alternatives
1.1.1 Non-text Content Level A
Sufficient technique G196: Using a text alternative on one item within a group of images that describes all items in the group
By giving one image an alt that described the entire rating and proving an empty alt for the other images AT will only read out the necessary label while skipping over the empty images
In SC 1.1.1 Non-text Content (Level A) how should a CAPTCHA be handled?
If the purpose of non-text content is to confirm that content is being accessed by a person rather than a computer, then text alternatives that identify and describe the purpose or the non-text content are provided.
Alternative forms of CAPTCHA using output modes for different types of sensory perception are provided to accommodate different disabilities.
What are some ways to help users work around CAPTCHA?
- Provide more than two modalities of CAPTCHA to accommodate multiple types of disabilities
- Provide access to a human customer service representative who can bypass CAPTCHA access
- Not requiring CAPTCHAs for authorized users
What is an example of making ASCII art accessible?
Wrap the ASCII art in a div with an aria-label/aria-description and role of “img”.
Explain 1.4.2 Audio Control
Autoplaying sounds of +3 sec in length can be paused/stopped and have independent volume control.
What is the minimum contrast requirement for normal text to meet AA and AAA?
4.5:1 for AA (large text 3:1)
7:1 for AAA (large text 4.5:1)
1.4.7 Low or no background audio
What is the minimum dB difference between foreground and background sound in audio that is mostly speech?
Background sound should be at least 20dB lower than foreground
1.4.12 Text Spacing
How much line-height should the client allow without loss in functionality?
line-height should be able to be set to at least 1.5 font-size.
1.3.2 Meaningful Sequence
In an English LTR text, how can you make sure that an inserted RTL fragment has the exclamation mark in the correct position?
eg.The title is "مفتاح معايير الويب!" in Arabic.
By placing a RTL mark right after the exclamation mark:
left-to-right mark: ‎ or ‎ (U+200E) right-to-left mark: ‏ or ‏ (U+200F)
What is the minimum font-size required to be qualified as large-scale text that can have a 3:1 contrast ratio.
At least 18 point or 14 point bold or font size that would yield equivalent size for Chinese, Japanese and Korean (CJK) fonts
How large should you be able to resize text without losing access to content or functionality?
200%
