WCAG 2.0 AAA

WCAG 2.0 Level AAA represents the pinnacle of web accessibility standards, building upon and extending the requirements of Level A and Level AA to ensure the widest possible range of content is accessible to individuals with diverse disabilities. While achieving full AAA compliance can be exceptionally challenging for all content types, it offers unparalleled benefits for users, particularly those with significant cognitive, visual, auditory, and motor impairments.

This documentation page details the specific criteria for WCAG 2.0 Level AAA, providing guidance, examples, and best practices for developers, designers, and content creators aiming for the highest level of inclusivity.

Why WCAG 2.0 AAA Matters

Adhering to WCAG 2.0 Level AAA goes beyond meeting minimum legal or compliance requirements; it embodies a commitment to universal design and digital equity. By addressing these advanced criteria, you can significantly enhance the user experience for a broad spectrum of individuals:

• Users with Cognitive and Learning Disabilities: Criteria like Reading Level (3.1.5) and Help (3.3.5) ensure content is easier to understand and navigate, reducing cognitive load and frustration.
• Users with Severe Visual Impairments (Including Blindness and Low Vision): Enhanced contrast ratios (1.4.6), robust visual presentation options (1.4.8), and comprehensive audio descriptions (1.2.5) provide richer and more flexible access to information.
• Users who are Deaf or Hard of Hearing: Sign language interpretation (1.2.7) and detailed media alternatives (1.2.8, 1.2.9) offer complete access to audio and video content.
• Users with Motor Disabilities: The elimination of timing requirements (2.2.3) and a guarantee of full keyboard operability (2.1.3) allow users to interact with content at their own pace and without fine motor control.
• Users Prone to Seizures: Strict guidelines on flashing content (2.3.2) prevent triggering photo-sensitive epileptic seizures.

Beyond individual user benefits, embracing AAA principles can lead to a more robust, user-friendly, and maintainable codebase, ultimately expanding your audience and demonstrating leadership in digital inclusion.

WCAG 2.0 AAA Success Criteria and Requirements

WCAG 2.0 Level AAA includes all Level A and Level AA success criteria, along with the following additional criteria, organized by the four principles of accessibility:

Principle 1: Perceivable

Information and user interface components must be presentable to users in ways they can perceive.

Guideline 1.2: Time-based Media

Provide alternatives for time-based media.

• 1.2.3 Audio Description or Media Alternative (Prerecorded) (AAA): An audio description or media alternative for prerecorded video content provides equivalent information for users who cannot perceive the visual content. This often means a full transcript for the entire media, or an extended audio description.
• 1.2.5 Audio Description (Prerecorded) (AAA): Audio description is provided for all prerecorded video content. This typically refers to a separate narration track that describes visual details for users who are blind or have low vision.
• 1.2.7 Sign Language (Prerecorded) (AAA): Sign language interpretation is provided for all prerecorded audio content. This requires an in-vision interpreter signing the audio content.
• 1.2.8 Media Alternative (Prerecorded) (AAA): A media alternative for prerecorded video content is provided that presents equivalent information. This could be a text transcript that includes all dialogue and descriptions of significant visual and auditory information.
• 1.2.9 Audio Only (Live) (AAA): For live audio-only content, an alternative for time-based media is provided that presents equivalent information. This typically means live captions or a live sign language interpreter.

Guideline 1.4: Distinguishable

Make it easier for users to see and hear content including separating foreground from background.

• 1.4.6 Contrast (Enhanced) (AAA): The visual presentation of text and images of text has a contrast ratio of at least 7:1. For large text (at least 18pt or 14pt bold), the contrast ratio must be at least 4.5:1. This is a higher standard than the AA requirement of 4.5:1 for normal text and 3:1 for large text.
• 1.4.7 Low or No Background Audio (AAA): For prerecorded audio-only content that contains speech, the audio does not contain background sounds, or the background sounds are at least 20 decibels lower than the speech content, with the exception of occasional sound effects that last no longer than two seconds. This ensures speech is clear and easily understood.
• 1.4.8 Visual Presentation (AAA): For the visual presentation of blocks of text, a mechanism is available to achieve all of the following: foreground and background colors can be selected by the user; width is no more than 80 characters (40 for CJK); text is not justified (left-aligned or right-aligned only); line spacing is at least 1.5; paragraph spacing is at least 2 times line spacing; and text can be resized without assistive technology up to 200% without loss of content or functionality.
• 1.4.9 Images of Text (No Exception) (AAA): Images of text are only used for purely decorative purposes, or where the text is essential to the information being conveyed (e.g., a logo with specific styling), and cannot be presented in text format. This means almost all text must be actual text, not images.

Principle 2: Operable

User interface components and navigation must be operable.

Guideline 2.1: Keyboard Accessible

Make all functionality available from a keyboard.

