On this page
Goal
Ensure that lists are semantically structured so they are understandable for users, assistive technology, and other machine uses.
Why this matters
Read Why does it matter if our HTML is semantic?.
How to implement
For the proper structure of each list type, see MDN’s site:
- <ol>: The Ordered List element – for numbered (ordered) lists
- <ul>: The Unordered List element – for bulleted (unordered) lists
- <dl>: The Description List element – for description (key/value or definition) lists
How to test
- Right-click the text that requires additional semantic meaning and ensure in the source code the appropriate list tags are applied.
- Verify against wireframes or the style guide to ensure that the visual display is as expected.