Skip to content
Finder Theme — ~/Blog / Design / The twelve-column myth
← All posts
Article • the-twelve-column-myth.md • 19 lines
Design 2 min

The twelve-column myth

Grids that work for reading, rather than grids that work for dashboards.

chris

26 articles

Twelve columns divide neatly into halves, thirds, quarters and sixths. That is genuinely useful — for dashboards. For prose it is a solution to a problem you do not have.

Reading wants one column

Text has an optimal measure of roughly sixty-five characters. Every column system I have used eventually gets overridden on the article template, because the grid and the measure want different things.

So start from the measure. Set the reading column first, then arrange everything else around it. The grid becomes a layout tool rather than a constraint you fight.

What to do instead

Set the reading measure first. Sixty to seventy characters, expressed as a max-width on the content column. Then place everything else relative to that column rather than to a page-wide grid.

Sidebars become fixed widths beside a flexible centre. Full-bleed elements become explicit exceptions. The layout gets simpler to reason about because there is one governing constraint instead of twelve interchangeable ones.

When twelve columns is right

Dashboards, tables, anything where the primary content is a grid of comparable things. There the divisibility genuinely helps, because you are laying out peers rather than a hierarchy with a spine.

Which is the actual lesson: the grid should come from the content’s structure. Importing a system designed for a different structure is how you end up overriding it on every important page.

Leave a reply

* Required