Purpose and content model
Ul groups items whose order does not carry meaning. Ol describes a sequence or ranking where order matters. Each item is represented by li. Menu also represents a list of items and can describe a group of commands; it is not the obsolete menuitem API and does not create a custom application menu automatically.
List items may contain paragraphs and nested lists. Put a child list inside the li it belongs to, not between two sibling items. Native list structure preserves relationships when styling changes, while typed bullet characters in paragraphs only imitate the appearance.
Syntax and working example
<ol start="3">
<li>Check the document structure.</li>
<li>Test the links.</li>
<li>Review keyboard access.</li>
</ol>Supported attributes and behavior
Ol supports start for an initial integer, reversed for descending numbering, and type for a numbering style when that style matters to the meaning. An li inside ol can use value to reset its ordinal value. Ul and menu use global attributes. Use CSS list-style for ordinary presentation choices rather than selecting an element solely to obtain a particular marker shape.
Another practical pattern
<ul>
<li>Documents<ul><li>Travel ticket</li><li>Membership card</li></ul></li>
<li>Water bottle</li>
</ul>
<menu><li><button type="button">Save draft</button></li></menu>Accessibility and browser notes
A screen reader can announce list boundaries and item counts. Heavy styling that removes markers can interact with browser accessibility behavior, so test the resulting list rather than assuming visual success is sufficient. An interactive command list still needs real buttons and their actual implemented actions.
Common mistakes
Do not use ol for an arbitrary collection just because numbers look attractive. Reversed is boolean: reversed=false still enables it when present. Placing a nested list outside li loses the intended parent-item relationship and can produce invalid structure.
Verify your implementation
Read the items in a different order and decide whether the meaning changes. If it does, ol is a strong candidate. Inspect the DOM nesting, test a list item containing a long paragraph, and review the accessibility tree after applying custom marker styles.
Standard status and sources
Standard; browser availability must be checked independently of specification status.