Accessible Design

Question 1

What’s the minimum color contrast ratio needed between links and text?

Answer 1

3:1 color contrast and there needs to be a visual marker (underline or background color) when the link receives hover or focus

Question 2

What method can be used to distinguish UI components from surrounding content?

A. Providing an outline around the UI component
B. Using a different color for the UI component that has high contrast against the surrounding content
C. Changing the background of the UI component
D. Any of the above methods can be used

Answer 2

D. Any of the above methods can be used

Question 3

What color contrast ratio should small text have for level AAA?

Answer 3

7:1 against the background

Question 4

What color contrast ratio should large text have?

Answer 4

3:1 against the background

Question 5

To aid people with low vision or color deficiencies, the contrast between text and its background must be at least:

A. 3 to 1 for small text and 2 to 1 for large text
B. 5 to 1 for small text and 6.5 to 1 for large text
C. 4.5 to 1 for small text and 3 to 1 for large text
D. 12 to 1 for small text and 8 to 1 for large text

Answer 5

C. 4.5 to 1 for small text and 3 to 1 for large text

Question 6

Enhancing the visual focus indicator benefits which group(s) of users? (Select the most complete answer.)

A. Users who are colorblind
B. Users who have low vision
C. Sighted keyboard users
D. All of the above groups are affected

Answer 6

D. All of the above groups are affected

Question 7

If the text label for an icon is placed visually too far away from the icon, which category of users with a disability will be most affected?

A. Blind users
B. Deaf users
C. Users with low vision
D. Users with colorblindness

Answer 7

C. Users with low vision

Question 8

True or false: For screen reader users, the reading order and focus order are always the same thing.

Answer 8

False

Question 9

Which of the following can impact the reading order and focus order of page content? (Select the most complete answer.)

A. JavaScript DOM manipulation
B. Turning on a screen reader
C. Magnification
D. CSS positioning techniques
E. A and D
F. B and C
G. B and D

Answer 9

E. A and D

A. JavaScript DOM manipulation
D. CSS positioning techniques

Question 10

When the order of content in a webpage’s source code does not match the visual presentation of the content, the following users may find it hard to use the page:

A. Blind users and mouse users
B. Deaf users and deafblind users
C. Keyboard-only users and blind users
D. Source code does not have to match visual presentation.

Answer 10

C. Keyboard-only users and blind users

Question 11

What’s the minimum line spacing within paragraphs?

Answer 11

at least 1.5

Question 12

What should you set spacing between paragraphs to?

Answer 12

at least 1.5 times larger than the line spacing

Question 13

To help people who have trouble keeping their place and following the flow of text when columns of text are too wide, you can do which of the following? (Select the most complete answer.)

A. Use CSS to set a maximum column width of approximately 80 characters.
B. Write in short, simple sentences.
C. Ensure the text on your website reflows as the viewport is narrowed so users can determine the column width that works for them.
D. A and C
E. All of the above

Answer 13

D. A and C

A. Use CSS to set a maximum column width of approximately 80 characters.

C. Ensure the text on your website reflows as the viewport is narrowed so users can determine the column width that works for them.

Question 14

True or false: Paragraph text should be full justified because the neat edges are less distracting for people with reading disorders.

Answer 14

False

justified text creates ‘rivers of whitespace’ that are distracting for people with reading disorders

Question 15

Which of the following CSS methods will effectively hide content such as inactive dialogs from both screen reader users and sighted users? (Select the most complete answer.)

A. display:none
B. visibility:hidden
C. screenreader:hidden
D. A and B
E. All of the above

Answer 15

D. A and B

A. display:none
B. visibility:hidden

Question 16

True or false: An inactive dialog box that is not visible to sighted users must be hidden from blind users to give them an equivalent experience.

Answer 16

True

Question 17

What is Inclusive Design?

Answer 17

A design methodology that seeks to enable and accommodate the full range of human diversity, including a wide spectrum of abilities and disabilities.
The main goal is to create a unified approach to design that enables multiple methods to access the same functionality.

Question 18

What are the 7 Principles of Universal Design?

Answer 18

1. Equitable Use
2. Flexibility in Use
3. Simple and Intuitive Use
4. Perceivable Information
5. Tolerance for Error
6. Low Physical Effort
7. Size and Space for Use

Question 19

True or False: all websites that meet WCAG guidelines are accessible

Answer 19

False

The subjective aspects of accessibility were purposely excluded from the guidelines. Many aspects of cognitive disability access are subjective.

Question 20

True or False: on mobile devices, you can use swipe actions to activate features.

Answer 20

False

swipe actions are used by the screen reading software so they aren’t available for your custom features. Always use click actions.

Question 21

Ensure text on the page can be resized up to ______ without loss of content or function:

A. 1000%
B. 500%
C. 350%
D. 200%

Answer 21

D. 200%

Question 22

The recommended minimum touch target size for touch screen devices is approximately:

A. 4.8mm or 22px
B. 7.2mm or 33px
C. 9.6mm or 44px
D. 10.8mm or 50px

Answer 22

C. 9.6mm or 44px