An unordered list is a way to group related items where the order doesn’t matter. Common uses: feature lists, bullet points, checklists, and short collections of examples.
Key points
- Visual format: typically rendered with bullets (•, –, or custom icons).
- Structure: a container element with multiple list-item elements.
- Semantic meaning: indicates items are peers without implied sequence.
- Accessibility: screen readers announce it as a list and report the item count; include clear list heading or context.
- Use when: ordering isn’t important, items are short, or you want scannable content.
- Avoid when: steps must be followed in order or when ranking matters.
HTML example
- First item
- Second item
- Third item
Markdown example
- First item
- Second item
- Third item
Styling tips
- Keep items concise.
- Use consistent punctuation and capitalization.
- Replace bullets with icons for visual emphasis.
- Add spacing and line-height for readability.
Accessibility tips
- Use descriptive heading before the list.
- Avoid using lists solely for layout.
- Ensure keyboard focus order matches visual order.
Leave a Reply