Lists Break Differently From Prose
A paragraph of placeholder text tells you how body copy flows. It tells you nothing about a navigation menu, a feature grid, a pricing comparison or a table β and those are where layouts actually fail.
The Failure Modes Lists Have
- Uneven item lengths. A menu where one item is 3 characters and another is 30 either
- Item count. A three-column grid with seven items leaves an awkward gap. Design for
- Vertical rhythm. Cards of different heights in a grid either stretch to match or leave
- Overflow. A dropdown with 40 items needs scrolling, a search field, or grouping β and
Test Against Realistic Counts
| Component | Test with |
|---|---|
| Navigation | 3, 7, and 12 items |
| Dropdown | 5 and 50 |
| Feature grid | 4, 5 and 9 |
| Table rows | 0, 1, and 500 |
| Tag list | 1 and 30 |
Accessibility Comes From the Markup
Placeholder content is the right time to check that a list is marked up as one. A visual list
built from
announces
"list, 8 items" and lets a user skip it.Navigation belongs in a