WCAG in Practice

Learn · Certification

Preparing for CPACC

The Certified Professional in Accessibility Core Competencies (CPACC) is offered by the International Association of Accessibility Professionals (IAAP). This page collects study resources and shows how WCAG in Practice can support hands-on practice alongside your reading.

CPACC covers disabilities, standards, AT, universal design, and ethics for professionals in many roles. WCAG in Practice's interactive demos are optional hands-on practice for the web and UI implementation slice of that body of knowledge, not the whole exam.

IAAP CPACC overview (opens in a new tab)Back to Learn

How to study effectively

CPACC is broad: disabilities, standards, assistive technology, universal design, and ethics. Mix official materials with community guides, then reinforce concepts by building and testing real UI.

  • Take extensive notes in your own words. The exam tests understanding, not recognition of definitions alone.
  • Use mnemonics for lists you see often (WCAG success criteria groups, disability categories, AT types).
  • Pair reading with practice: run a screen reader through your own site after each study block.
  • Use the official sample questions to learn IAAP phrasing, then verify answers against WCAG and the Body of Knowledge.

After each study block, spend 15-20 minutes in the go to playground on the pattern that maps to what you just read. Building and testing UI reinforces what the books describe.

Official and course resources

Start with IAAP's Body of Knowledge and content outline, then use sample questions to practice exam phrasing.

See also: What's new in WCAG 2.2 for a plain-language breakdown of the 9 new criteria.

Community resources I found useful

These helped me alongside official materials. Treat flashcards and third-party summaries as supplements, not replacements for WCAG and the Body of Knowledge.

Practice here after you read

WCAG in Practice is implementation-focused. Use it after you study a topic to see how broken patterns fail and how accessible code behaves.

  • Dropdown menu

    Keyboard access, ARIA roles, and operable UI components

    Open demo

  • Modal / dialog

    Focus management, dialogs, and assistive technology announcements

    Open demo

  • Alert dialog

    alertdialog vs dialog, aria-describedby warnings, safe focus order, and Escape as cancel

    Open demo

  • Form validation

    Labels, error identification, and programmatic relationships

    Open demo

  • Radio & checkbox groups

    fieldset/legend, labels, and programmatic group relationships (1.3.1)

    Open demo

  • Heading hierarchy

    Document structure, headings, and info conveyed through presentation

    Open demo

  • Icon button

    Name, role, value, and accessible naming

    Open demo

  • Image alt text

    Non-text content and meaningful alternatives

    Open demo

  • Color contrast

    Contrast minimum, use of colour, and visual presentation

    Open demo

  • Navigation

    Bypass blocks, landmarks, and keyboard navigation

    Open demo

  • Breadcrumb

    Location (2.4.8 AAA), bypass blocks (2.4.1), landmarks, and aria-current

    Open demo

  • Accordion

    Name, role, value, and expandable disclosure widgets

    Open demo

  • Tabs

    Keyboard operation, focus order, and ARIA for composite widgets

    Open demo

  • Toast / status message

    Status messages and programmatic notification of changes

    Open demo

  • Data table

    Info and relationships, tables, and programmatic structure

    Open demo

  • Combobox (autocomplete)

    Keyboard operation, combobox/listbox ARIA, and name-role-value

    Open demo

  • Site search

    Search landmark, name-role-value for controls, listbox results, and live status announcements

    Open demo

  • Infinite scroll / load more

    Status messages (4.1.3), aria-live announcements, and keyboard alternatives to scroll loading

    Open demo

  • File upload

    Name-role-value for custom upload controls, keyboard access, and programmatic status feedback

    Open demo

  • Skeleton / loading state

    Status messages (4.1.3), aria-busy, and aria-live announcements for async content

    Open demo

  • Tooltip

    Content on hover or focus (1.4.13), dismissible, and name vs description

    Open demo

  • Date picker

    Keyboard calendar grid, dialog semantics, and readable date labels

    Open demo

  • Carousel

    Keyboard operation, pause/stop/hide (2.2.2), and live region announcements

    Open demo

  • Progress indicator

    Status messages (4.1.3), progressbar semantics, and step announcements

    Open demo

  • Pagination

    Navigation landmarks, keyboard-operable controls, and current page state

    Open demo

  • Drag and drop

    Dragging movements (2.5.7), keyboard alternatives, and move announcements

    Open demo

  • Focus management (SPA)

    Focus order and meaningful sequence when content changes

    Open demo

For disability context and inclusive design framing, see Accessibility is for everyone.

CPACC certified

Built by someone who studied this exam

This playground reflects how I wished I could practice while preparing: real UI, real failures, and copy-ready fixes grounded in WCAG 2.1 and 2.2.

Go to playgroundAbout the author
Back to top