Non-Conformance Demo for WCAG 2.1 Success Criterion 1.3.1 Info and Relationships (Level A)

1.3.1 Non-Conformance Shown with Non-Technical Explanation


Caboose and other train cars at the Baltimore and Ohio Railroad Museum

The caption uses a heading for formatting. During screen reader testing, JAWS version 18 and NVDA version 2020.1 each announced the heading level before announcing the text, implying the start of a new section. This creates an ambiguity regarding whether the text is a photo caption expanding on the alternative text or a section header.

1.3.1 Non-Conformance HTML Markup and Technical Details

The following HTML markup occurs beginning on line 26 of this page:

<p><img src="caboose.jpg" class="nondecorative" alt="caboose"></p>
<h3>Caboose and other train cars at the Baltimore and Ohio Railroad Museum</h3>

The h3 tag should only be used for the level 3 heading element. Headings should only be used to define document structure. Misuse of headings is one of the odder categories of non-conformance. Proper heading use helps with search engine optimization. On this page there is one level 1 heading at the top of the page to define the entire page and four level 2 headings, one for each section of the page. There are headers for other Pithy Guide URLs, because those aren't part of the previous section.