Success Criterion 1.3.1 Info and Relationships

Information, structure, and relationships conveyed through presentation can be programmatically determined or are available in text.

WCAG Level
A
WCAG Versions
2.0
2.1
2.2

What the issue is

Using heading tags (h1, h2, h3, etc.) for styling purposes rather than to structure content hierarchically misleads users who rely on assistive technologies. For example, choosing an <h4> tag because it visually matches the desired text size, despite it being a primary section title that logically should be an <h1> or <h2>. This misuse of headings disrupts the document's structure, leading users to misinterpret the level of importance of various sections on the page.

What the issue is

Using headings (h1, h2, h3, etc.) improperly by skipping levels in the page structure can make it confusing for users who rely on assistive technologies to navigate web content. For example, moving directly from an h1 to an h3 heading without an intervening h2 disrupts the hierarchical structure of a page.

What the issue is

Toggle buttons that do not clearly communicate their state (e.g., "on" or "off") to the user can lead to confusion and difficulty in understanding the current state of the interface. This issue is often observed in buttons that change function or appearance when activated but do not provide adequate feedback to signify this change, especially to assistive technology users. An example of this issue is a "mute" button that changes function to "unmute" when activated but does not change its label or provides any other form of state indication.