Skip to content
Strynal, Digital Agency

Design 8 min read

Website Information Architecture: Structure Before Style

A practitioner's guide to information architecture: sitemaps, navigation, content modeling, URL structure, card sorting, and how IA shapes SEO and findability.

By Strynal Team

Most websites do not fail because they look wrong. They fail because nobody can find what they came for. Information architecture is the discipline that decides where things live and how people move between them. It is the structure underneath every screen. Get it right and the design has somewhere to stand; get it wrong and no amount of polish will rescue it.

What information architecture actually is

Information architecture is the organization, labeling, and relationships of the content on your site. It answers three plain questions: what exists, what is it called, and how does someone get to it. It is the floor plan before the furniture.

This is structure, not styling. Visual design decides how a page feels; information architecture decides whether the page should exist, what it contains, and which pages it connects to. When teams skip this step, they end up redesigning the paint while the walls are in the wrong place.

We treat IA as the first build artifact, before a single component is drawn. The reason is selfish: it is far cheaper to move a node on a sitemap than to refactor a navigation system after launch.

Information architecture is the cheapest thing on the project to change and the most expensive thing to get wrong.

Why structure has to come before style

Style decisions inherit from structure. The number of top-level sections sets the shape of your navigation. The depth of your content tree sets how breadcrumbs and back-navigation behave. The relationships between content types decide what a card, a list, or a related-links block even shows.

If you design the hero first and the architecture second, you are reverse-engineering meaning from aesthetics. That is how sites end up with a beautiful homepage and a maze behind it.

Start with a sitemap, not a homepage

A sitemap is the inventory and the hierarchy in one view. It lists every page and shows what sits under what. Build it before you wireframe.

A useful sitemap exercise looks like this:

  1. Inventory what exists. Pull every current URL, every piece of content, every PDF buried three clicks deep. You cannot reorganize what you have not counted.
  2. Audit ruthlessly. Most sites carry pages nobody reads and nobody will miss. Mark each item keep, merge, cut, or create.
  3. Group by user intent, not by org chart. Visitors do not care which department owns a page. They care about the job they came to do.
  4. Set the hierarchy. Decide top-level sections, then what nests beneath them. Aim for breadth over depth; deep trees hide things.
  5. Name the nodes. Labels are content. We will come back to this.

Keep the top level tight. A primary navigation with four to seven items is legible; eleven items is a wall. If everything is primary, nothing is.

Navigation is the visible surface of your IA. It is where structure meets the user, so it has to reflect the sitemap honestly. When the menu says one thing and the page hierarchy says another, people stop trusting the menu.

A few principles we hold to:

  • Primary nav carries the few things most people want. It is not a table of contents for the whole site.
  • Labels describe destinations in the visitor’s words. “Solutions” is vague; “Pricing” is a promise. Plain beats clever.
  • Every page should answer “where am I and where can I go.” Breadcrumbs, clear section context, and obvious next steps do this work.
  • Search complements structure; it does not replace it. If users only succeed via search, the architecture is failing them.

Good navigation is opinionated. It hides the long tail and surfaces the path most people need. That is a design decision rooted in the structure, which is exactly why IA comes first.

Content modeling: structure inside the page

Sitemaps organize pages. Content modeling organizes what is inside them. A content model defines your content types (article, service, case study, team member, FAQ) and the fields and relationships each one carries.

This matters because content is rarely a blob of text. A service page might have a name, a summary, a problem it solves, related services, and a linked piece of work. Model those fields explicitly and your CMS, your templates, and your cross-links all become predictable.

Why modeling pays off later

Structured content is reusable content. When a case study knows which service it belongs to, the service page can automatically pull related work, and the work index can filter by service with no manual linking and no rot. The relationships do the labor.

It also keeps editors honest. A well-modeled type tells contributors exactly what a page needs, so pages ship complete instead of half-filled. If you are choosing infrastructure to support this, our take on choosing a headless CMS covers how the content model should drive that decision, not the other way around.

URL structure is part of the architecture

URLs are not an afterthought; they are the addressable map of your IA. A clean URL mirrors the hierarchy: /services/ui-ux tells a human and a crawler exactly where they are and what sits above them.

Some rules we apply:

  • Match URLs to the sitemap hierarchy. Nesting should reflect real parent-child relationships.
  • Use readable, lowercase, hyphenated slugs. Words, not IDs. The slug is a tiny piece of copy.
  • Keep them stable. URLs are promises. When they must change, redirect. Broken links erode trust and rankings.
  • Avoid orphan depth. If a page lives five segments deep, ask whether the structure above it is right.

Stable, meaningful URLs are quiet infrastructure. Nobody praises them, but everybody suffers when they are chaotic.

Card sorting: let users build the model

You are too close to your own content to organize it for strangers. Card sorting is the cheap, fast technique that fixes this. You put each piece of content on a card and ask real users to group it and name the groups.

There are two flavors worth knowing:

  • Open card sort. Users create and label their own groups. This tells you how people naturally categorize your content and what they call things.
  • Closed card sort. Users sort cards into categories you provide. This validates a structure you are already considering.

Run an open sort early to discover the model, then a closed sort to test it. Pair it with tree testing: give users a task and a bare hierarchy, no visual design, and watch whether they can find the answer. Tree testing isolates the architecture from the styling, which is precisely the point.

The payoff is that your navigation labels and groupings come from evidence, not from a conference-room argument about what “feels right.”

IA, SEO, and findability are the same problem

Here is the part teams underrate: information architecture is search engine optimization. The structure that helps a human find a page is the structure that helps a crawler understand it.

A coherent hierarchy spreads authority sensibly through internal links. Logical URLs and clear navigation make your site easy to crawl and index. Grouping related content into clusters (a pillar page with supporting articles linking back to it) is just good IA expressed as a link graph. Our SEO foundation for startups guide leans on exactly this clustering logic.

Findability and discoverability are two sides of one coin. Findability is whether a visitor already on your site can locate something. Discoverability is whether search engines and, increasingly, AI assistants can surface it. Both depend on structure. A site that is well architected for people tends to be legible to machines for free.

If a search engine cannot understand your hierarchy, neither can a first-time visitor. They are reading the same map.

This is also where the redesign trap lives: launching a new design over a broken architecture, then wondering why traffic dropped. If you are heading into a rebuild, the website redesign process starts with the IA for this exact reason.

How Strynal approaches information architecture

At Strynal, every engagement starts on a blank page, with no templates and no recycled sitemap from the last client. We work with people solving uncommon problems, and uncommon problems rarely fit a stock structure. So we build the architecture from your content and your users, not from a pattern library.

Because the team that scopes the work also builds it, the sitemap we sketch in week one is the structure that ships. Strategy, brand, and build sit under one roof, which means the IA, the content model, and the UI/UX design stay in agreement instead of drifting apart in handoff. As the in-house studio for Global Digital Platforms, we have shipped enough structure to know that the boring decisions (labels, URLs, hierarchy) are the ones that quietly decide whether a site works.

If your site looks fine but nobody can find what they need, the problem is usually underneath the design. Tell us what’s getting lost, and we’ll start with the map.