Task
Ensure content has appropriate structure and relationships
Check as complete
Sighted people perceive page structure and relationships through visual cues like headings, spacing, color, etc. Having these structures and relationships set or available in text make your site easier to understand for everyone.
Check your page structure
Review your page using a screen reader to better understand the structure and relationships presented in the voice over explanation that comes through the screen reader as you navigate through the page with your keyboard.
Adjust any elements that aren’t read out with clear relationship to any items they are related to on the page.
Some examples of things to check:
- Headings are semantic heading elements. See also: Use logical heading order
- Lists of content are setup using a list element. See also: Use semantic lists
- Tables use the appropriately elements or labels. See also: Ensure table columns, rows, and cells have proper ARIA labels
- Running text and grouped content uses semantic elements like sections, paragraphs, etc. See also: Use landmark elements to indicate important content regions
Useful resources:
WCAG reference:
Back to checklist
Total progress
Congratulations on making the web a more accessible place. Celebrate your work on Twitter.
0 / 0
Hide progress