Answer Key: Self-Tests
Self-Test 1
1. What options are there for submitting assignments? Choose all that apply.
[Incorrect] a. Upload files to the assignment dropbox in Pressbooks.
[Correct] b. Submit a URL to your files on GitHub.
[Incorrect] c. Email your assignment to the instructor.
[Correct] d. Submit a URL to your files on a server you have FTP access to.
[Incorrect] e. Upload files to the assignment DropBox folder.
Feedback: You may submit a URL to your activity files either on GitHub (i.e., GitHub Pages), or on a web server you have FTP access to.
2. Where can you get a copy of the activity files? Choose all that apply.
[Incorrect] a. Downloading from the activity file manager
[Correct] b. Forking and cloning from GitHub
[Correct] c. Downloading from GitHub
[Incorrect] d. Ask the instructor to email them to you
[Incorrect] e. Download them from the assignment DropBox folder
Feedback: You may download the learnaria.github.io repository files from github.com, or you may fork the repository to your own GitHub account and clone them from there into your own development environment.
3. What prerequisite knowledge is needed to be effective with the activities in this resource? Choose all that apply.
[Incorrect] a. No prerequisite knowledge is required.
[Incorrect] b. The ability to write JavaScript
[Correct] c. The ability to read and understand JavaScript
[Correct] d. The ability to read and understand HTML
[Incorrect] e. A strong understanding of WCAG 2
Feedback: Coding experience is strongly recommended but not absolutely necessary to follow along. Your ability to read and understand JavaScript and HTML code will determine your success with the activities in this resource.
4. When working with ChromeVox, what key or key combination can be used to stop it from speaking?
[Incorrect] a. Alt
[Incorrect] b. Cvox + Q
[Incorrect] c. Cvox + D
[Correct] d. Ctrl
[Incorrect] e. Cvox + S
Feedback: The most asked question when using ChromeVox is how to stop it from speaking. Simply press the Ctrl (control) key.
5. When working with ChromeVox, what key or key combination can be used to turn it off, or on.
[Incorrect] a. Esc
[Correct] b. Cvox + A + A
[Incorrect] c. Cvox + Q
[Incorrect] d. Cvox + D
[Incorrect] e. Ctrl + F5
Feedback: The second most asked question is how to turn ChromeVox on or off without having to find your way through Manage Extensions. Press Cvox+A+A to turn the screen reader on or off while using the Chrome web browser.
6. WAI-ARIA is part of HTML5 and will not work when older versions of HTML are being used.
[Incorrect] a. True
[Correct] b. False
Feedback: WAI-ARIA works fine with older versions of HTML, though when validating older HTML, it will produce errors or warnings. These errors or warnings can be safely ignored.
Self-Test 2
1. When creating a registration form for a website, it is important to use role=”form” with the element to ensure screen reader users understand they are entering a form.
[Incorrect] a. True
[Correct] b. False
Feedback: A form element has its semantics defined by default, and thus does not need a WAI-ARIA role defined. When using HTML in a standard way, WAI-ARIA should not be used, with a few exceptions.
2. When talking about WAI-ARIA, we are referring to:
[Incorrect] a. Roles, settings, and properties
[Incorrect] b. Roles, options, and preferences
[Correct] c. Roles, states, and properties
[Incorrect] d. Elements, attributes, and functions
[Incorrect] e. Elements, options, and preferences
Feedback: WAI-ARIA is made up of HTML attributes that define roles, states, and properties.
3. Which of the following are not WAI-ARIA roles? Choose all that apply.
[Incorrect] a. menu
[Incorrect] b. navigation
[Correct] c. aria-label
[Correct] d. tabindex
[Correct] e. aria-describedby
[Correct] f. aria-checked
[Incorrect] g. complementary
[Correct] h. footer
[Incorrect] i. banner
Feedback: Any WAI-ARIA attribute that is prefixed with “aria-” will be a state or property, not a role. The tabindex attribute is a special case, extending tabindex in previous versions of HTML, but it is not a role. Footer is not defined in WAI-ARIA.
4. WAI-ARIA Properties tend not to change.
[Correct] a. True
[Incorrect] b. False
Feedback: True. States tend to change. Properties do not.
5. WAI-ARIA States tend not to change.
[Incorrect] a. True
[Correct] b. False
Feedback: False. States do tend to change.
6. Which of the following tend to be used dynamically, with values updated using scripting? Choose all that apply.
[Incorrect] a. role=”menu”
[Correct] b. aria-disabled=”true”
[Incorrect] c. aria-haspopup=”true”
[Incorrect] d. aria-modal=”true”
[Correct] e. aria-checked=”true”
[Correct] f. aria-expanded=”false”
[Correct] g. aria-hidden=”true”
Feedback: Typically states will be dynamically updated with scripting (aria-disabled, aria-checked, aria-expanded, aria-hidden) while properties tend to be static and do not usually change (aria-haspopup, aria-modal). Roles also tend to be static, and do not require updating values with scripting.
7. ______________ starts with a version that works for everyone, then adds features when they are supported.
[Incorrect] a. Graceful degradation
[Correct] b. Progressive enhancement
Feedback: Progressive enhancements starts with a base version that works for everyone, and are “enhanced” with additional features where they are supported.
8. Generally, which method is preferred?
[Incorrect] a. Graceful degradation
[Correct] b. Progressive enhancement
Feedback: For broadest support, progressive enhancement is generally preferred to ensure that regardless of the technology a person may be using, there will always be a functional version available.
Self-Test 3
1. Which of the following are landmark roles? Choose all that apply.
[Incorrect] a. menu
[Correct] b. navigation
[Incorrect] c. aria-label
[Incorrect] d. tabindex
[Incorrect] e. aria-describedby
[Incorrect] f. aria-checked
[Correct] g. complementary
[Incorrect] h. footer
[Correct] i. banner
Feedback: Navigation, complementary, and banner are landmark roles.
2. Which would usually be the best approach to provide feedback to a screen reader user with a message that an operation just completed was successful or has failed presenting an error message?
[Incorrect] a. aria-live=”polite”
[Correct] b. role=”alert”
[Incorrect] c. role=”alertdialog”
[Incorrect] d. role=”dialog”
[Incorrect] e. aria-modal=”true”
Feedback: Though you could use aria-live=”polite” to present feedback, the best approach is usually to use role=”alert”.
3. Keyboard interaction in web widgets and applications should be (choose all that apply):
[Correct] a. Predictable
[Incorrect] b. Redundant
[Incorrect] c. Easy
[Correct] d. Consistent
[Correct] e. Conventional
Feedback: Keyboard interaction should be predictable, consistent, and conventional.
4. Which of the following WAI-ARIA roles, when active, would disable keyboard access to the file menu in a web browser?
[Correct] a. Application
[Incorrect] b. Menu
[Incorrect] c. Menubar
[Incorrect] d. Navigation
[Incorrect] e. Presentation
Feedback: The application role would disable the browser’s file menu.
5. When role=”presentation” is used on an unordered list element, semantics for which of the following elements would be fully suppressed? Choose all that apply.
<ul role=”presentation”>…</ul>
[Correct] a. UL
[Correct] b. UL>LI
[Incorrect] c. UL>LI>UL
[Incorrect] d. UL>LI>OL
[Incorrect] e. UL>LI>UL>LI
Feedback: Only the semantics of the top level UL and its immediate children will be suppressed. That is, the first level UL and its first level child LIs.
6. Which of the following create live regions that announce changes in the content to screen readers? Choose all that apply.
[Correct] a. role=”alert”
[Correct] b. aria-live=”polite”
[Correct] c. role=”timer”
[Correct] d. role=”log”
[Incorrect] e. role=”live-region”
Feedback: All except the last choice will create live regions. role=”live-region” is not a WAI-ARIA role or live region.
7. Which of the following would be good candidates for a live region? Choose all that apply.
[Incorrect] a. A timer counting down by seconds
[Correct] b. A dynamically injected feedback message
[Correct] c. A news feed from a local news provider
[Correct] d. A Twitter feed that receives occasional updates
[Correct] e. A chat application, for communicating in real time
Feedback: A timer may also be a live region, but counting down by seconds may make the content on the page it is embedded in unusable. A timer counting down by minutes (e.g., minutes until the end of a quiz) would be a better candidate.
