What Layout Is

Layout is not decoration applied after content is written. It is the system that determines where everything goes, how elements relate to each other, and what the eye encounters first. Before a visitor reads your headline, they have already formed a judgement about the page — and that judgement is entirely about layout.

Structure precedes content

A blank grid is already a design decision. When you define a 12-column structure with 24px gutters and 48px margins, you have constrained every element that will ever appear on that page. The headline will span some number of columns. The image will occupy a region. The call to action will sit in a position that the grid made available. Content does not find its own place — layout assigns it one.

This is why layout decisions come first in a design process, even though they are invisible to the final reader. The reader sees the result: a page that feels balanced, or crowded, or airy, or chaotic. They do not see the structure that produced that result.

Layout as communication

Every layout communicates something before content does. A narrow centred column with generous top margin says: this is a reading experience, slow down. A dense grid of cards with tight spacing says: this is a catalogueue, scan quickly. A hero image spanning the full viewport says: this is a brand, feel something.

These messages are not accidental. They are the product of layout choices. The designer’s job is to ensure the structural message matches the content message — or, when they conflict deliberately, that the conflict does something useful.

What layout is not

Layout is not visual decoration. Drop shadows, gradients, illustrations, and colour schemes live on top of a layout — they do not constitute one. A page with no background colour and no images still has a layout. A page with elabourate artwork and no grid still lacks one.

Layout is also not content. Changing the number of columns does not change what the text says. But it changes how much of that text gets read, in what order, and with what level of attention. Layout is the frame. Content is what hangs in it.

The four decisions of layout

Every layout can be reduced to four decisions: where things are, how they are grouped, how much space surrounds them, and in what sequence the eye encounters them. All of the craft in layout — grids, spacing scales, typographic hierarchy, responsive behaviour — is in service of these four decisions.

The next article covers the grid, the most fundamental tool for answering “where things are.”

Layout and Form

This hub is about implementation systems: grids, spacing scales, columns, breakpoints, layout patterns. If you want the perceptual principles that determine whether a structure works — proximity, hierarchy, visual rhythm, reading flow — those live in the Form hub. Form and Layout are complementary. Form teaches you to evaluate structure. Layout teaches you to build it. Neither is sufficient alone.