Space is part of the structure
Margins, line lengths, and a few quiet rules. An exploration of the things that help words feel at home.
When a page feels difficult to read, I often find myself adjusting the font. But the typeface is only one part of the problem. The relationships between things deserve just as much attention.
Give related things a rhythm
A heading should feel attached to the paragraph that follows it. A caption should sit close to its image. A new section needs enough space to signal a change in thought.
- Within a thought: keep paragraphs comfortably connected.
- Between thoughts: give headings more space above than below.
- Around an object: treat an image and its caption as one unit.
A small spacing vocabulary
A short scale keeps decisions consistent without making every interval identical. These are the starting values used in this demo.[2]
| Space | Value | Used for |
|---|---|---|
| Small | 0.5rem | List items |
| Medium | 1.5rem | Paragraphs |
| Large | 3rem | New sections |
Let the grid do a little work
The borders on this page make its structure visible. The header, reading area, and footer share edges. Inside that frame, the text has space to breathe.
A grid is most useful when it makes the next decision a little easier.
— From my layout notebook
My final pass is less about choosing numbers and more about reading the page in context:
- Read a full paragraph on a narrow screen.
- Scan only the headings to check the hierarchy.
- Look at the images, lists, and tables together.
- Increase the text size and see what needs more room.
The goal is a page where the structure feels natural, and your attention stays with the words.