Semantic Structure and Navigation Flashcards
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”
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.
A. True
B. False
A. True
Which of the following would be the best for a page describing the autocorrect features of a software product called “Tri-coil” by a company named “Bob’s Brilliant Software?”
A. Autocorrect features in Tri-coil, by Bob’s Brilliant Software
B. Bob’s Brilliant Software: Tri-coil - autocorrect features
C. Features
D. All of the above are equally good
A. Autocorrect features in Tri-coil, by Bob’s Brilliant Software
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
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”
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 of the document
E. On every block level element in the content
B. On the html element
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
All of the following are valid ARIA landmark roles except:
A. banner B. navigation C. main D. end E. search
D. end
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
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 does NOT represent best practice, in terms of creating a structured outline of the content with headings?
A. h1 h2 h2 h3 h4 h2 B. h1 h2 h2 h2 h3 h4 C. h1 h3 h4 h3 h4 h3
C. h1 h3 h4 h3 h4 h3
If the heading level 1 (h1) at the beginning of the main content says “How to hang ten on a surfboard,” the most appropriate page (title) for the page from among the options below would be:
A. How to ride a surfboard B. Surfing tutorial C. Summers in California D. How to hang ten on a surfboard E. An article describing how to hang ten on a surfboard, describing the techniques and circumstances in which it is possible to do it
D. How to hang ten on a surfboard
FIX ME
Which of the following will be recognized as a valid heading by screen readers?
A. <h1>h1>
B. Legal disclaimerh7>
C. <div>The secrets beneath the ocean’s surfacediv>
D. <p class="heading level2" style="font-size:200%;font-weight:bold;">Understand yourselfp></p></div></h1>
C. <div>The secrets beneath the ocean’s surface</div>
WCAG 2.0 level double A (AA) requires headings to be in a valid hierarchy under all circumstances. A heading 4 (<h4>) cannot directly follow a heading 2 (<h2>), for example. The next subheading under the heading 2 (<h2>) MUST be a heading 3 (<h3>).
A. True
B. False
</h3></h2></h2></h4>
B. False
It is required for AAA
True or False: Screen readers will read the alt text of an image within a heading as part of the heading text.
A. True
B. False
A. True
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
Note: Headings should be kept short and relevant.
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.
True or false: Links must be visually distinguishable from the surrounding non-link text
A. True
B. False
A. True
Notes: 3:1 contrast ratio is required
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.
A. True
B. False
B. False
Notes: 3:1 contrast ratio is required