Note: The creation of this article on testing Info and Relationships was human-based, with the assistance on artificial intelligence.

Explanation of the success criteria

WCAG 1.3.1 Info and Relationships is a Level A conformance level Success Criterion. It requires that information, structure, and relationships presented through content and user interface elements must also be clear through text or programmatic means.

This criterion ensures that when the presentation of content changes, such as when a screen reader is used or a user applies custom stylesheets, the conveyed information and relationships remain intact, even if they were originally communicated through visual or auditory formatting.

Both WCAG Success Criteria 1.3.1 Info and Relationships and 4.1.2 Name, Role, Value play a vital role in making web content accessible to people with disabilities, especially those who rely on assistive technologies like screen readers. Although they focus on different aspects of accessibility, they share overlapping goals and are often implemented together.

  • 1.3.1 Info and Relationships focuses on the structural relationships and meaning of content as a whole, ensuring that these are not solely dependent on sensory presentation.
  • 4.1.2 Name, Role, Value focuses specifically on user interface components, ensuring that assistive technologies can interact with them effectively by understanding their name, role, and state.

Who does this benefit?

  • Users who are blind or have low vision rely on assistive technology like screen readers to understand the structure and relationships within content. If this information is only conveyed visually, screen readers won’t be able to interpret it, leading to a confusing or unusable experience.
  • Users who are deaf-blind who use braille refreshable displays also rely on the textual representation of structural information. If relationships are only visual, these users will miss out on that crucial context.
  • Users with cognitive disabilities need a clear and logical structure, facilitated by proper use of headings, lists, and other semantic markup, to significantly improve comprehension and navigation. Programmatic structure reinforces the visual organization, making it easier to follow the content’s flow and understand the relationships between different sections.
  • Users with motor disabilities, while not the primary impact, benefit from a well-structured document which improves navigation for users who rely on keyboard-only navigation or other assistive input methods.

What’s involved in testing this Success Criterion

  • Headings: Content that looks like a heading should be coded as a heading. Likewise, content that is coded as a heading should serve a structural purpose—not be used just for visual styling.
  • Lists: Lists should be placed inside elements that correctly reflect their meaning and structure.
  • Tables: Data tables must be properly structured, with accurate row and column headers. For complex tables with multiple levels of headers, use the headers and id attributes to define relationships. Avoid using layout tables; if they must be used, ensure their semantics are removed or suppressed.
  • Landmarks: Landmark elements must have appropriate roles and accessible names. Non-landmark elements should not use landmark roles.
  • Grouped Form Controls: If form controls are grouped visually, they must also be grouped in the code.
  • Footnotes: Footnotes must be marked up in a way that makes them perceivable to all users, including those using assistive technologies.
  • Text-Level Semantics: Text-level elements like em, strong, strike, sub, sup, and q must use the correct HTML tags so their meaning is clear.
  • Hidden Content: Content that’s meant to be hidden should not be available to assistive technology users, and important visible content should not be hidden from them.
  • Information Properly Conveyed: Information and the way it’s organized visually must also be clear in the code.
  • User Interface Component Relationships: Connections that define a UI element’s name, role, state, properties, or value must be clear to assistive technologies.

Testing via Automated testing

Testing WCAG 2.1 Success Criterion 1.3.1: Info and Relationships via automated testing is partially possible. Automated tools can help detect missing or incorrect semantic structure in the code. It can analyze the DOM for semantic HTML, such as headings (<h1> – <h6>), lists (<ul>, <ol>, <li>), tables (<table>, <thead>, <th>, <td>), and form elements are used correctly. It can validate whether appropriate landmarks (banner, main, navigation) and ARIA roles (role="main") are implemented. It can check for footnote links or references, focusability, and semantic markup.

For instance, using a tool, such as TPGi’s browser extension ARC Toolkit, you can run a scan on a page to check for appropriate uses of heading markup, landmarks, lists, tables, and more. The tool also presents an annotated page that highlights these elements and flags any errors for manual visual inspection.

TPGi's browser extension ARC Toolkit presenting annotated headings on the web page.
TPGi’s browser extension ARC Toolkit presenting annotated headings on the web page.

Automated testing does have limitations. It cannot determine whether visual relationships are conveyed programmatically. For instance, it cannot identify whether form fields prompting for related information, like a shipping address, include a proper group label (using <fieldset>/<legend>). It also cannot verify the accuracy or clarity of labels and names. Additionally, it cannot check whether footnotes appear in a way that screen readers can announce clearly, confirm clarity and context, detect improperly exposed visually hidden footnotes, or evaluate whether the navigation flow between footnote references and the footnotes themselves remains logical and usable.

Testing via Artificial Intelligence (AI)

AI-based accessibility testing tools can significantly enhance automated checks by understanding layout and context better than rule-based tools. They analyze visual layout and context, detect missing or improper use of headings and landmarks, identify potential relationship issues, and suggest fixes with some contextual understanding.

However, AI-based accessibility testing tools cannot fully replace manual testing when verifying information and relationships, especially in complex or nuanced content. AI still can’t confirm with certainty whether complex information and relationships are programmatically conveyed in a way that fully supports assistive technologies. AI also struggles to determine how meaningful or logical those relationships are to users, particularly in complex layouts. For these reasons, manual testing, including screen reader use and keyboard navigation, remains essential.

Testing via Manual testing

Manual accessibility testing is the most thorough way to test WCAG 1.3.1 Info and Relationships because it involves human judgment and real user context, which automated tools lack. A human tester can check whether the developer has correctly coded and logically organized headings, lists, tables, and form groups. They can confirm that visual groupings have matching programmatic groupings (e.g. <fieldset> and <legend>) for grouped form controls). Human testers can use screen readers (JAWS, NVDA, VoiceOver) to verify that labels, headers, and descriptions are announced correctly. They can navigate using only the keyboard to confirm a logical focus order and grouping. They can compare the visual layout to the DOM structure to ensure alignment and check whether visual information (such as icons, colors, or spatial grouping) is also conveyed programmatically. For complex tables or widgets, human testers can confirm that ARIA roles, properties, and relationships are used correctly. They can also validate proper use of multiple header levels and associations through headers and ID attributes. Human testers are also best equipped to determine whether the presentation of information and relationships is meaningful and usable, and to identify anything that might confuse assistive technology users.

With all of that, you might think that human manual testing is the only way to test for 1.3.1 Info and Relationships. However, manual testing does have its downsides. It requires significant labor, depends on the tester’s level of expertise, and is difficult to scale or standardize without strong process support.

Which approach is best?

No single approach to testing 1.3.1 Info and Relationships is perfect. However, combining the strengths of each method can produce better results.

Automated and AI tools identify many technical issues and accelerate the testing process. Human testers conducting manual testing can understand context, intent, and usability. Manual testing simulates real user experiences and captures nuances that machines often miss. To maximize coverage, combine manual testing with automated and AI tools, and use structured checklists or heuristics to minimize subjectivity and ensure consistency.

Related Resources