# Single reading column — layout recipe

## The idea

- One narrow, centred column carries everything in order, so the reader only ever has to scroll and read.

## Use it for

- Long-form essays and articles
- Newsletters and journal entries
- Documentation pages read top to bottom

## Avoid it when

- Readers need to compare several things at once
- The page is mostly short items to scan

## Regions

- Header — Names the site and offers a way back, kept small so the text starts early.
- Title — States what the page is about and who wrote it, right above the first paragraph.
- Body text — Holds the reading itself, at a comfortable line length.
- Pull quote — Lifts one line out of the text to give the eye a resting point.
- Footer — Closes the page with where to go next once the reading is done.

## How it reflows

- Phone: Every region stacks in one column that fills the screen, with a small margin on each side. (1 column)
- Tablet: The column stays single and gains wider margins so the lines do not grow too long. (1 column)
- Desktop: The column stays single and centred, with empty space on both sides keeping lines short. (1 column)

## Principles

- Keep body lines between 60 and 75 characters at every width
- Let the margins grow with the screen, never the line length
- Break the text with headings and quotes, not with side panels
- Put the title and the first paragraph in the first screen