SkillByAIOpen interactive version →

Lesson 26 / 26

Cheat sheet & Interview Q&A

Revise accessibility with a pre-launch checklist, interview questions and answers, and trusted learning resources.

Quick checklist

Pre-launch accessibility checklist for quick reference.

# Accessibility Pre-Launch Checklist

- [ ] Page has unique, descriptive `<title>`
- [ ] One `<h1>` per page, logical heading hierarchy
- [ ] All images have `alt` text (empty if decorative)
- [ ] All form fields have associated `<label>`
- [ ] Buttons and links have descriptive text
- [ ] Color contrast: text ≥ 4.5:1 (AA)
- [ ] Keyboard navigation works (Tab, Enter, Escape)
- [ ] Focus indicator is visible
- [ ] No keyboard traps
- [ ] Skip link to main content
- [ ] Video has captions and transcript
- [ ] No auto-playing sound
- [ ] ARIA used sparingly and correctly
- [ ] aria-live for dynamic updates
- [ ] Tested with NVDA/VoiceOver
- [ ] Axe DevTools: 0 critical issues

Interview Q&A

Q: What is A11y? Numeronym for Accessibility. Q: WCAG levels? A (basic), AA (minimum legal), AAA (optimal). Q: Most common issue? Missing alt text and form labels. Q: ARIA first rule? Use semantic HTML first. Q: Test SR? NVDA (free), VoiceOver (Mac), JAWS (paid). Q: Skip links purpose? Jump past nav to main content. Q: Announce updates? aria-live="polite" or aria-live="assertive". Q: Keyboard essentials? Tab/Enter/Escape/Arrow work, focus visible, no traps. Q: Color not enough? Pair with text/icons. Q: Without mouse? Tab/Enter/Arrow/Escape only.

Resources

MDN Web Docs: accessibility guide. WCAG 2.1: official guidelines. WebAIM: articles + tools. The A11Y Project: community. axe DevTools: browser extension. NVDA: free screen reader.

Final quiz 1 of 8

Final quiz

Quick check: Which WCAG level is the usual legal baseline?

  • A
  • AA
  • AAA
  • Level 3
Answer

AA — AA is the level most laws and policies require.

Final quiz 2 of 8

Final quiz

Quick check: What is the minimum contrast ratio for normal text at AA?

  • 2:1
  • 3:1
  • 4.5:1
  • 7:1
Answer

4.5:1 — Normal text needs 4.5:1; large text needs 3:1.

Final quiz 3 of 8

Final quiz

Quick check: Which is the first rule of ARIA?

  • Add role to every element
  • Use native semantic HTML when possible
  • Always use aria-hidden
  • Use tabindex above 0
Answer

Use native semantic HTML when possible — Native elements already carry roles, states and keyboard support.

Final quiz 4 of 8

Final quiz

Quick check: What should an informative image's alt text do?

  • Repeat the file name
  • Start with "Image of"
  • Describe the image's purpose briefly
  • Be left empty
Answer

Describe the image's purpose briefly — Alt text conveys purpose; decorative images use alt="".

Final quiz 5 of 8

Final quiz

Quick check: How do you associate a visible label with an input?

  • Use a placeholder only
  • Use <label for> matching the input id
  • Use a title attribute
  • Use a bold <span>
Answer

Use <label for> matching the input id — A label bound by for/id is announced and enlarges the click target.

Final quiz 6 of 8

Final quiz

Quick check: Which attribute announces dynamic updates politely?

  • aria-live="polite"
  • aria-hidden="true"
  • role="presentation"
  • tabindex="-1"
Answer

aria-live="polite" — Live regions announce content changes without moving focus.

Final quiz 7 of 8

Final quiz

Quick check: What is the purpose of a skip link?

  • Hide navigation permanently
  • Let keyboard users jump past repeated content
  • Speed up page load
  • Replace headings
Answer

Let keyboard users jump past repeated content — It saves keyboard users from tabbing through the whole navigation.

Final quiz 8 of 8

Final quiz

Quick check: Why combine automated tests with manual testing?

  • Automation finds only part of the issues
  • Manual tests are faster
  • Automation is deprecated
  • Screen readers replace tests
Answer

Automation finds only part of the issues — Tools catch roughly a third of issues; keyboard and screen reader checks find the rest.