Structure Before Design: Why It Matters

It means we decide what the website says, in what order and on which page, before we decide how it looks. Structure covers four things: which information exists, how it is grouped, what the visitor sees first, and how they move from one page to the next. Design comes right after.

A simple test: take a page, imagine removing every colour, image and font, and read what is left. If you understand what the organisation does, who it is for and what to do next, the structure works. Then design has a solid base to build on.

In the trade this is called information architecture. It is the way content is organised so it is easy to find. Nielsen Norman Group describes it as the backbone of a site's information, separate from the menus and buttons that sit on top of it. The wider picture is in what makes a business website effective. The case studies show the same order in website and platform projects.

Design needs structure because every design decision needs a reason, and the reason comes from the structure. With the structure ready, we know why a heading is bigger or an image is wider. The visitor sees what matters, where to look first and how the pieces of information connect.

Reading habits make this even more important. In Nielsen Norman Group's long-running research on how people read online, 79% of participants always scanned a new page. Only 16% read word by word. Readers scan for the spot that answers their question. What they scan is meaningful headings, short paragraphs and a clear order. All of these are parts of structure.

We also need to be careful how we judge the work. A beautiful page seems easier to use. Nielsen Norman Group calls this the "aesthetic-usability effect" and notes that attractive design does not solve serious usability problems. This is why we check the structure on its own, before real visitors judge it.

Structure helps the visitor answer their own questions, quickly and in a logical order. A person evaluating a company compares options, looks for relevance and tries to judge the risk. Structure puts the answers where they expect them: what is offered, for whom, how it works and what comes next.

Picture a manager with ten minutes before a meeting and four sites open in tabs. On the site where the services have plain names, are grouped logically and come with a visible next step, she quickly ends up with a clear picture. There, structure makes the difference. Design brings it out.

Structure also supports trust. The guidelines of Stanford's Web Credibility Project include easy contact, a visible real organisation, accurate information and text without mistakes. These are all content decisions, made before design starts. We look at the same evaluation from the reader's side in how decision-makers evaluate a website.

It starts with a short series of decisions, where each step is approved before the next one begins. At this stage the work is done with words, lists and simple page layouts. For a business website, these are the steps we follow before any visual design:

1. We name the decisions. We write down who visits the site and what each of them must decide: to ask for a quote, to put the company on a shortlist, or simply to understand the service.

2. We make the page list. We keep the pages that support those decisions, so every page has a clear purpose.

3. We set the order on each page. At the top goes what the visitor needs first, then what they need second. One main message in each section.

4. We write the real text. With the final wording, so the layout is built around what will actually be said.

5. We check understanding in plain form. We look at simple page layouts without colours. We ask whether someone outside the project can explain what the page says.

6. At the end, we design. Colour, fonts and images now stress a hierarchy that is already firm.

The same order is in the stages of our process. This is why every business website we build starts with questions, before the first sketches.

Design decides how the structure is perceived: what catches the eye, how fast a page can be scanned, how calm or serious the tone is. Its job is to strengthen the structure, by showing the hierarchy, guiding attention and keeping navigation obvious. It is just as important work. It simply comes second.

Good design also keeps the structure consistent. WCAG, the accessibility standard from the W3C, asks that navigation repeated across several pages appears in the same relative order each time. That way people can predict where things are. It is a design rule that serves a structure decision.

Design pays off best when the content is clear, the logic is complete and the organisation is right. These sit below the design, like a foundation. With a solid foundation, the design lasts for years without being redone.