Dynamic Updates, AJAX, and Single-Page Apps Flashcards

1
Q

What are the 3 ways of notifying a user that a change has occurred?

A

Load/Reload Page

Move the Focus

ARIA Live

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

When a new page is loaded or when the same page is reloaded, most screen readers do what 3 things?

A

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

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

What are 2 accessibility considerations when loading a new page?

A

Ensure the page title accurately reflects the content of the page AND the result of any user actions.

Make it easy to navigate to the main content by providing a “Skip to Main Content” Link.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

What are 4 accessibility considerations when moving focus?

A

The container where the focus is sent must have tabindex=”-1”.

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.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

True or False. When making an Announcement, you should send the keyboard focus to the Announcement.

A

False.

Don’t send the focus just to make an announcement if moving the focus would disrupt the user’s actions, or if the disruption is not critical. Use ARIA live regions to make announcements that do not steal the keyboard focus.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

What are the 2 main kinds of ARIA live announcements?

A

aria-live=”assertive” and aria-live=”polite”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

What is an ARIA Live Region Assertive announcement?

A

Interrupt. the screen reader immediately and make the announcement.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

What is an ARIA Live Region Polite announcement?

A

Wait until the screen reader finishes reading the current sentence or item before making the announcement.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

What are 4 accessibility considerations when using ARIA Live Regions?

A

The ARIA live region must be present and must be empty before making an announcement.

ARIA live announcements should be brief.

Remove the announcement soon after it is inserted (in most cases).

If the announcement is not meant to be seen, hide with CSS clip.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

Status messages XXXX be programmatically determinable through role or properties such that they can be presented to the user by assistive technologies without receiving focus.

A

Status messages MUST be programmatically determinable through role or properties such that they can be presented to the user by assistive technologies without receiving focus.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

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

A

B. Loading or reloading a page

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

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

A. tabindex=”-1”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

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.

A

C. The element that triggers the focus change must include aria-haspopup=”true”.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

True or False: ARIA live announcements are an effective way to notify users of new content without moving the user’s focus.

A

True.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

True or False: aria-live=”assertive” always gives screen reader users updates, while aria-live=”polite” asks the user if they would like updates.

A

False.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

True or False: The ARIA live region must be present on the page and must be empty before inserting the content to be announced.

A

True

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

If there is a session time limit, users XXXX be warned before the session ends and XXXX be given time to save their data and/or extend the session.

A

If there is a session time limit, users MUST be warned before the session ends and MUST be given time to save their data and/or extend the session.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
18
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

Incomplete data XXXX be saved after a session timeout.

A

Incomplete data SHOULD be saved after a session timeout.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
19
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

Users XXXX be warned of the duration of any user inactivity that could cause data loss, unless the data is preserved for more than 20 hours when the user does not take any actions.

A

Users SHOULD be warned of the duration of any user inactivity that could cause data loss, unless the data is preserved for more than 20 hours when the user does not take any actions.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
20
Q

If a user unintentionally takes too long to a complete a task or leaves the page inactive for a period of time, it is frustrating to have to start a task all over again. What are 3 methods to avoid this?

A

Give the user at least 20 hours, regardless of inactivity, to complete the task or form.

Inform the user of the inactivity time constraint at the beginning of the task so that they can choose to prepare their information ahead of time.

Save user information.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
21
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

Timers with fixed deadlines XXXX provide users with a dynamic countdown feature, especially if the deadline is soon.

A

Timers with fixed deadlines SHOULD provide users with a dynamic countdown feature, especially if the deadline is soon.

22
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

Countdown features XXXX post ARIA live announcements at strategic intervals.

A

Countdown features SHOULD post ARIA live announcements at strategic intervals.

23
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

Countdown features XXXX post ARIA live so frequently that they become overwhelming to screen reader users.

A

Countdown features MUST NOT post ARIA live so frequently that they become overwhelming to screen reader users.

24
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

If the timing is critical, a dynamic countdown XXXX be included in the page .

A

If the timing is critical, a dynamic countdown MAY be included in the page .

25
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

If the timing is critical, the dynamic countdown timers and alerts XXXX be included across all relevant pages on the site.

A

If the timing is critical, the dynamic countdown timers and alerts SHOULD be included across all relevant pages on the site.

