1.3.1 (mức A) yêu cầu: quan hệ giữa các phần nội dung mà mắt nhìn ra được thì máy cũng phải đọc ra được. Mắt thấy "cột này là tiêu đề của hàng dưới", "bốn ô radio này thuộc chung một câu hỏi" — screen reader chỉ biết điều đó nếu markup nói ra.
Đây là tiêu chí bị trượt nhiều nhất trong các đợt audit, vì nó bao trùm cả heading, danh sách, bảng, form và landmark.
Bảng dữ liệu — dùng <th> kèm scope, và <caption> làm tên bảng:
<table>
<caption>Doanh thu theo quý</caption>
<thead>
<tr><th scope="col">Quý</th><th scope="col">Doanh thu</th></tr>
</thead>
<tbody>
<tr><th scope="row">Q1</th><td>1.2 tỷ</td></tr>
</tbody>
</table>Không có scope, screen reader đọc từng ô rời rạc "1.2 tỷ" mà không kèm "Q1, Doanh thu" — người dùng mất hoàn toàn ngữ cảnh. Bảng nhiều tầng tiêu đề thì dùng headers/id.
Nhóm radio hoặc checkbox — bọc bằng <fieldset> và đặt câu hỏi vào <legend>:
<fieldset>
<legend>Hình thức thanh toán</legend>
<label><input type="radio" name="pay" value="cod"> Khi nhận hàng</label>
<label><input type="radio" name="pay" value="bank"> Chuyển khoản</label>
</fieldset>Mỗi input đã có label riêng, nhưng thiếu legend thì screen reader đọc "Chuyển khoản, nút radio" mà không biết đang chọn cho câu hỏi nào.
Lưu ý: dùng <table> để dàn layout, hoặc dựng bảng bằng <div> có display: grid — cả hai đều xoá sạch quan hệ hàng-cột trong accessibility tree.