Accessibility and Inclusive Design, Legal, Testing, MultiMedia, Animations and Motion, Tables | Iframe, Device-Independent User Input Methods, HTML5 elements and corresponding ARIA roles, Visual Design and Colors, Lists, Navigation, Images, SVG, and...
What are some Vector image file types?
.ai, .ait, .art, cdr, .cdrw, .cdt, .dlg, .do, .odg
Raster images are. measured in pixels and have the following file types
.jpg, .gif, .png. .tiff, .psd
Name 3 basic caption file formats
.srt. .sbv or.sub and .lrc
What should at least one file format be
.vtt WebVtt
Name 3 advanced caption file formats
.vtt, .smi or .sami and .ttml
What is the amount of time a caption should be visible
1 second or 0.3 seconds per word
What 3 things should be done to make a fake link accessible
1. add ARIA role="link" 2. add tabindex="0" 3.event handler that supports both mouse and keyboard click events
3 Ways you can hide decorative or redundant images
1. null alt tag 2.Aria role = presentation 3. implement image as background image with css
What is the minimum amount of time?
1.5 seconds gaps shorter than this will be jerky
Name 3 Categories of time-based media
1.Audio only 2.Video only 3.Multimedia
Name 4 methods for providing alternatives for time-based media CAST
1.Captions 2.Audio descriptions 3.Sign language 4.Transcripts
Complex images MUST be briefly described using alt text AND MUST have a more complete long description. name 4 ways to provide long descriptions for images
1.in the context of the HTML document itself 2.button that expands a collapsed region that contains the long description 3.Provide a button to open a dialog that contains the long description 4.Provide a link to a long description on another page
Name 5 key concepts for forms
1.labels for form inputs 2.Labels for groups of inputs 3.Instructions and hints 5.Form validation 4.Error prevention
Max number of characters for alt text - although WCAG does not have an actual limit
150 characters
What percentage of the population is disabled
20%
What year did WCAG make official recommendations?
2018 is the year that WCAG became official
What is the default font size for captions
22pt
What is the maximum number of lines for captions?
3 lines is the maximum lines for captions
Animated images MUST NOT flash or flicker more than
3 times per second
Animated images must not flash more than ___ times per second
3 times per second
What should the color ratio be for Large text over 18pt
3 to 1
What should the contrast be for all visual focus indicators
3 to 1
What is the maximum number of characters per line
32 characters
What should the color ratio be for small text 18pt and 14pt bold
4.5 to 1
What should the touch target size be on actionable elements?
44px x 44px with 6px of inactive space
A method to pause, stop or hide any prerecorded video-only content which lasts more than
5 seconds
Automatic playing videos need a pause, stop, hide after how many seconds?
5 seconds
What should the color ratio be for smaller than 18pt text
7 to 1
How many people are in the world?
7.4 billion people in the world
Which 5 elements should a layout table never include?
<caption> <summary> <th> scope and headers
Complex svg must have a
<desc> and must be programmatically associated with the <svg> via aria-labelledby
Screenreader's do not announce text style like
<strong> <em> are not read by screenreader's
It is acceptable for audio content that auto-starts on a web page to play for up to: A. 3 seconds B. 5 seconds C. 10 seconds D. It never acceptable for audio to auto-start on a web page
A. 3 seconds It is acceptable for audio content that auto-starts on a web page to play for up to: A. 3 seconds B. 5 seconds C. 10 seconds D. It never acceptable for audio to auto-start on a web page
The contrast ratio for UI component boundaries must be at least: A. 3 to 1 B. 2.5 to 1 C. 5 to 1 D. 4.5 to 1
A. 3 to 1
Which of the following methods can NOT be used to associate a group label with the fields it labels? A. <fieldset> and <label> B. <fieldset> and <legend> C. Nested fieldsets to denote groups within groups D. role="group" and aria-labelledby
A. <fieldset> and <label>
Which of the following items will be focusable with the tab key? A. A <span> element with tabindex="0" B. A <div> element with tabindex="-1" C. An ARIA link created as follows: <span role="link">
A. A <span> element with tabindex="0" Which of the following items will be focusable with the tab key? A. A <span> element with tabindex="0" B. A <div> element with tabindex="-1" C. An ARIA link created as follows: <span role="link">
When assigning alternative text to actionable icon fonts (buttons or links), which technique is most effective? A. Add aria-label to the button or link B. Add hidden text within the button or link using CSS clip assigned to the surrounding span element C. Add text to an alt attribute in the surrounding span element.
A. Add aria-label to the button or link When assigning alternative text to actionable icon fonts (buttons or links), which technique is most effective? A. Add aria-label to the button or link B. Add hidden text within the button or link using CSS clip assigned to the surrounding span element C. Add text to an alt attribute in the surrounding span element.
Who is directly affected by the laws of Section 508 of the Rehabilitation Act in addition to the U.S. federal government? A. All organizations that do business with the federal government B. Everyone seeking to make technologies accessible to people with disabilities C. Anyone who uses the Internet D. All U.S. citizens
A. All organizations that do business with the federal government
The Americans with Disabilities Act is an example of which type of accessibility law? A. Civil rights law B. Procurement law C. Industry-specific law D. Administrative law E. Constitutional law
A. Civil rights law
If an <iframe> contains only JavaScript that is not meant to be read by the user, what is the best way to address this <iframe> in terms of accessibility? A. Hide it from screen reader users with aria-hidden="true" B. Hide it with display:none in the CSS C. add aria-describedby="JavaScript only"
A. Hide it from screen reader users with aria-hidden="true"
What should be done to an <img> element to increase screen reader compatibility when an SVG is used as its source? A. It should be assigned role="img". B. It should be assigned role="region". C. It should be assigned role="presentation". D. Nothing should be done to the <img> element.
A. It should be assigned role="img". What should be done to an <img> element to increase screen reader compatibility when an SVG is used as its source? A. It should be assigned role="img". B. It should be assigned role="region". C. It should be assigned role="presentation". D. Nothing should be done to the <img> element.
All of the following are true about skip links, except: A. Must be placed just before the main navigation menu B. Must be accessible to keyboard-only users C. Must be accessible to screen reader users D. Must become visible upon receiving focus, if hidden
A. Must be placed just before the main navigation menu
What is the recommended maximum number of main focus areas on a web page? A. One B. Two C. Three D. Any number is acceptable as long as they are designed well
A. One What is the recommended maximum number of main focus areas on a web page? A. One B. Two C. Three D. Any number is acceptable as long as they are designed well
The procurement laws Section 508 (U.S.) and EN 301 549 (Europe) apply to the procurement of information and communication technology by: A. Public entities B. Private entities C. Domestic entities D. All of the above
A. Public entities The procurement laws Section 508 (U.S.) and EN 301 549 (Europe) apply to the procurement of information and communication technology by: A. Public entities B. Private entities C. Domestic entities D. All of the above
Why is it important that alternative text not exceed about 150 characters? (Select the best answer.) A. Screen readers do not treat alternative text like they treat regular text in an HTML document. B. Because all it takes is 150 characters to accurately describe an image. C. If alternative text is longer than 150 characters, the user becomes bored listening to the image description. D. It is not important. Alternative text can exceed 150 characters if that is needed to describe an image.
A. Screen readers do not treat alternative text like they treat regular text in an HTML document. Why is it important that alternative text not exceed about 150 characters? (Select the best answer.) A. Screen readers do not treat alternative text like they treat regular text in an HTML document. B. Because all it takes is 150 characters to accurately describe an image. C. If alternative text is longer than 150 characters, the user becomes bored listening to the image description. D. It is not important. Alternative text can exceed 150 characters if that is needed to describe an image.
The most important consideration for designing web content for someone with motor disabilities is the inability to use: A. The hands B. The legs C. The eyes D. The mouth
A. The hands
The correct way to designate a navigation list as a navigation landmark is: A. Wrap the navigation list in a <nav> container or in a container marked with role="navigation" B. Set role="navigation" on every link in the navigation list, or wrap each link in <nav> elements C. There is no need to add anything to the markup. Screen readers automatically detect navigation lists and announce them to users D. Wrap the navigation list in a <navlist> container
A. Wrap the navigation list in a <nav> container or in a container marked with role="navigation"
The correct way to designate a navigation list as a navigation landmark is: A. Wrap the navigation list in a <nav> container or in a container marked with role="navigation" B. Set role="navigation" on every link in the navigation list, or wrap each link in <nav> elements C. There is no need to add anything to the markup. Screen readers automatically detect navigation lists and announce them to users D. Wrap the navigation list in a <navlist> container
A. Wrap the navigation list in a <nav> container or in a container marked with role="navigation"
One of the main ways to make an <iframe> accessible is to add: A. a title attribute B. an alt attribute C. a name attribute D. a <title> element E. tabindex="0" F. a <label> element
A. a title attribute
Which 2 Aria roles are not considered landmarks even though their HTML5 counterparts are
ARIA region and article roles
What does ARIA stand for
Accessible Rich Internet Application
What does ARIA stand for
Accessible Rich Internet Applications
If you have add a link to span what must you do
Add tabindex="0", role="link"
How should music be displayed
All caps Music: followed by a colon
True/False
All live multimedia (video plus audio) events that contain dialog and/or narration MUST be accompanied by synchronized captions.
What is a mouse grid?
An overlay with numbers from 1-9
What if a screen reader user pulls up a list of links? Link Confusing
Any link in a button will not be listed
What type of device will read the aria label even if invisible
Assistive technology
What does Atag stand for
Authoring Tool Accessiblity Guidlines ATAG
It is acceptable for content to flash up to how many times per second? A. 1 time B. 3 times C. 7 times D. It is never acceptable for content to flash on a web page
B. 3 times It is acceptable for content to flash up to how many times per second? A. 1 time B. 3 times C. 7 times D. It is never acceptable for content to flash on a web page
If a page has 3 headings, and an <iframe>, and if the page within the <iframe> has 2 headings, how many headings total will show up in the screen reader's list of headings on the parent page? A. 3 B. 5 C. 7 D. 13
B. 5
What does an "accessibility first" mindset mean, with respect to website and app development? A. Accessibility is the number one most important consideration, above everything else. B. Accessibility should be incorporated from the very start of the project all the way to the end. C. The project budget should prioritize accessibility before any other elements. D. Problems related to accessibility should always be fixed first, before any other problems.
B. Accessibility should be incorporated from the very start of the project all the way to the end.
If the tab order is not correct, the best way to fix it is to: A. Use tabindex (e.g. tabindex="1", tabindex="1", etc.) B. Arrange the order of the elements in the DOM to match the intended tab order. C. Use JavaScript to detect onblur events and send the focus to the correct element. D. Let the user customize the tab order
B. Arrange the order of the elements in the DOM to match the intended tab order.
Which of following methods can be used to add programmatically discernible alternative text to an informative background image? A. CSS visibility:hidden on <span> B. CSS clip on <span> C. CSS display:none on <span> D. aria-label on <span>
B. CSS clip on <span>
All of the following are best practices for captions EXCEPT: A. Caption should not exceed three lines on the screen at one time B. Captions should be uppercase C. The default font size for captions should be at least 22pt D. The last caption frame should be removed from the screen during long silent intervals
B. Captions should be uppercase All of the following are best practices for captions EXCEPT: A. Caption should not exceed three lines on the screen at one time B. Captions should be uppercase C. The default font size for captions should be at least 22pt D. The last caption frame should be removed from the screen during long silent intervals
The alternative text for an image used as a form input must: A. Describe the location of the image. B. Convey the functionality or end result of the form input. C. Describe the look of the input. D. An image used as an input is a decorative image, so it does not need a text alternative.
B. Convey the functionality or end result of the form input. The alternative text for an image used as a form input must: A. Describe the location of the image. B. Convey the functionality or end result of the form input. C. Describe the look of the input. D. An image used as an input is a decorative image, so it does not need a text alternative.
Who is directly affected by the Accessibility for Ontarians with Disabilities Act (AODA)? A. All citizens of Canada B. Every person and organization in the Province of Ontario who provides goods, services, facilities, or employment C. U.S. citizens visiting the Province of Ontario D. Anyone who uses the Internet
B. Every person and organization in the Province of Ontario who provides goods, services, facilities, or employment
Under most circumstances, the WCAG level most commonly set as the minimum goal is: A. Level A B. Level AA C. Level AAA
B. Level AA
All of the following statements are true, except: A. Users should be warned if a link opens a new window. B. Link text should include words like "link" or "click" so screen reader users know it is a link. C. For images used as links, the alternative text for the image functions as link text for screen reader users. D. Links with the same text should go to the same place.
B. Link text should include words like "link" or "click" so screen reader users know it is a link.
The mouse cursor becomes a hand pointer when the mouse cursor hovers over which of the following native HTML elements? A. Buttons B. Links C. Text fields D. A and B
B. Links The mouse cursor becomes a hand pointer when the mouse cursor hovers over which of the following native HTML elements? A. Buttons B. Links C. Text fields D. A and B
The correct location to identify the main language of an entire page is: A. On the <!doctype> element B. On the <html> element C. On the <body> element D. In a <meta> element in the <head> of the document E. On every block level element in the content
B. On the <html> element
A page with 47 landmarks: A. Shows a high level of dedication to accessibility best practices B. Probably has too many landmarks to be optimally useful to screen reader users C. Demonstrates the popularity of the web page D. Is using deprecated markup, and should be updated with more modern methods
B. Probably has too many landmarks to be optimally useful to screen reader users
EN 301 549 is an example of which type of accessibility law? A. Civil rights law B. Procurement law C. Industry-specific law D. Administrative law E. Constitutional law
B. Procurement law
Which of the following methods does NOT programmatically associate form instructions with their associated fields? A. Using aria-describedby on the <input> element B. Providing instructions in regular text nearby the <input> element C. Placing instructions in the <label> element D. Placing instructions for a group of fields in the legend
B. Providing instructions in regular text nearby the <input> element
Which categories of fonts are acceptable general-purpose fonts in terms of readability? A. Bold fonts such as Impact, and sans-serif fonts such as Arial B. Sans-serif fonts such as Arial and serif fonts such as Times New Roman C. Fixed-width fonts such as Courier and sans-serif fonts such as Arial D. Specialty fonts such as Papyrus and serif fonts such as Times New Roman
B. Sans-serif fonts such as Arial and serif fonts such as Times New Roman Which categories of fonts are acceptable general-purpose fonts in terms of readability? A. Bold fonts such as Impact, and sans-serif fonts such as Arial B. Sans-serif fonts such as Arial and serif fonts such as Times New Roman C. Fixed-width fonts such as Courier and sans-serif fonts such as Arial D. Specialty fonts such as Papyrus and serif fonts such as Times New Roman
Identifying the language of a document or part of a document is important for users of: A. Voice recognition software B. Screen readers C. Screen magnifiers D. All of the above
B. Screen readers
What are the rules or checklist of items upon which the guidelines of WCAG 2.0 are based? A. Level AAA B. Success Criteria C. Sufficient Techniques D. Advisory Techniques
B. Success Criteria
Which of the following is an example of a subjective accessibility guideline that is not easily testable? A. All images have an alt attribute. B. The cognitive skills required to use a web page are minimized. C. All form input elements have a label. D. The web page has a title.
B. The cognitive skills required to use a web page are minimized.
WCAG Level AA allows for content to flash more than 3 times per second as long as certain conditions are met. These qualifying conditions include: A. The flashing content contains no red. B. The flashing area is small enough, and the colors are low contrast. C. The flashing content has a mechanism to turn the flashing off. D. It is impossible to quantify what may cause a seizure.
B. The flashing area is small enough, and the colors are low contrast WCAG Level AA allows for content to flash more than 3 times per second as long as certain conditions are met. These qualifying conditions include: A. The flashing content contains no red. B. The flashing area is small enough, and the colors are low contrast. C. The flashing content has a mechanism to turn the flashing off. D. It is impossible to quantify what may cause a seizure.
The meaning of "affordance" is: A. How much of a project's budget can be dedicated to accessibility B. The range of possible actions that someone can perform with an object C. The error tolerance within an accessible website design
B. The range of possible actions that someone can perform with an object
What determines the audio-structural experience of a web page for a screen reader user? A. The visual layout B. The semantic structure
B. The semantic structure
For someone with low vision, all of the following are ways to make text more readable except: A. Zoom or magnify text on the screen B. Use synchronized video captions C. Change text and background colors for better contrast D. Use a screen reader
B. Use synchronized video captions
Instructions that aren't placed visually near their corresponding form fields can negatively impact which of the following user categories? A. Users who are blind B. Users who have low vision C. Users with vestibular disorders D. All of the above
B. Users who have low vision
All of the following can be used to provide alternative text for SVG <img> elements, except: A. alt attribute B. aria-owns attribute C. aria-label attribute D. aria-labelledby attribute
B. aria-owns attribute All of the following can be used to provide alternative text for SVG <img> elements, except: A. alt attribute B. aria-owns attribute C. aria-label attribute D. aria-labelledby attribute
Which phone is currently the most popular among blind users? A. Windows Phone B. iPhone C. Android Phone D. Blackberry Phone
B. iPhone Which phone is currently the most popular among blind users? A. Windows Phone B. iPhone C. Android Phone D. Blackberry Phone
In complex tables, each data cell must be explicitly associated with each corresponding header cell by which method? A. scope + header B. id + header C. id + scope D. Merging table cells
B. id + header
Good/Bad/Why Links to the Same Page with Different Link Text
Bad links are the same but labels are different its confusing
Good/Bad/Why Links to Different Pages with the Same Link Text
Bad the labels are the same but the links are different
What should blocks of code be wrapped in?
Blocks of code should be wrapped in <pre>
What are the most common screen readers mode?
Browse Mode and Focus Mode
Links vs Buttons
Button close things and submit data, links just go somewhere either on or off the page
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
C. 4.5 to 1 for small text and 3 to 1 for large text 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
Which of the following will be recognized as a valid heading by screen readers? A. <h1></h1> B. <h7>Legal disclaimer</h7> C. <div role="heading" aria-level="3">The secrets beneath the ocean's surface</div> D. <p class="heading level2" style="font-size: 200%; font-weight: bold">Understand yourself</p>
C. <div role="heading" aria-level="3">The secrets beneath the ocean's surface</div>
The correct way to code a table cell that is a column header cell is: A. <td scope="col"> B. <td scope="column"> C. <th scope="col"> D. <th scope="column">
C. <th scope="col">
In a table with two header cells in the first row ("Male" and "Female"), and with 5 header cells under each of them, the header cells in the first row should be marked as: A. <td scope="colgroup"> B. <td scope="columngroup"> C. <th scope="colgroup"> D. <th scope="columngroup">
C. <th scope="colgroup">
Which of the following is NOT an example of an automated accessibility solution that is currently available? A. Skype Translator B. Automatic captions on YouTube C. Automatic audio descriptions on YouTube D. Automatic alt text on Facebook images
C. Automatic audio descriptions on YouTube
Which one of the following is NOT a screen reader mode? A. Document mode B. Forms mode C. Caption mode D. Table mode E. Application mode
C. Caption mode
To conform to ARIA specification, all of the following methods should be applied when creating a custom checkbox within a form EXCEPT: A. Provide a visible and programmatically-associated label for the checkbox B. Ensure the checkbox is assigned role="checkbox" C. Convey to users the state of the checkbox through toggling aria-expanded values D. Make sure the Space bar can be used to change the state of the checkbox
C. Convey to users the state of the checkbox through toggling aria-expanded values
The order that screen readers navigate through page content is determined by the: (Select all that apply) A. Visual order of the elements on the screen: left-to-right, top-to-bottom B. CSS C. Document Object Model (DOM) D. All of the above
C. Document Object Model (DOM) The order that screen readers navigate through page content is determined by the: (Select all that apply) A. Visual order of the elements on the screen: left-to-right, top-to-bottom B. CSS C. Document Object Model (DOM) D. All of the above
The most recommended method to programmatically associate a label and form field is: A. aria-label attribute B. title attribute C. Explicit <label> association D. Implicit <label> association
C. Explicit <label> association
Captions MUST include all of the following EXCEPT: A. Dialog B. Important background sounds C. Important visual cues D. The identity of the individual speaking
C. Important visual cues Captions MUST include all of the following EXCEPT: A. Dialog B. Important background sounds C. Important visual cues D. The identity of the individual speaking
Why should role="img" be assigned to informative and actionable icon fonts? A. It should be assigned so that screen readers will ignore icon fonts. B. It should be assigned so that icon fonts receive visual focus. C. It should be assigned so that screen readers will recognize icon fonts as an images. D. Icon fonts aren't images, so they don't need to be assigned the role="img".
C. It should be assigned so that screen readers will recognize icon fonts as an images. Why should role="img" be assigned to informative and actionable icon fonts? A. It should be assigned so that screen readers will ignore icon fonts. B. It should be assigned so that icon fonts receive visual focus. C. It should be assigned so that screen readers will recognize icon fonts as an images. D. Icon fonts aren't images, so they don't need to be assigned the role="img".
If the user has the screen reader language set to French and a web page is written in English but does NOT specify the language of the document in the markup, how will the screen reader read the text? A. It will translate the text to French B. It will notify the user that there is a mismatch in languages C. It will read the English words using French pronunciation rules D. It will detect the language automatically and read the text with the correct pronunciation E. It will cause the screen reader to turn off
C. It will read the English words using French pronunciation rules
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.
C. Keyboard-only users and blind users 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.
While it is acceptable to auto-play audio on a webpage for more than 3 seconds IF a mechanism to turn it off is available, doing so may make it IMPOSSIBLE for which user category/categories to use your web page? A. Deaf users B. Users who are hard of hearing C. People who use screen readers D. Users with cognitive disabilities E. All of the above
C. People who use screen readers While it is acceptable to auto-play audio on a webpage for more than 3 seconds IF a mechanism to turn it off is available, doing so may make it IMPOSSIBLE for which user category/categories to use your web page? A. Deaf users B. Users who are hard of hearing C. People who use screen readers D. Users with cognitive disabilities E. All of the above
Which of the following is the most semantically-appropriate way to associate instructions with an input? A. Include the instructions within the <label> text, along with the label/name of the input B. Write the text in an aria-instructions attribute C. Reference the ID of the instructions via aria-describedby D. Include the instructions in the title attribute, to create a visible tooltip on mouse hover
C. Reference the ID of the instructions via aria-describedby
If a person types "vegetarian recipes" in a site search, which of the following is the best page title on the search result page? A. Search B. Search results C. Search results for "vegetarian recipes" D. Vegetarian recipes
C. Search results for "vegetarian recipes"
Which of the following text formats allows user customizability of things like color, font, size, etc.? A. Text embedded in a JPG image B. Text embedded in an SVG image C. Text written in an HTML paragraph D. Text embedded in a Flash object
C. Text written in an HTML paragraph
What does the JAWS screen reader read with regard to the name/label of an <iframe>? A. The name attribute on the <iframe> element B. The title attribute on the <iframe> element C. The <title> element of the page within the iframe D. The title attribute of the page within the iframe
C. The <title> element of the page within the iframe
From an accessibility stance, why should standard (real) text and native UI components be used instead of images of text and UI components? A. Standard text and native components give web designers more options to style the look of a web page. B. As long as contrast ratio requirements are met, images of text and native components can and should be used. C. The use of standard text and native components allows users to customize text and colors. D. As long as alternative text is provided, images of text and native components can and should be used.
C. The use of standard text and native components allows users to customize text and colors. From an accessibility stance, why should standard (real) text and native UI components be used instead of images of text and UI components? A. Standard text and native components give web designers more options to style the look of a web page. B. As long as contrast ratio requirements are met, images of text and native components can and should be used. C. The use of standard text and native components allows users to customize text and colors. D. As long as alternative text is provided, images of text and native components can and should be used.
What is the purpose of "visual white space" in web design? A. To ensure sufficient color contrast B. To allow user CSS customization C. To visually separate different elements of the design
C. To visually separate different elements of the design
All of the following statements regarding transitions on a web page are true EXCEPT: A. Transitions can be distracting for users with cognitive disabilities. B. Transitions should be brief and kept to a minimum. C. Transitions between foreground and background elements (parallax effects) should occur at a fast rate. D. Transitions must not interfere with web page reading or interaction.
C. Transitions between foreground and background elements (parallax effects) should occur at a fast rate. All of the following statements regarding transitions on a web page are true EXCEPT: A. Transitions can be distracting for users with cognitive disabilities. B. Transitions should be brief and kept to a minimum. C. Transitions between foreground and background elements (parallax effects) should occur at a fast rate. D. Transitions must not interfere with web page reading or interaction
Using a different text color for an input's label to convey that input is required may exclude all of the following user categories EXCEPT: A. Users who are blind B. Users who have low vision C. Users who are deaf or hard of hearing D. Users who are colorblind
C. Users who are deaf or hard of hearing
If the text label for an icon is placed visually too far away from its text label, 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
C. Users with low vision If the text label for an icon is placed visually too far away from its text label, 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
Voice input or speech recognition software is most commonly used by which of the following user categories? A. Blind users B. Low-vision users C. Users with mobility impairments D. Deaf users
C. Users with mobility impairments
The accessible name for a data table should be contained in what element? A. <title> B. <tabletitle> C. <caption> D. <summary> E. <name> F. The first row of the table (the columns of that row should be merged into a single cell)
Caption
Alternative Representations of Video
Captions, transcript, audio descriptions
Sometimes it can be appropriate to provide extra information in a link just for screen reader users, via hidden text. The text is hidden by CSS, using the
Clip Method
What is the most neglected form of disability as it pertains to web design?
Cognitive Disabilities
Three areas that WCAG is weak
Cognitive disabilities, Low Vision, Mobile and touch devices
Robust
Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.
Blind users often hear a list of headings with their level? what is that shortcut
Control + Option + Command + H or H
Which of the following CSS methods will effectively hide content such as inactive dialogs from both screen reader users and sighted users? (Select all that apply) A. display:none B. visibility:hidden C. screenreader:hidden D. A and B E. All of the above
D. A and B
Why is the use of placeholder text as a form label bad for accessibility? A. The default color for placeholder text does not meet color contrast requirements B. Placeholder text disappears when data is entered in the field C. Placeholder text is not supported in most browsers D. A and B E. All of the above
D. A and B
The Web Content Accessibility Guidelines (WCAG) Level AA requires that captions be provided for: A. Prerecorded multimedia (video plus audio) B. Live multimedia (video plus audio) C. Prerecorded video-only D. A and B E. All of the above
D. A and B The Web Content Accessibility Guidelines (WCAG) Level AA requires that captions be provided for: A. Prerecorded multimedia (video plus audio) B. Live multimedia (video plus audio) C. Prerecorded video-only D. A and B E. All of the above
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 all that apply) 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
D. A and C
Which of the following statements is true? A. Web accessibility happens readily without planning. B. As long as all website components are accessible individually, the entire user experience will always be accessible. C. Retrofitting an accessibility solution can solve most accessibility problems, without having to start the design from scratch. D. Accessibility rot in websites can occur when designers see accessibility as a one-time project, rather than an ongoing process.
D. Accessibility rot in websites can occur when designers see accessibility as a one-time project, rather than an ongoing process. Which of the following statements is true?
Adequate mouse-click target sizes help which of the following user categories? (Select all that apply) A. Users with low vision B. Users with tremors C. Users with limited dexterity D. All of the above
D. All of the above Adequate mouse-click target sizes help which of the following user categories? (Select all that apply) A. Users with low vision B. Users with tremors C. Users with limited dexterity D. All of the above
Which of these aspects can affect the experience of a website user with a disability? A. The person's technology literacy and experience B. The amount of time the person has had the disability C. The person's level of expertise at using their assistive technology D. All of the above
D. All of the above Which of these aspects can affect the experience of a website user with a disability? A. The person's technology literacy and experience B. The amount of time the person has had the disability C. The person's level of expertise at using their assistive technology D. All of the above
Enhancing the visual focus indicator benefits which group of users? (Select all that apply) A. Users who are colorblind B. Users who have low vision C. Sighted keyboard users D. All of the above groups are affected
D. All of the above groups are affected
Which of the following groups of people are affected when only color is used to communicate information on a web page? (Select all that apply) A. People who have low vision B. People who are blind C. People who are colorblind D. All of the above groups are affected E. B and C
D. All of the above groups are affected Which of the following groups of people are affected when only color is used to communicate information on a web page? (Select all that apply) A. People who have low vision B. People who are blind C. People who are colorblind D. All of the above groups are affected E. B and C
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
D. Any of the above methods can be used 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
Which of the following methods is recommended for decorative or redundant icon fonts? A. Decorative or redundant icon fonts should be described using aria-label. B. Decorative or redundant icon fonts should be assigned role="img". C. Decorative or redundant icon fonts should be assigned an empty, or null, alt attribute. D. Decorative or redundant icon fonts should be set to aria-hidden="true".
D. Decorative or redundant icon fonts should be set to aria-hidden="true". Which of the following methods is recommended for decorative or redundant icon fonts? A. Decorative or redundant icon fonts should be described using aria-label. B. Decorative or redundant icon fonts should be assigned role="img". C. Decorative or redundant icon fonts should be assigned an empty, or null, alt attribute. D. Decorative or redundant icon fonts should be set to aria-hidden="true".
Which European mandate is similar to Section 508 in the United States? A. The European Standard for Disability Equality B. EU ADA - European Union Access to Disabilities Act C. EN Section 508 D. EN 301 549: Accessibility requirements suitable for public procurement of ICT (Information and Communication Technology) products and services in Europe
D. EN 301 549: Accessibility requirements suitable for public procurement of ICT (Information and Communication Technology) products and services in Europe
Using the Tab key to move through a page will put focus on all of the following elements EXCEPT: A. Form fields B. Links C. Elements with tabindex="0" D. Elements with tabindex="-1"
D. Elements with tabindex="-1"
Which of the following is NOT one of the 7 Principles of Universal Design? A. Equitable Use B. Simple and Intuitive Use C. Tolerance for Error D. High Physical Effort
D. High Physical Effort Which of the following is NOT one of the 7 Principles of Universal Design? A. Equitable Use B. Simple and Intuitive Use C. Tolerance for Error D. High Physical Effort
Which of the following statements is true? A. Photo-epileptic seizures are always milder than 'regular' epileptic seizures. B. Flashing of any speed is okay as long as it can be turned off. C. Only people with traumatic brain injuries are sensitive to flashing content. D. High-contrast flashes are more dangerous than low-contrast flashes
D. High-contrast flashes are more dangerous than low-contrast flashes Which of the following statements is true? A. Photo-epileptic seizures are always milder than 'regular' epileptic seizures. B. Flashing of any speed is okay as long as it can be turned off. C. Only people with traumatic brain injuries are sensitive to flashing content. D. High-contrast flashes are more dangerous than low-contrast flashes
Which of the following statements about labels is NOT correct? A. Labels should be visually close to their corresponding form fields. B. Labels must be programmatically associated with their matching elements. C. Labels should be close to their corresponding form fields in the DOM. D. Labels should be close in length to the other labels on the page.
D. Labels should be close in length to the other labels on the page.
To create accessible user-generated content, you can employ all of these strategies, EXCEPT: A. Automate accessibility fixes. B. Prompt and guide users to create accessible content during the authoring process. C. Limit the type of content users can post. D. Require users to delete and re-post content that has accessibility errors.
D. Require users to delete and re-post content that has accessibility errors.
The 21st Century Video Communications and Accessibility Act (CVAA) requires captions for: A. All video content available on the web B. All audio content available on the web C. All video and audio content on the web that was made by U.S. companies D. Video content on the web that was previously aired with captions on television in the US
D. Video content on the web that was previously aired with captions on television in the US The 21st Century Video Communications and Accessibility Act (CVAA) requires captions for: A. All video content available on the web B. All audio content available on the web C. All video and audio content on the web that was made by U.S. companies D. Video content on the web that was previously aired with captions on television in the US
Which is NOT an example of assistive technology that helps with using the Internet? A. Screen readers B. Screen magnifiers C. Refreshable braille devices D. Wheelchair E. Mouth stick
D. Wheelchair
All of the following are valid ARIA landmark roles except: A. banner B. navigation C. main D. end E. search
D. end
Name 4 modes for screenreaders?
Document, Focus, Application, Table
Most popular speech recognition software
Dragon Naturally Speaking
The minimum recommended touch target size is: A. 10px by 10px B. 20px by 20px C. 24px by 24px D. 36px by 36px E. 44px by 44px F. 64px by 64px
E. 44px by 44px
The main navigation menu should: A. Be consistently located B. Be consistently ordered C. Be positioned horizontally D. Include drop-down submenus E. A and B F. All of the above
E. A and B
Which of the following can impact the reading order and focus order of page content? (Select all that apply) 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
E. A and D Which of the following can impact the reading order and focus order of page content? (Select all that apply) 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
Which of the following methods could be used to mark the current location within a paginated view? (Select all that apply) A. hidden text B. aria-label C. aria-labelledby D. aria-describedby E. All of the above
E. All of the above
Why is using real HTML text instead of text in an image helpful? (Select all that apply) A. People who need to customize text for readability can apply their own CSS sheets to HTML text. B. People who have low vision can better zoom real text, while images lose crispness. C. HTML text can reflow as the viewport changes, while text in images cannot. D. B and C E. All of the above
E. All of the above
Animations, parallax effects, and background videos or animations in web pages have the potential to negatively impact which of the following user categories: A. Users with vestibular disorders B. Blind users C. Users with cognitive impairments D. A and C E. All of the above
E. All of the above Animations, parallax effects, and background videos or animations in web pages have the potential to negatively impact which of the following user categories: A. Users with vestibular disorders B. Blind users C. Users with cognitive impairments D. A and C E. All of the above
Parallax effects can negatively impact: A. Keyboard accessibility B. Readability of text C. Search Engine Optimization D. A and B E. All of the above
E. All of the above Parallax effects can negatively impact: A. Keyboard accessibility B. Readability of text C. Search Engine Optimization D. A and B E. All of the above
All of the following HTML elements are deprecated in HTML5 except: A. <applet> B. <center> C. <frame> D. <font> E. All of the above are deprecated.
E. All of the above are deprecated. All of the following HTML elements are deprecated in HTML5 except: A. <applet> B. <center> C. <frame> D. <font> E. All of the above are deprecated.
If one of your pages employs a time-limit, which of the following are recommended? A. Ensure the time limit is greater than four hours B. Provide a warning when the time limit is about to expire C. Provide an option to extend the session D. A and B E. B and C
E. B and C If one of your pages employs a time-limit, which of the following are recommended? A. Ensure the time limit is greater than four hours B. Provide a warning when the time limit is about to expire C. Provide an option to extend the session D. A and B E. B and C
If there are multiple navigation landmarks in the same page: A. Each landmark should have its own unique title attribute B. Screen readers will ignore all but the first one C. The markup is invalid: there should be only one navigation landmark per page D. The screen reader is likely to crash, especially older versions E. Each landmark should have its own aria-label or aria-labelledby attribute
E. Each landmark should have its own aria-label or aria-labelledby attribute
Which of the following methods is NOT a best practice for progressive form updates? A. Provide a summary of users' choices at the end of the form before submission B. Include only one step on the screen at a time C. Number the steps in the form D. Manage keyboard focus as users move forward and backward through the form E. Make dynamic changes in the form anywhere in the DOM
E. Make dynamic changes in the form anywhere in the DOM
What is the official character limit within a heading? A. 256 characters B. 140 characters C. 1024 characters D. It depends on the level of the heading E. There is no official limit
E. There is no official limit
The correct language code for German web content is: A. lang="en" B. lang="German" C. lang="german" D. lang="deutch" E. lang="de" F. lang="d"
E. lang="de"
What company claims to have developed glasses for color-blindness
EnChroma
Which of the following meta viewport elements will disable pinch-to-zoom on mobile devices? (Select all that apply) A. user-scalable=no B. user-scalable=1 C. maximum-scale=1.0 D. maximum-scale=2.0 E. initial-scale=1.0 F. A and C G. B and E H. None of the above
F. A and C Which of the following meta viewport elements will disable pinch-to-zoom on mobile devices? (Select all that apply) A. user-scalable=no B. user-scalable=1 C. maximum-scale=1.0 D. maximum-scale=2.0 E. initial-scale=1.0 F. A and C G. B and E H. None of the above
Which of the following statement(s) about deprecated HTML elements or attributes is/are FALSE? A. They have been replaced by newer constructs such as CSS. B. They are typically structural in nature. C. They may cause users to be unable to override the deprecated items with their own style sheets. D. They are disallowed by WCAG 2.0 standards. E. They are outdated or obsolete. F. Both B & D
F. Both B & D Which of the following statement(s) about deprecated HTML elements or attributes is/are FALSE? A. They have been replaced by newer constructs such as CSS. B. They are typically structural in nature. C. They may cause users to be unable to override the deprecated items with their own style sheets. D. They are disallowed by WCAG 2.0 standards. E. They are outdated or obsolete. F. Both B & D
True / false: Adding the ARIA attribute aria-required="true" tells every user that a form input is required.
False
True / false: As long as a group label is programmatically associated with the group of fields it labels, its location in the DOM does not matter.
False
True / false: Color must never be used in labels.
False
True / false: From an accessibility perspective, focusing on a form element must not cause a change of context, but context changes may occur when a user hovers over a form element.
False
True or False: CSS-generated content is universally supported by screen readers, and is recommended for use.
False
True or False: Color-coded text is accessible by default to screen reader users, because screen readers always automatically announce changes in color.
False
True or False: It's a good idea to create two versions of a website, the standard one and the accessible ono
False
True or False: Layout tables are not permitted by WCAG standards.
False
True or False: Open captions (rather than closed captions) are a good choice to accommodate all users.
False
True or False: The design-centric approach to accessibility focuses on a person's limitations.
False
True or False: WCAG provides extensive and detailed guidelines for designing for users with cognitive disabilities.
False
True or False: When designing accessible solutions, it's helpful to think of disabilities as binary; either they are there or not there.
False
True or false: ARIA live announcements should be used to announce the the time left on a countdown timer every time the visible time remaining changes.
False
True or false: Complex tables with merged cells are easy for screen readers to understand, as long as the table has all the necessary accessible markup.
False
True or false: Icons must not be used as labels.
False
True or false: If a long description of a complex image is provided using the longdesc attribute, both sighted users and screen reader users can access the description.
False
True or false: Links can be the same color as the surrounding non-link text as long as an underline appears on mouse hover and on keyboard focus.
False
True or false: Paragraph text should be full justified because the neat edges are less distracting for people with reading disorders.
False
True or false: Screen reader users usually navigate pages by listening to the entire page being read from start to finish.
False
True or false: Screen readers can identify the current location within a navigation menu based on the visual styles
False
True or false: Screen readers do not read nested lists (lists within lists) properly.
False
True or false: Screen readers will recognize the following code as a list:<p>1. First item<br>2. Second item<br>3. Third item</p>
False
True or false: Sighted keyboard users can navigate by headings, landmarks, and other semantic features, just like blind screen reader users.
False
True or false: The Americans with Disabilities Act (U.S. civil rights law) explicitly covers online content.
False
True or false: The default mode for most screen readers is forms mode.
False
True or false: There are no authoring tool guidelines for accessibility.
False
True/False The page <title> MUST be updated when the web address changes
False
True/False You should add image to the alt tag, for example' "Image of sunset"
False - You should add image to the alt tag, for example' "Image of sunset"
True or false: The line spacing within a paragraph of text should be at least 2.0.
False 1.5
True or false: Enhanced visual hover indicators help users who can only navigate websites with a keyboard.
False Enhanced visual hover indicators help users who can only navigate websites with a keyboard.
True or false: When basic Dragon voice commands do not work on a web page, an alternate method that can be used to interact with page content is called "Voice Grid."
False Mouse Grid is the correct name
True or false: The best way to fix focus order problems is to use tabindex values greater than 1.
False The best way to fix focus order problems is to use tabindex values greater than 1.
True or false: Using distinct colors only for hover and focus on links are enough to distinguish links from normal text.
False Using distinct colors only for hover and focus on links are enough to distinguish links from normal text.
True or false: When high contrast is activated on an operating system, a user cannot choose to have the high contrast theme override the styling of a web page.
False When high contrast is activated on an operating system, a user cannot choose to have the high contrast theme override the styling of a web page.
True or False: You can customize web content to screen reader users by detecting which screen reader they're using.
False You can customize web content to screen reader users by detecting which screen reader they're using.
True/False use Images with text in it
False do not use images with text
True or false: If the <area> elements of an image map have alternative text, then alternative text does not need to be provided for the main <img> element.
False if the <area> elements of an image map have alternative text, then alternative text does not need to be provided for the main <img> element.
True or false: When multiple visible labels are used to label one field, the best attribute to associate each label with the field is aria-label.
False it is aria-labelledby
True or false: Providing alternative text for an image that communicates information using color alone is sufficient in communicating that information to users.
False roviding alternative text for an image that communicates information using color alone is sufficient in communicating that information to users.
True or false: When a user allows a session to time out, it is not necessary to save data because the user would have extended the session if they intended to continue.
False save the data before session time out
True or false: Screen readers automatically notify users when a web page implements custom keystrokes.
False screen readers SHOULD notify users when a page implements custom keystrokes
True or false: Alternative text for <video> and <audio> elements can be provided using the alt attribute.
False there is no alt attribute for video and audio
True/False The pinch-to-zoon feature should be disabled? Which condition?
False, Low Vision need to zoom
True/False Using color alone to convey crucial information is a good idea? Which condition would most be affected?
False, color blindness
braille output device
For blind and deaf users
Which screen readers are available for Windows? (Select all that apply) A. JAWS B. VoiceOver C. TalkBack D. NVDA E. Window-Eyes F. C and D G. A, D, and E
G. A, D, and E Which screen readers are available for Windows? (Select all that apply) A. JAWS B. VoiceOver C. TalkBack D. NVDA E. Window-Eyes F. C and D G. A, D, and E
EnChroma
Glasses that might help color blindess
Highlighted text should be marked with
Highlighted text should be marked with <mark></mark>
Hearing the words can help make the visual text easier to understand
How do low vision people benefit from screen readers?
People with which of the following disabilities may use screen readers? (Select all that apply) A. Blindness B. Low vision C. Deafblindness D. Color blindness E. Deafness F. Reading disabilities G. A, B, C, and D H. B, E, and F I. A, B, C, and F
I. A, B, C, and F People with which of the following disabilities may use screen readers? (Select all that apply) A. Blindness B. Low vision C. Deafblindness D. Color blindness E. Deafness F. Reading disabilities G. A, B, C, and D H. B, E, and F I. A, B, C, and F
What should describe speech that is difficult to hear
Inaudible or unclear
Understandable
Information and the operation of user interface must be understandable.
Perceivable
Information and user interface components must be presentable to users in ways they can perceive.
Which of the following elements will most screen readers announce to users (in terms of the semantic meaning of the element itself)? A. q B. del C. ins D. mark E. code F. pre G. B and C H. D and E I. All of the above J. None of the above
J. None of the above Which of the following elements will most screen readers announce to users (in terms of the semantic meaning of the element itself)? A. q B. del C. ins D. mark E. code F. pre G. B and C H. D and E I. All of the above J. None of the above
Which operating system, browser and screenreader are most used
Jaws and chrome, NVDA and Firefox
A common exception to only 1 h1 on a page
Modal window
red-green color blindness
Most common type of color blindness
How do you open the mouse grid
Mouse grid
Decorative and redundant images
Must be hidden from assistive technology users.
ZoomText and MAGic
Name 2 screen readers
Is there a natural way to create a description that is associated with a group?
No
Is <mark> read by screenreaders
No mark is not read by screenreaders
If there is only 1 navigation item should it be labeled with role="navigation"
No only if you have multiple
Why should a skip link have a -1 tab index?
Otherwise after the user skips the next tab will the back up to the thing they skip
Example of a link to a file or destination in an alternative or non-web format SHOULD indicate the file or destination type.
PDF version link text
Name the 5th principle of the 7 Principles of Universal Design
Principle Five: Tolerance for Error
Name the 4th principle of the 7 Principles of Universal Design
Principle Four: Perceptible Information
Name the 1 principle of the 7 Principles of Universal Design
Principle One: Equitable Use
Name the 7th principle of the 7 Principles of Universal Design
Principle Seven: Size and Space for Approach and Use
Name the 6th principle of the 7 Principles of Universal Design
Principle Six: Low Physical Effort
Name the 3rd principle of the 7 Principles of Universal Design
Principle Three: Simple and Intuitive Use
Name the 2 principle of the 7 Principles of Universal Design
Principle Two: Flexibility in Use
Aria-label for links provide more info rather then the generic, it also override native link text
Read more
Screen readers reads tables in 2 modes, what are they?
Regular and table navigation mode
An example of a single key shortcut
S for search bad for tremors
What are SVG images?
SVG are two-dimensional, vector-based graphics defined in XML format.
What is the default font for captions
Sans-serif
What does SVG stand for?
Scalable Vector Graphics
3 Low Vision devices
Screen Magnification, Screen Readers, Color Customization
What should the alt text be for a magnifying glass?
Search
Achromatopsia
See colors in a grayscale
Karabiner Elements and
Sharp keys
What is one way for sighted users to navigate within pages
Skip Link
What do real-time captions require?
Stenographer
<a href="http://w3.org" aria-label="The World Wide Web Consortium">W3C</a> What will be read by a screenreader?
The World Wide Web Consortium
Because of a bug screenreaders will ignore the image if <img .svg
The image does not have role="img"
What is the overall goal for blind users?
To give both sighted and blind users the same experience
Alternative Representations of Audio
Transcript
Which 3 group of users are effected by small click target size?
Tremors, spasms and low vision
The Menu number and order of the links in the navigation menu should be consistent from one page to the other.
True
True / False Ensure the page <title> reflects the error or success confirmation status.
True
True / False Focusing on an element MUST NOT automatically trigger a change of context, unless the user has been adequately advised ahead of time.
True
True / False Move the focus to the confirmation message after the page loads.
True
True / False Nested <fieldset> elements are permitted to create groups inside of groups.
True
True / False Updates and state changes that cannot be communicated through HTML or ARIA methods SHOULD be communicated via ARIA live messages.
True
True / False: When one visible label is used to label multiple fields, such as the three parts of a telephone number, each individual field must have a screen reader accessible label.
True
True / false: Changes in context can inhibit accessibility when those changes happen automatically and users aren't allowed to request the changes in context.
True
True / false: Custom form elements should be modeled after native HTML form elements.
True
True / false: Group labels must be available to all users — sighted and non-sighted alike.
True
True or False: ARIA was invented to increase screen reader accessibility, especially for interactive scripts.
True
True or False: Designing for edge cases is a more inclusive design approach than designing for the statistical normal distribution of users.
True
True or False: Designing for people with disabilities has collateral benefits for all users.
True
True or False: Screen readers will read the alt text of an image within a heading as part of the heading text. maybe the image is in a header tag?
True
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.
True
True or false: Anything that invites and posts user input is an authoring tool.
True
True or false: If refreshing page content is important for a web site, it is recommended that users be notified that new content is available using a dialog or an ARIA alert message depending on the urgency of the update.
True
True or false: Links must be visually distinguishable from the surrounding non-link text
True
True or false: Links on the same page that go to the same destination should have the same text within the link.
True
True or false: On a so-called single-page application — in which AJAX is used to bring in new content without refreshing or loading the entire web page — any time that the URL changes, the page title should be updated accordingly.
True
True or false: Screen readers will announce the number of items in a bulleted list if the list is marked up properly.
True
True or false: Section 508 of the Rehabilitation Act (U.S. procurement law) explicitly covers online content.
True
True or false: Since plain text is non-focusable, text such as instructions or formatting hints should not be placed in the middle of a form unless the text is programmatically associated with a focusable element.
True
True or false: The basic keyboard commands for interacting with HTML form controls are common across all screen reader / browser combinations.
True
True or false: The spacing between paragraphs should be at least 1.5 times the line spacing.
True
True or false: You can create a website that complies fully with the WCAG accessibility guidelines, but which is not fully accessible.
True
True or false: to provide accessible content for deafblind users, you must ensure that everything is available in a machine-readable text format.
True
True/False 4 letter country codes are referred to as regional country codes like "en-au" for Australian English
True
True/False ARIA always takes precedence over native HTML semantics.
True
True/False All focusable elements MUST have a visual focus indicator when in focus.
True
True/False Aria is almost entirely for screen readers
True
True/False Color alone must not be used to distinguish links from surrounding text unless the color contrast between the link and the surrounding text is at least 3:1 and an additional differentiation is provided when the link is hovered or receives focus.
True
True/False Data tables SHOULD have a programmatically-associated caption or name.
True
True/False Header/data associations that cannot be designated with <th> and scope MUST be designated with headers plus id
True
True/False Heading should not skip hierarchy levels h1 to h3 wrong
True
True/False Hidden frames or frames that do not convey content to users SHOULD be hidden from assistive technologies using aria-hidden="true".
True
True/False IMPORTANT: You will need to let the page finish loading, then set a JavaScript timeout of 1 to 2 seconds to allow the screen reader virtual buffer to process the page, then use JavaScript to send the focus to the confirmation message. If you send the focus to the message immediately upon page load, the focus may be set successfully, but screen readers will say nothing because they haven't had time to determine what is on the page.
True
True/False If a table of contents for the page is included, it SHOULD reflect the heading structure of the page.
True
True/False JAWS, NVDA, and VoiceOver support the ability to navigate to sections of a web page using ARIA landmarks.
True
True/False Landmarks are used to designate sections of the overall page design and layout. Headings are used to designate sections within the content.
True
True/False Layout Tables should not contain data table markup
True
True/False Low vision is caused by many different conditions, with varying degrees of vision impairment
True
True/False People with Low Vision use Screen Magnifiers
True
True/False Responsive design is Low Vision Design
True
True/False Screen reader users are informed whether something is a button or a link
True
True/False Screen readers announce links, and then read the link text
True
True/False Screen readers read the caption of the table along with the table size?
True
True/False Screen readers will say "link" and then read the link text, so there is no need to include the word "link" in the link text.
True
True/False Support for scope="rowgroup" is not good
True
True/False Tables that are not the same size without a caption are confusing?
True
True/False The Caption element is the best way to name a table?
True
True/False The header cells of a data table must be marked as header cells using <th>.
True
True/False The source page of an iframe MUST have a valid, meaningful <title>.
True
True/False Title the unique info should come first eg. About | Indeed
True
True/False Using the alt attribute of the img element will ensure that the purpose of the link is clear and that the text is exposed to screen readers.
True
True/False aria-label (note that the text in the aria-label attribute is invisible to sighted users):
True
True/False if you use an icon for indication, the alt text must be equivalent
True
True/False screen reader users can use keyboard shortcuts to navigate directly to the first <h1>
True
True/False screen reader will read the table header out loud in addition to the data in the table cell
True
True/False screen readers ignore the size and font-weight of the text
True
True/False tabindex of positive values SHOULD NOT be used.
True
True/false the title tag should be the same or very similar to the h1
True
True/False NO code for screen orientation because Android native apps are responsive to landscape layouts by default.
True NO code for screen orientation because Android native apps are responsive to landscape layouts by default.
True/False "fake" links using ARIA role="link" do not receive focus
True "fake" links using ARIA role="link" do not receive focus
True/False Often it is best to also create an HTML-based alternative version of non-HTML content, because HTML usually offers the greatest potential for accessibility across the greatest diversity of devices.
True - Often it is best to also create an HTML-based alternative version of non-HTML content, because HTML usually offers the greatest potential for accessibility across the greatest diversity of devices.
True/False Text can be created with SVG
True - Text can be created with SVG
True/False A <fieldset>, used in conjunction with a <legend> is used to group related elements in a form.
True A <fieldset>, used in conjunction with a <legend> is used to group related elements in a form.
True/False ARIA does not change anything for sighted users. For example, aria-hidden="true" does not hide content from visual users, but it does hide it from screen reader users.
True ARIA does not change anything for sighted users. For example, aria-hidden="true" does not hide content from visual users, but it does hide it from screen reader users.
True/False ARIA is Not a Programming Language
True ARIA is Not a Programming Language
True/False ARIA is Useful Only to Assistive Technologies
True ARIA is Useful Only to Assistive Technologies
True/False ARIA is essentially an API for communicating this information to screen readers
True ARIA is essentially an API for communicating this information to screen readers
True/False All prerecorded video MUST have synchronized captions.
True All prerecorded video MUST have synchronized captions.
True/False All text within the image that needs to be spoken by a screen reader MUST be associated with the <svg> element using aria-labelledby.
True All text within the image that needs to be spoken by a screenreader must be associated with the <svg> elements using aria-labelledby
True/False Any time information is presented through audio, especially in videos, you will need to provide an alternative to audience members who are deaf or hard of hearing in order for them to access that information.
True Any time information is presented through audio, especially in videos, you will need to provide an alternative to audience members who are deaf or hard of hearing in order for them to access that information.
True/False Aria needs javascript to give content functionality
True Aria needs javascript to give content functionality
True or false: Custom JavaScript gesture events on web pages will probably not work when a touch device screen reader is turned on.
True Custom JavaScript gesture events on web pages will probably not work when a touch device screen reader is turned on.
True/False Decorative or redundant icon fonts SHOULD be set to aria-hidden="true".
True Decorative or redundant icon fonts SHOULD be set to aria-hidden="true".
True/False Every time a video plays with WebVTT captions, the video player will honor the person's preferences. Storing the caption preferences in a centralized location in the operating system is convenient for the users, who won't have to choose settings every time they watch a new video.
True Every time a video plays with WebVTT captions, the video player will honor the person's preferences. Storing the caption preferences in a centralized location in the operating system is convenient for the users, who won't have to choose settings every time they watch a new video.
True/False Fonts SHOULD be user-customizable.
True Fonts SHOULD be user-customizable.
True/False If music lyrics are sung music notes should be used at the beginning and end of the caption denoting singing
True If music lyrics are sung music notes should be used at the beginning and end of the caption denoting singing
True or false: If you code a widget to be fully keyboard-accessible when using the arrow keys, touch devices users (without keyboards) will still not be able to use the widget, in most cases.
True If you code a widget to be fully keyboard-accessible when using the arrow keys, touch devices users (without keyboards) will still not be able to use the widget, in most cases.
True or false: In a multimedia or audio-only presentation, background audio should be at least 20 decibels lower than (about 4 times quieter than) primary speech or sounds.
True In a multimedia or audio-only presentation, background audio should be at least 20 decibels lower than (about 4 times quieter than) primary speech or sounds.
True/False Labels must be in close proximity to their control
True Labels must be in close proximity to their control
True/False Labels must be programmatically associated with their control.
True Labels must be programmatically associated with their control.
True/False Labels must be visible at all times
True Labels must be visible at all times
True/False Line spacing SHOULD be at least 1.5 within paragraphs.
True Line spacing SHOULD be at least 1.5 within paragraphs.
True/False Open captions are always on and are "burned into" the video layer during production. Production Studios calls this process 'subtitling'.
True Open captions are always on and are "burned into" the video layer during production. Production Studios calls this process 'subtitling'.
True/False Screen readers do not support <code>
True Screen readers do not support <code>
True/False Text SHOULD NOT be full justified.
True Text SHOULD NOT be full justified.
True or false: The accessibility design and development principles for speech recognition users are largely the same as those for keyboard-only and screen reader users.
True The accessibility design and development principles for speech recognition users are largely the same as those for keyboard-only and screen reader users.
True or false: The advantage of advanced caption file formats over basic file formats is that advanced formats support greater flexibility in styling captions to meet user needs.
True The advantage of advanced caption file formats over basic file formats is that advanced formats support greater flexibility in styling captions to meet user needs.
True/False The aria-label Text Is Invisible
True The aria-label Text Is Invisible
True/False The aria-labelledby Attribute Refers to the id of Another Element
True The aria-labelledby Attribute Refers to the id of Another Element
True/False The aria-labelledby Text Is (Usually) Visible on the Page
True The aria-labelledby Text Is (Usually) Visible on the Page
True/False The aria-labelledby Text Replaces an Element's Original Text
True The aria-labelledby Text Replaces an Element's Original Text
True/False Web content SHOULD NOT restrict use of input modalities available on a platform except where the restriction is essential, required to ensure the security of the content, or required to respect user settings.
True Web content SHOULD NOT restrict use of input modalities available on a platform except where the restriction is essential, required to ensure the security of the content, or required to respect user settings.
True/False When custom keyboard behavior is required to use a component, keyboard instructions MUST be provided.
True When custom keyboard behavior is required to use a component, keyboard instructions MUST be provided.
True or false: Background videos MUST have a method to stop auto playing background videos which last more than 5 seconds
True all background videos must give the user the ability to stop playing if it lasts for more than 5 seconds
True/False background videos and background animations should not contain sounds
True background images and animations should not contain sounds
True/False Jaws reads the title of the enclosed document
True enclosed means iframe
True/False live television programs such as news broadcasts in the United States are required by law to be captioned
True live television programs such as news broadcasts in the United States are required by law to be captioned
True/False onblur and onfocus may not work on touch device
True onblur and onfocus may not work on touch device
True/False IF strong language is bleeped out then the word bleep should be used
True strong language is bleeped out then the word bleep should be used
Deuteranopia, Protanopia
Two common sub types of red-green color blindness DP
Why cant you use display:none to skip links?
Unavailable to keyboard users
Operable
User interface components and navigation must be operable
Name 2 conditions where users may want to customize their font
Users with learning disabilities and or low vision
Transcript and captions
Video Design Considerations for Deafness
What does WebVTT stand for
Web Video Text Tracks Format
Examples of Live Multimedia events
Webinars Web calls and web conferencing (e.g. Skype, WebEx, GoToMeeting, etc.) Live streams of talks, speeches, lectures, presentations, etc. Live news broadcasts Any live event with spoken words as part of the audio content
Why should the background color of an svg image be defined
Windows High Contrast Mode
When does alt="" not work?
Word documents, powerpoint
2018
Year that WCAG made recommendations
When there are errors in the form should the number of errors be provided to the user
Yes
Should the speaker be identified in the caption
Yes captions should identify who is speaking
Is it possible that a screenreader will read both the content and the label?
Yes it is possible that a screenreader will read both the content and the label.
Screenreader's do not recognize strikethrough text
Yes screenreader's will read the strikethrough text
Ask yourself does the text for the label already exist on the page?
Yes, use aria-labelledby. No use, aria-label
What should background noises for captions be enclosed in
[brackets] or (parentheses)
CSS for ARIA controls
[role=link]:focus{}
Incredulous questions should use
a question mark followed by a exclamation point ?!
color blindness
a variety of disorders marked by inability to distinguish some or all colors
How do you distinguish multiple instances of a Landmark?
aria-label or aria-labelledby
What is the second best way to name a table?
aria-label or aria-labelledby to the caption element
The name of a link is calculated as follows (in order of precedence by screen readers): #3 is the best way to make a link
aria-labelledby aria-label Text contained between the opening <a> and closing </a> elements (including alt text on images) title attribute (note that this is considered a last resort method for screen readers to find something; it should not be considered a primary technique for giving names to links)
Embedding SVG in iframe or object is unreliable for
assistive technology users
A page SHOULD NOT contain more than one instance of each of the following landmarks
banner, main, and contentinfo
A page SHOULD NOT contain more than one instance of each of the following landmarks BMC
banner, main, and contentinfo
relationships
between items (e.g. aria-owns, aria-controls, both of which describe a kind of parent-child relationship where one item owns or controls another)
Tritanopia
blue-yellow color-blindness
What type of colors blindness is Tritanopia
blue-yellow color-blindness
Dragons support of ARIA is limited 2014 -
buttons, link, radio, checkbox, aria-label and aria-labelledby
CSS Clip Method
class="visually-hidden"
Interrupted speech should be indicated with a
dash--
How should a muted word be expressed
dashes can be used for muted text
Who benefits from synchronized captions
deaf audience
How can we make Landmarks backwards compatible?
display:block to them in the CSS
what key should go to the next tab
down arrow
states
dynamic/interactive components (e.g. aria-selected="true", aria-expanded="true", aria-hidden="true")
Meaningful pauses in speech should use
ellipses...
People who have Achromatopsia see colors in what scale
grayscale
live announcements
in real-time that are passed on to screen readers
CSS to set focus on input
input[type=text]:focus
A link to an external site MAY indicate that it leads to an external site.
link leads to an external site
labels
names for items (e.g. using aria-label or aria-labelledby or similar)
Is the <desc> of an svg available to sighted users?
no the <desc> of the svg is only for screenreaders
properties
of items (e.g. aria-haspopup="true")
vestibular disorders
parallax effects
Grouping controls is most important for
radio, checkbox
Deuteranopia and Protanopia are two common sub-types of _________ color-blindness
red-green color blindness
What is the most common type of color-blindness
red-green color blindness
If a person is deaf blind what is the only way they can use the internet
refreshable braille display in combination with a screen reader
Alternative Representations of Plug-ins and Documents
require effective use of their respective accessibility APIs
<header> HTML
role="banner" ARIA Role
<aside>
role="complementary"
<footer>
role="contentinfo"
what should the role be for svg <img> elements
role="img"
<main>
role="main"
<nav>
role="navigation"
roles
role="navigation", role="main" etc.
Which type of role should be added to the <table>
role="presentation"
n/a
role="search"
Easiest way to group table data group headers with its data cell groups
scope="rowgroup" or scope="colgroup"
What users need the error messages are adjacent to the inputs
screen magnification users
Programmatically Determinable
screen readers can access the alternative text
CSS for drop-down selection inputs
select:focus {}
AKA for Voice input software
speech recognition software
QWERTY
standard keyboard layout
what should strikethrough should be marked with?
strikethrough should be marked with <del>
Captions should be verbatim except for
stuttering or words like um
What should SVG images use or not use for animation
svg images should use javascript for animation and not <animate>
What should the tab index be set to for error/success message container . Otherwise, focus cannot be set successfully.
tabindex="-1"
What should text designated as insertions <ins>
text designated as insertions <ins>
meaningful
the alternative text accurately describes the image's purpose or author's intent in using the image
What is the point of aria-labelledby
to link the element with its label so that screen readers can associate the two
True/False An element with the aria-labelledby attribute is labelled by something else.
true
True/false Marquee and blink element are deprecated
true Marquee and blink element are deprecated