26
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

When retrieving new content or data, the page XXXX refresh or reload automatically.

A

When retrieving new content or data, the page MUST NOT refresh or reload automatically.

27
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

A web page XXXX notify the user when a refresh is recommended.

A

A web page MAY notify the user when a refresh is recommended.

28
Q

What are 2 methods for alerting a user that a refresh may be necessary to have the latest content on the page?

A

If the update is urgent, use a dialog, or similar to notify the user.

If the update is not urgent, consider less intrusive methods of notifying users, such as an ARIA alert.

29
Q

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

A

E. B and C

30
Q

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.

A

B. False

31
Q

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.

A

B. False

32
Q

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

A

D. A and B

33
Q

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.

A

A. True

34
Q

What are the 2 biggest issues when AJAX is used to update content?

A

Knowing when and how to notify screen reader users about the new content, and

Focus management

35
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

Placeholders for AJAX content XXXX inform screen reader users that the content is loading.

A

Placeholders for AJAX content SHOULD inform screen reader users that the content is loading.

36
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

“Lazy loading” AJAX content XXXX be announced as it loads.

A

“Lazy loading” AJAX content SHOULD NOT be announced as it loads.

37
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

An “infinite scrolling” feature XXXX allow users to reach all areas of the page with the keyboard.

A

An “infinite scrolling” feature MUST allow users to reach all areas of the page with the keyboard.

38
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

An “infinite scrolling” feature XXXX be activated only at the user’s request.

A

An “infinite scrolling” feature MAY be activated only at the user’s request.

39
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

Screen reader users XXXX be informed when a web page launches an interstitial view, a progress indicator, or enters into a paused or busy state.

A

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.

40
Q

What are 2 options for alerting a screen reader user to the fact that an interstitial is displayed?

A

Move the focus to the interstitial message.

OR

Announce the interstitial message via an ARIA live region.

41
Q

What are the 2 main accessibility problems that need to be solved when creating a Single Page App (SPA)?

A

Notifying users when new content is loaded (silence is bad).

Managing keyboard focus.

42
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

Screen reader users XXXX be made aware when new “pages” are loaded in single-page applications.

A

Screen reader users SHOULD be made aware when new “pages” are loaded in single-page applications.

43
Q

What are the 2 main ways to notify the user when new AJAX content has loaded?

A

Move the focus to the new content.

Announce the new content via aria-live.

44
Q

How much time is a good delay for when you send focus to the final destination?

A

About 1 second

45
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

The browser history XXXX be updated when an AJAX event is the result of clicking on a link OR if the event is such that a user would expect to be able to use the “back” button after the event.

A

The browser history MUST be updated when an AJAX event is the result of clicking on a link OR if the event is such that a user would expect to be able to use the “back” button after the event.

46
Q

MUST (NOT), SHOULD (NOT), MAY (NOT)

The page XXXX respond appropriately when the user activates back or forward functionality in the browser.

A

The page MUST respond appropriately when the user activates back or forward functionality in the browser.

47
Q

While portions of a page are still loading (lazy loading):

A. Screen Readers should announce every time new content has loaded.
B. Placeholders for content that is still loading should inform users the content is being loaded.
C. Newly loaded content should receive screen reader focus.
D. None of the above; this technique should be avoided.

A

B. Placeholders for content that is still loading should inform users the content is being loaded.

48
Q

True or False: Infinite scrolling may prevent a user from accessing information that comes after the infinite scrolling area.

A

True

49
Q

True or False: Giving a screen-reader only method for skipping past scrolling content is an acceptable method for implementing infinite scrolling accessibly.

A

False

50
Q

True or False: Interstitial views are intended to be temporary and therefore it is not required to make screen reader users aware of their presence.

A

False

51
Q

Regarding single-page applications, which of the following statements is FALSE?

A. Screen reader users must be made aware of new content loaded on the page.
B. Focus management is often an essential part of making a single-page application accessible.
C. The of a single-page application should not be updated when the user has selected a link that causes an AJAX event.
D. A user must be able to use the browser’s back and forward functionality as would be expected in a non-single-page application.

A

C. The of a single-page application should not be updated when the user has selected a link that causes an AJAX event.