HTML Lists
Lists group related information. The right structure tells readers whether order matters or whether each item explains a named term.
How it works
- Use ul for a collection with no required sequence, ol for ordered steps or rankings, and dl for term–description relationships.
- Put li elements directly inside ul or ol. A nested list belongs inside the li it elaborates.
- Presentation can change with CSS without removing the relationship between list items. Avoid typing bullet characters into ordinary paragraphs as a substitute.
A practical example
<h2>Bring these items</h2>
<ul><li>Notebook</li><li>Reusable bottle</li></ul>
<h2>Check in</h2>
<ol><li>Find the welcome desk.</li><li>Collect your name badge.</li></ol>
The equipment list has no required order. The check-in instructions describe a sequence, so their order is part of the meaning.