Checkpoint: Keyboard, Focus and ARIA

Question 1 of 5

• tabindex only makes it focusable; keyboard activation isn’t wired, because Enter doesn’t fire click on a div
• The onclick attribute only works with a mouse in some browsers
• tabindex must be 1 for Enter to work

Question 2 of 5

• Add tabindex=“-1” to the body so focus has somewhere to go
• Add aria-live to the dialog so the closing is announced
• Close it with dialog.close() so the browser restores focus to the opener, or focus the opener explicitly before removing anything
• Remove the close button and rely on Escape only

Question 3 of 5

• Move focus to the count after every keystroke
• A role=“status” element present from page load, updated once typing pauses
• role=“alert” on the count so it is never missed
• Put the count in the input’s placeholder

Question 4 of 5

• No, the APG requires panels to change as soon as a tab receives focus
• No, tabs must be activated with the Tab key
• Only if each tab is also a link
• Yes; this is manual activation, recommended when showing a panel is slow, for example because it loads data

Question 5 of 5

• aria-expanded belongs on the button that controls the content, not on the list
• aria-controls must be removed for aria-expanded to work
• aria-expanded only works on elements with role=“menu”