DOCSEARCHbyAlgolia
Submit Docs

Web Content Accessibility Guidelines (WCAG) 3

repository·main·Indexed 41 days ago

https://github.com/w3c/wcag3

The repository for the upcoming WCAG 3, utilizing an Astro-based system to manage normative guidelines, provisions, and glossary terms from Markdown and JSON. It includes tools for defining ACT rules, recommended practices, and methods, as well as custom directives for accessibility documentation and a local development environment using Node.js.

Tokens
35.6K
Snippets
33
Records
261
Agent score
51%

What's inside WCAG 3

  1. Consistent Identification of functional components

    main

    The goal of consistent identification is to ensure that functional components (like buttons, links, or toggles) that appear repeatedly across a set of web pages use consistent labels or accessible names.

    Key Principles

    • Predictability: Users, especially those using screen readers, rely on familiarity. If a function has different labels on different pages, it increases cognitive load and makes navigation difficult.
    • Scope: This criterion specifically addresses consistency within a set of web pages where elements are repeated. While consistency within a single page is recommended, this rule focuses on the relationship between multiple pages.
    • Text Alternatives: Consistency applies to icons and non-text items as well. If icons perform the same function, their text alternatives must be consistent.
    • Functional Distinction: If components have different functions, they should have different labels. Consistency is required for components that perform the same function.

    Examples of Success vs. Failure

    • Success (Consistent but not identical): A printer icon labeled "Print receipt" in one section and "Print invoice" in another is consistent because it follows a predictable pattern ("Print [item]") for the same type of action.
    • Success (Consistent references): Links labeled "page 2", "page 3", etc., are considered consistent because they follow a predictable pattern for navigation.
    • Failure (Inconsistent labels for same function): A "search" button on one page and a "find" button on another page that perform the same task is a failure.
    • Failure (Inconsistent accessible names): Two buttons that look identical visually but have different aria-label attributes are a failure, as assistive technology will announce them differently.

  2. Rule: No repetitive adjacent interactive elements

    main

    This rule ensures that a page or view does not contain adjacent interactive elements that achieve the same outcome, unless those elements are specifically intended to dismiss the same element (e.g., multiple ways to close a modal).

    Applicability

    The rule applies to any page or view where an author has provided a custom keyboard command.

    Expectation

    The custom keyboard command must be:

    1. Documented.
    2. Programmatically available from any page/view to which it applies.
    3. Visually available from any page/view to which it applies.

  3. Rule: Custom keyboard commands are documented

    main

    This rule ensures that any custom keyboard commands provided by an author are documented and that this documentation is both programmatically and visually available from any page or view where the commands apply.

    Applicability

    Applies to any page or view containing custom keyboard commands.

    Expectation

    Custom keyboard commands must be:

    1. Documented: The meaning and key usage must be explained.
    2. Visually Available: Users can see the documentation on the page/view.
    3. Programmatically Available: Assistive technologies can determine the documentation (e.g., via related description text or accessible dialogs).

  6. Understand the WCAG 3 project structure

    main

    The project is built with Astro. The content is organized into specific directories:

    • guidelines/: The core normative document content.
      • acknowledgements/: Acknowledgement sections (ordered via index.json).
      • groups/: Grouping sections (ordered via index.json). Subdirectories contain {group-name}.json (defines order/status of guidelines) and {group-name}/ (contains guideline Markdown files).
      • terms/: Glossary terms.
    • informative/: Content for informative pages.
    • src/lib/markdown/: Remark and rehype plugins used to transform Markdown output.

  7. Understand the intent of the Consistency Across Views guideline

    main

    The goal of this guideline is to ensure users can locate, recognize, and navigate content through consistent navigation, structure, order, and labeling.

    Key benefits include:

    • Predictability: Allows users to apply knowledge from one page/view to another, reducing cognitive load.
    • Spatial Consistency: Helps users with screen magnifiers or limited fields of view by placing repeated components in the same relative order.
    • Cognitive Support: Reduces the need to re-learn layouts or terminology for the same functionality.
    • Mental Models: Helps users with visual, motor, or cognitive disabilities maintain a reliable mental model of how to interact with the application.

  8. Verify enhanced pointer availability

    main

    To test if a pointer indicator meets the requirements for enhanced availability, follow this procedure:

    1. Check for visibility settings: Verify that the interface provides a setting specifically designed to increase or adjust the visibility of the pointer indicator.
    2. Verify conformance scope: Ensure that the visibility setting functions correctly within the context of web pages or application views.

    Expected Results:

    • A setting to increase visibility exists.
    • The setting works as expected in the relevant conformance scope.

  10. Test for numerical metadata availability

    main

    To ensure compliance with the guideline regarding numerical metadata, follow this testing procedure for every date, temperature, time, or Roman numeral presented visually:

    1. Verify Format: Check that the visual presentation uses an unambiguous format.
    2. Verify Alternatives: Check that an alternative version in an unambiguous format is provided within the same page or view.

    Expected Result: The test passes if either condition #1 or condition #2 is true.

  11. Test for extended audio descriptions availability

    main

    To ensure media assets with visual content support extended audio descriptions, follow this procedure:

    1. For each media asset containing visual content, verify that the video includes sufficient pauses. These pauses must allow enough time for extended audio descriptions to describe the visual information presented.

  12. Verify pointer indicator visibility for pointer-visible

    main

    To ensure compliance with the pointer-visible guideline, verify that no styling (CSS) or scripting (JavaScript) is used to hide the pointer indicator.

    Testing Procedure

    If the pointer is ever not visible during interaction:

    1. Check if the state meets one of the defined exceptions for this guideline.

    Expected Result

    The pointer indicator must remain visible unless an exception applies.