• 2.1.3 Keyboard (No Exception) (AAA): All functionality of the content is operable through a keyboard interface without requiring specific timings for individual keystrokes. This is a stricter version of 2.1.1, allowing no exceptions for certain functions (e.g., drag-and-drop actions that can’t be replicated via keyboard).

Guideline 2.2: Enough Time

Provide users enough time to read and use content.

• 2.2.3 No Timing (AAA): Timing is not an essential part of the event or activity presented by the content, except for non-interactive synchronized media and real-time events. This eliminates forced time limits on user interactions.
• 2.2.4 Interruptions (AAA): Interruptions (such as alerts, pop-ups, or auto-updating content) can be postponed or suppressed by the user, except for emergencies. Users should have control over disruptive elements.
• 2.2.5 Re-authenticating (AAA): When an authenticated session expires, the user can re-authenticate without loss of data or needing to restart the process. This prevents loss of user progress in forms or other interactions.

Guideline 2.3: Seizures

Do not design content in a way that is known to cause seizures.

• 2.3.2 Three Flashes or No Flash (AAA): Web pages do not contain anything that flashes more than three times in any one-second period. This is an absolute prohibition to prevent triggering photosensitive epilepsy.

Principle 3: Understandable

Information and the operation of user interface must be understandable.

Guideline 3.1: Readable

Make text content readable and understandable.

• 3.1.5 Reading Level (AAA): When text requires reading ability more advanced than the lower secondary education level (approximately 9th grade in the U.S. education system), supplemental content is available, or a version that does not require reading ability more advanced than the lower secondary education level is provided. This targets users with cognitive and learning disabilities.
• 3.1.6 Pronunciation (AAA): A mechanism is available for identifying specific pronunciation of words where the meaning of the words is ambiguous without knowing the pronunciation. This can be crucial for languages with many homographs or loanwords.

Guideline 3.2: Predictable

Make web pages appear and operate in predictable ways.

• 3.2.5 Change on Request (AAA): Changes of context are initiated only by user request, or a mechanism is provided to turn off such changes. This prevents unexpected shifts in focus, new windows opening, or page reloads without explicit user action.

Guideline 3.3: Input Assistance

Help users avoid and correct mistakes.

• 3.3.5 Help (AAA): Context-sensitive help is available. This means that at any point in a process or form, users can access information relevant to their current task or field.
• 3.3.6 Error Prevention (All) (AAA): For web pages that require the user to submit information, data loss, or the result of a legal commitment or financial transaction, the system provides one of the following: (1) Reversible, (2) Checked, or (3) Confirmed. This is a very high standard for critical actions to prevent severe user errors.

Principle 4: Robust

Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies.

(Note: WCAG 2.0 does not define specific AAA success criteria under the Robust principle. Compliance with A and AA criteria under this principle is generally sufficient to meet the spirit of AAA for robustness.)

Practical Guidelines for WCAG 2.0 AAA Compliance

• Comprehensive Media Alternatives: For all video, provide a full text transcript, extended audio descriptions that verbally describe all significant visual information (including scene changes, character expressions, and on-screen text), and, where appropriate, sign language interpretation. For live audio-only, ensure real-time captions or a live text transcript is available.
• Extreme Contrast: Design your visual interfaces with minimum 7:1 contrast for normal text and 4.5:1 for large text. Use tools like the WebAIM Contrast Checker to verify compliance.
• Configurable Text Presentation: Empower users to customize their reading experience. Provide options (e.g., via user settings, or through robust CSS that allows user stylesheet overrides) to control font colors, background colors, text width, alignment, and line/paragraph spacing.
• Eliminate Timed Interactions: Avoid any functionality that imposes time limits on users, such as session timeouts for non-critical activities or timed quizzes. If timing is essential (e.g., for security reasons), provide clear options to extend or turn off the time limit.
• Control Over Interruptions: Design pop-ups, alerts, and auto-updating content to be user-initiated or easily dismissible/suppressible. Never force users into unexpected content changes.
• Seamless Re-authentication: For any authenticated sessions, ensure that if a session expires, the user can re-authenticate and continue their task from where they left off, without losing data or progress.
• Zero Flashing Content: Absolutely no content should flash more than three times in any one-second period. This includes GIFs, videos, or CSS animations.
• Clear and Simple Language: Aim for a reading level understandable by a lower secondary education audience (around 9th grade). For complex topics, provide simplified summaries, glossaries, or alternative versions of content.
• Pronunciation Guidance: For technical terms, proper nouns, or words that might be ambiguous, provide phonetic spellings or audio pronunciations, perhaps in a glossary or as inline annotations.
• Predictable Interactions: Avoid automatic context changes (e.g., opening new windows, submitting forms on change) unless explicitly requested by the user. If such changes are necessary, provide a mechanism for users to disable them.
• Robust Help Mechanisms: Provide context-sensitive help for all form fields and complex interactions. This could be inline help text, tooltips, or links to relevant help documentation that opens without changing the user’s current context.
• Advanced Error Prevention: For critical actions (e.g., financial transactions, legal agreements), provide at least one of the following: the ability to reverse the action, a mechanism to check and confirm the data before submission, or a robust confirmation step before the action is finalized.

