Design

Wireframe

A wireframe is a low-detail layout of a page showing what goes where and in what order, without colour, imagery or final copy. It exists to settle structure before visual design makes structural changes expensive.

Wireframes are deliberately ugly. Grey boxes, placeholder headings, no typography choices. That is the point: a stakeholder looking at a wireframe argues about whether the pricing belongs above the testimonials, not about whether they like the blue. Those are different conversations, and having them in the right order saves weeks.

The mistake is treating wireframes as a formality to be rushed through, or skipping them and going straight to a polished design. The polished design then absorbs structural feedback badly, because every change to what goes where ripples through the finished visuals. A page that was restructured three times in the design phase usually looks like it.

I use wireframes for the pages that carry a decision: the homepage, the service pages, anything with a form. Secondary pages that follow a template do not need one.

What to put in a website brief