The Four POUR Principles — Foundation of WCAG

In this tutorial, you will learn about The Four POUR Principles. We cover key concepts, practical examples, and best practices to help you master this topic.

WCAG's four POUR principles — Perceivable, Operable, Understandable, Robust — organize all 86 success criteria into categories that address how users perceive content, operate interfaces, understand information, and access content robustly.

What You'll Learn

You will learn the meaning of each POUR principle, which guidelines fall under each, and how to apply the principles as a mental model for Accessibility thinking.

Why It Matters

The POUR principles are the foundation of all WCAG criteria. Once you understand the principles, you can reason about accessibility even without memorizing specific success criteria.

Real-World Use

DodaTech uses the POUR principles as a quick accessibility checklist before every release. If a feature fails any principle, it does not ship.

flowchart TD
  A[POUR Principles] --> B[Perceivable]
  A --> C[Operable]
  A --> D[Understandable]
  A --> E[Robust]
  B --> F[Users can perceive content]
  B --> G[Guidelines 1.1-1.4]
  C --> H[Users can operate interface]
  C --> I[Guidelines 2.1-2.5]
  D --> J[Users can understand content]
  D --> K[Guidelines 3.1-3.3]
  E --> L[Content works with assistive tech]
  E --> M[Guideline 4.1]

Perceivable

Information and user interface components must be presentable to users in ways they can perceive. This means providing text alternatives for non-text content, captions for multimedia, content that can be presented in different ways, and content that is easy to see and hear.

Four guidelines under this principle:

• 1.1 Text Alternatives
• 1.2 Time-based Media
• 1.3 Adaptable
• 1.4 Distinguishable

Operable

User interface components and navigation must be operable. This means all functionality must be available from a keyboard, users must have enough time, content must not cause seizures, and users must be able to navigate and find content.

Five guidelines under this principle:

• 2.1 Keyboard Accessible
• 2.2 Enough Time
• 2.3 Seizures
• 2.4 Navigable
• 2.5 Input Modalities

Understandable

Information and the operation of the user interface must be understandable. This means text must be readable and understandable, content must appear and operate predictably, and users must be able to avoid and correct mistakes.

Three guidelines under this principle:

• 3.1 Readable
• 3.2 Predictable
• 3.3 Input Assistance

Robust

Content must be robust enough to be interpreted reliably by a wide variety of user agents including assistive technologies. This means maximizing compatibility with current and future user agents.

One guideline under this principle:

• 4.1 Compatible

<!-- Applying all four POUR principles -->
<section aria-labelledby="scan-results">
  <h2 id="scan-results">Scan Results</h2>
  <!-- Perceivable: alt text on icon -->
  <img src="shield-icon.svg" alt="" aria-hidden="true">
  <!-- Operable: button works with keyboard -->
  <button type="button" onclick="refreshScan()">Refresh</button>
  <!-- Understandable: clear error message -->
  <p role="alert">Scan could not connect. Check your internet.</p>
  <!-- Robust: semantic HTML with ARIA -->
  <div role="status" aria-live="polite">
    Last scanned: 2 minutes ago
  </div>
</section>

Common Mistakes

1. Forgetting That Principles Are Not Criteria

The principles are broad categories. Each has specific testable success criteria under it.

2. Focusing Only on Perceivable

Perceivable gets the most attention (alt text, captions, contrast). Operable and Understandable are equally important.

3. Neglecting Robust

The Robust principle (valid HTML, ARIA) is often forgotten but enables all assistive technologies to work.

4. Confusing Operable with Understandable

Operable means users can physically interact. Understandable means users can comprehend. They are different.

5. Not Using Principles as a Mental Model

The POUR acronym is a powerful thinking tool. Use it when designing any new feature.

6. Treating Principles as Optional

Every success criterion belongs to one principle. Ignoring a principle means ignoring all its criteria.

7. Not Checking All Four for Each Feature

When building a feature, ask: can users perceive it, operate it, understand it, and does it work with assistive tech?

Practice Questions

1. What are the four POUR principles?

Perceivable, Operable, Understandable, Robust.

2. How many guidelines are under each principle?

Perceivable: 4, Operable: 5, Understandable: 3, Robust: 1.

3. What does the Robust principle mean?

Content must be robust enough to be interpreted by a wide variety of user agents including assistive technologies.

4. What is the difference between Operable and Understandable?

Operable means users can physically interact with the interface. Understandable means users can comprehend the content and operation.

5. Challenge: For a feature you built recently, evaluate it against each POUR principle. Identify at least one gap per principle.

FAQ

Mini Project

Create a one-page POUR principles reference. For each principle, write a one-sentence definition and list the guidelines under it. Post it in your workspace.

What's Next

Learn about Conformance Levels A, AA, and AAA and how to choose the right target. Then explore Perceivable Guidelines 1.1 through 1.4 in depth.