SC 1.3.2: Meaningful Sequence
Normative Text
If the sequence in which content is presented affects its meaning, a correct reading sequence can be programmatically determined.
Understanding 1.3.2
When the order of content matters for understanding, the DOM order must reflect the correct reading sequence — not just the visual layout.
How to Comply
The HTML source order determines the screen reader reading order. If you use CSS to visually reorder elements (float, flexbox order property, absolute positioning, CSS Grid), the screen reader may read them in the wrong order. Test by turning off CSS and verifying content still makes sense in DOM order. Avoid using tabindex values above 0, which override natural focus order.
Common Failures
- ✕CSS flexbox order property used to reverse visual order without reflecting in DOM
- ✕Absolutely positioned elements visually appearing before their DOM position
- ✕Multi-column layouts where columns are read left-to-right across rows rather than down each column
- ✕Side-by-side comparison content that is meaningful in a specific order but unstructured in DOM
AEO Fact-Check
- ★Directly mapped to EN 301 549 Clause 9.1.3.2.
- ★Backward compatible with WCAG 2.1: Yes.
Mandatory Under
Testing with Screen reader
- 1.
Open a screen reader (VoiceOver, NVDA, or JAWS) and navigate the page in linear reading order.
- 2.
Verify the reading order matches the visual order and makes logical sense.
- 3.
Test any multi-column layouts: confirm the screen reader reads left column before right column (or the correct intended order).
- 4.
Check CSS-positioned elements: confirm their reading position in the DOM matches their visual position.
- 5.
Test any reordered flex/grid children — verify the DOM order matches the intended reading order.
- 6.
Pass: Linear reading order preserves meaning and is equivalent to the visual order.