Examples of Correct and Incorrect Implementations

Example: Contrast (Enhanced) (1.4.6)

Ensuring a 7:1 contrast ratio for normal text.

<p style="color: #777; background-color: #f0f0f0;">This text has a low contrast ratio...</p>

<p style="color: #333; background-color: #fff;">This text has a high contrast ratio...</p>

Example: Audio Description (Prerecorded) & Media Alternative (1.2.5, 1.2.8)

Providing comprehensive access to video content.

<video controls src="my-video.mp4">
  <track kind="captions" srclang="en" label="English Captions" src="my-video-captions.vtt">
</video>

<video controls src="my-video.mp4">
  <track kind="captions" srclang="en" label="English Captions" src="my-video-captions.vtt">
  <track kind="descriptions" srclang="en" label="Extended Audio Description" src="my-video-audio-description.vtt">
  <a href="my-video-transcript.html">Full Text Transcript (including visual descriptions)</a>
  <!-- Optionally, for 1.2.7 Sign Language -->
  <a href="my-video-sign-language.mp4">Sign Language Interpretation</a>
</video>

Example: No Timing (2.2.3) & Interruptions (2.2.4)

Giving users control over their time and experience.

// JavaScript (conceptual)
setTimeout(() => {
  alert('Your session will expire in 60 seconds!');
  window.location.href = '/logout'; // Auto-redirects
}, 5 * 60 * 1000); // 5 minutes session without warning/extension

// A pop-up that appears after 10 seconds of inactivity
setTimeout(() => {
  document.getElementById('promo-modal').style.display = 'block';
}, 10 * 1000);

// JavaScript (conceptual)
let sessionTimeoutId;
function resetSessionTimeout() {
  clearTimeout(sessionTimeoutId);
  sessionTimeoutId = setTimeout(() => {
    showSessionWarning();
  }, 20 * 60 * 1000); // 20 minutes before warning
}

function showSessionWarning() {
  // Display a modal that allows user to extend session
  const warningModal = document.getElementById('session-warning-modal');
  warningModal.style.display = 'block';
  // User clicks 'Extend Session' button to call resetSessionTimeout()
}

// HTML for a non-interruptive alert
<div id="success-alert" role="status" aria-live="polite" style="display: none;">
  Item added to cart! <button onclick="document.getElementById('success-alert').style.display='none'">Dismiss</button>
</div>

Example: Error Prevention (All) (3.3.6)

Ensuring critical actions are protected from irreversible errors.

<form action="/delete-account" method="post">
  <button type="submit">Delete My Account</button>
</form>

<form action="/delete-account" method="post" onsubmit="return confirm('Are you sure you want to delete your account? This action can be undone within 30 days.')">
  <label for="confirm-delete">
    <input type="checkbox" id="confirm-delete" name="confirm-delete" required>
    I understand my account will be deleted.
  </label><br>
  <button type="submit">Delete My Account</button>
</form>

Best Practices and Common Pitfalls for AAA Compliance

Best Practices:

• Integrate from the Start: Build AAA considerations into your design and development workflow from the very beginning. Retrofitting is significantly more difficult and costly.
• User-Centered Design: Conduct extensive user testing with individuals across the spectrum of disabilities to identify real-world barriers.
• Specialized Expertise: Recognize that AAA often requires specialized accessibility expertise, such as professional sign language interpreters or audio description narrators.
• Progressive Enhancement: While AAA is a high bar, ensure your core content is accessible at lower levels, then progressively enhance for AAA features.
• Document and Maintain: Keep clear documentation of your accessibility features and regularly audit your content to ensure ongoing compliance.

Common Pitfalls:

• Scope Creep: Trying to apply AAA to every piece of content, which can be impractical. Prioritize critical content and core user flows for AAA, while ensuring all content meets at least AA.
• Automated Tools Alone: Relying solely on automated accessibility checkers. Many AAA criteria (e.g., audio descriptions, reading level, sign language) require manual review and human judgment.
• Ignoring Cognitive Needs: Often overlooked, cognitive accessibility is a significant component of AAA. Don’t assume clear visuals and keyboard navigation are enough.
• Inconsistent Implementation: Applying AAA principles inconsistently across a site or application can lead to a fragmented and confusing user experience.
• Lack of Budget/Resources: AAA often requires significant investment in content creation (e.g., transcribing, audio description, sign language) and design flexibility. Underestimating these needs can lead to project failure.

Conclusion

Achieving WCAG 2.0 Level AAA compliance demonstrates the highest level of commitment to web accessibility. While demanding, the benefits of creating a truly inclusive digital experience for the widest possible audience are profound. By carefully integrating these advanced criteria into your development process and leveraging best practices, you can build web content that is usable and understandable by everyone.