Dynamic Updates, AJAX, and Single-Page Apps Flashcards
Which of the following methods for notifying users of new content does not require JavaScript?
A. Moving focus within a page or to another element such as a dialog
B. Loading or reloading a page
C. ARIA live announcements
D. All methods require JavaScript
B. Loading or reloading a page
One of the easiest ways to alert people to new content is to send them to a new page or to reload the current page. This is the oldest method and requires no JavaScript. You simply have the user activate a link.
When a new page is loaded or when the same page is reloaded, most screen readers do the following:
- Read the page title
- Provide a summary of features on the page (such as “7 headings, 3 regions, and 27 links”)
- Start reading from the top of the page
When moving focus to an element that is not focusable, it is important to include which one of the following attributes on the container:
A. tabindex=”-1”
B. tabindex=”0”
C. tabindex=”1”
D. aria-focus=”true”
A. tabindex=”-1”
- The container where the focus is sent must have tabindex=”-1”. If the container is not set to tabindex=”-1”, the focus will not arrive successfully in all browsers, and screen readers may not read the text.
- The container must not be empty.
- Don’t move the focus unexpectedly.
- Sending the focus must be the last event, and it will probably be necessary to delay before sending the focus.
Which of the following is NOT a consideration when moving focus to new content:
A. The container on which focus is set must not be empty.
B. Focus should not move unexpectedly.
C. The element that triggers the focus change must include aria-haspopup=”true”.
D. Sending focus to AJAX content must be the last event.
C. The element that triggers the focus change must include aria-haspopup=”true”.
ARIA live announcements are an effective way to notify users of new content without moving the user’s focus.
A. True
B. False
A. True
ARIA live announcements allow the web page to make announcements without loading or reloading a page or moving the focus. For custom widgets and custom events, ARIA live announcements may be the only way to communicate certain kinds of state changes or other similar events.
There are two main kinds of ARIA live announcements: aria-live=”assertive” and aria-live=”polite”.
Valid aria-live values include: (select all that apply)
A. aria-live=”assertive”
B. aria-live=”rude”
C. aria-live=”polite”
D. aria-live=”true”
A. aria-live=”assertive”
C. aria-live=”polite”
The ARIA live region must be present on the page and must be empty before inserting the content to be announced.
A. True
B. False
A. True
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
B. Provide a warning when the time limit is about to expire
C. Provide an option to extend the session
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.
A. True
B. False
B. False
When a session ends prematurely for a user, there is a risk of data loss. Even if the website warns the user about the timeout, other events may intervene to cause the user to not be able to extend the session. The user may need to step away from the computer to attend to other business, for example, or may be distracted by other things happening in the room. Just because the user doesn’t extend the session, you shouldn’t assume that the user has chosen to abandon and permanently lose her data.
Even if the user is warned ahead of time about the session timeout, the user may not realize that data might be lost when the session ends.
ARIA live announcements should be used to announce the the time left on a countdown timer every time the visible time remaining changes.
A. True
B. False
B. False
Countdown features MUST NOT post ARIA live so frequently that they become overwhelming to screen reader users.
Countdown features SHOULD post ARIA live announcements at strategic intervals. For example, the timer could notify the user at 15-minute intervals, at 2 minutes remaining, and at 1 minute remaining.
Accessibility problems associated with automatically refreshing or reloading a page include:
A. Users may not have time to read content before it disappears
B. Users may lose their place on the page
C. Users may have a seizure
D. A and B
E. All of the above
D. A and B
A. Users may not have time to read content before it disappears
B. Users may lose their place on the page
- The page MUST NOT refresh or reload automatically.
- A web page MAY notify the user when a refresh is recommended.
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.
A. True
B. False
A. True
If the update is urgent, use a dialog, or similar to notify the user. Send the focus to the dialog to ensure good keyboard accessibility, and allow users to choose to refresh the page or to return without refreshing the page.
If the update is not urgent, consider less intrusive methods of notifying users, such as an ARIA alert message that is visible on the screen and announced by screen readers, but that does NOT steal the keyboard focus.
Regarding portions of content in a page that load more slowly than the main page itself, which of the following statements are true? (select all that apply)
A. This technique is often referred to as “lazy loading.”
B. Loading the main page content and AJAX content at a different rates detracts from the overall user experience.
C. Placeholders (graphic or textual) should be used to inform users when the content is still being loaded.
D. Content should be automatically announced by screen readers as it is loaded.
A. This technique is often referred to as “lazy loading.”
C. Placeholders (graphic or textual) should be used to inform users when the content is still being loaded.
“Lazy loading” AJAX content SHOULD NOT be announced as it loads.
Infinite scrolling may prevent a user from accessing information that comes after the infinite scrolling area.
A. True
B. False
A. True
- An “infinite scrolling” feature MUST allow users to reach all areas of the page with the keyboard.
- An “infinite scrolling” feature MAY be activated only at the user’s request. e.g. “load more” button
Infinite scrolling can be implemented accessibly if it: (select all that apply)
A. Has a screen-reader only method for skipping past the scrolling content.
B. Is the last feature on the page, i.e., no content follows it.
C. Can be activated (i.e., turned on) by the user.
D. Infinite scrolling can not be implemented accessibly.
B. Is the last feature on the page, i.e., no content follows it.
C. Can be activated (i.e., turned on) by the user.
An “infinite scrolling” feature MUST allow users to reach all areas of the page with the keyboard.
- An “infinite scrolling” feature MUST allow users to reach all areas of the page with the keyboard.
- An “infinite scrolling” feature MAY be activated only at the user’s request.
Interstitial views are intended to be temporary and therefore it is not required to make screen reader users aware of their presence.
A. True
B. False
B. False
Screen reader users MUST be informed when a web page launches an interstitial view, a progress indicator, or enters into a paused or busy state.
An interstitial view is effectivly an “in between” page. The interstitial web page sits between a referenced page and the page which references it—hence it is in between two pages.
An good example is, when the user activates the button to launch the interstitial view, the original view disappears and is replaced by the interstitial view. The screen reader reads the content of that view because it is in an aria-live region. When the interstitial view goes away, the original page returns, with the addition of new content that is read by the screen reader.
