The <li> Element
As defined in the HTML Living Standard, the <li> (list item) element represents an item in a list. It must be contained within an <ol> (ordered list) or <ul> (unordered list).
- First list item
- Second list item
- Third list item
<ul>\n <li>Item One</li>\n <li>Item Two</li>\n</ul>
View HTML Living Standard: The li element
Accessibility & Lists
Lists are incredibly powerful for accessibility because they tell screen reader users exactly how many items are in a group before they start reading them.
- Avoid Fake Lists: Never use a series of paragraphs with dashes (e.g.,
- Item 1) to create a list. This removes the programmatic relationship and the item count. - Nested Lists: You can nest a new
<ul>or<ol>inside an<li>to create sub-items.
WCAG Requirement: Info and Relationships
Success Criterion 1.3.1 (Level A): Information, structure, and relationships conveyed through presentation can be programmatically determined.
Using <li> tags ensures that the "list" relationship is programmatically determined, allowing assistive technology to announce the list's presence and size.