Refract Group2026
Glossary
Information architecture
Information architecture is the structure of a website’s content: which pages and content types exist, how they are grouped and named, and how they link to each other. The navigation, the search and the sitemap are all built on it.
- List the audiencesEngineers, buyers, investors
- Give each a task“Find the eval kit for X”
- Group and label pagesCard sort with real content
- Draw the sitemapSections and what sits under
- Task found in tree?Rename or regroup
- Design the navigationMenus, search, related links
Information architecture in detail
- Also called
- IA, Site structure, Content structure
- Topic
- Website
- Updated
What it is
Information architecture, usually shortened to IA, settles what is on a site, how it is organised and how one piece leads to the next. The first part is the inventory: the pages, and the content types behind them, such as products, case studies or support articles. The second is the grouping and the labels. The third is the connections, so a reader on a product page can reach its documentation without going back to the menu.
Nielsen Norman Group calls it the site’s backbone: it lives in spreadsheets and diagrams and never appears on screen directly. Teams work it out with card sorts, where people group real content into piles that make sense to them, and check it with tree tests, where people try to find an item using only the proposed labels. The sitemap is how IA is usually drawn, and the menu is one of the things built from it.
Why it matters
Without a deliberate structure, a site grows by accretion. Each new product or campaign gets a page wherever there was room, the menu comes to mirror the org chart, and visitors have to learn how the company is organised before they find anything. On a technical site that costs most with the readers who matter most: the engineer who wants a datasheet and lands on a sales page, or the investor who never sees how broad the product range is. A structure agreed early also tells the build which templates and CMS fields it needs.
How we do it
Every website project here begins with who visits. We read the current pages, the search data and recent enquiries, then turn each audience into a concrete task, such as finding the evaluation kit for one product. Those tasks shape the sitemap and a brief for each page type, with every current page marked to keep, merge or retire.
Wireframes come before visual design and are filled with real content, including the longest specification and the oddest resource title, so the navigation and the content hierarchy are tested early. Before the build we agree who will own each content type after launch. The sitemap is part of what you get on any website project, and websites start from $15,000.
An example
Say a developer tools company has a menu of Platform, Solutions, Resources and Company. In a tree test, people are asked to find the API’s rate limits using only those labels. Most open Platform, because to them the API is the platform, but the limits sit in the docs under Resources. The team moves Docs to the top level, links each product page to its reference section, and runs the test again with the same task.
Common mistakes
- Copying the org chart. Sections named after internal teams make sense to staff, and leave visitors guessing which team owns the answer they came for.
- Designing the menu first. A menu drawn before the content is listed gets reshuffled every time a page is added, because nothing underneath it was decided.
- One template for every page. A detailed product specification and a short customer story need different structures, and forcing both into one leaves editors to settle the hierarchy again on every page.
- Testing with placeholder content. Lorem ipsum hides the long product name, the empty field and the resource with no obvious home, which are the cases that break a structure.
Information architecture vs navigation
Information architecture is how a site’s content is organised and connected behind the pages, and navigation is the menus, links and search on screen that let people move through that structure.
| Information architecture | Navigation | |
|---|---|---|
| What it is | The structure behind the pages | The controls for moving through it |
| Seen by visitors | Only through what is built on it | On every page |
| Drawn as | Sitemaps, spreadsheets and diagrams | Wireframes and designed menus |
| Comes | First | Once the structure is agreed |
Questions
What people ask about information architecture.
A sitemap is one drawing of a site’s information architecture: the sections and the pages in each, laid out as a tree. Information architecture is the wider set of decisions behind it, including the content types, the labels, the links between related pages and the role of search. An XML sitemap is something else again, a file that lists URLs for search engines.
Two methods cover most of it. In a card sort, participants group cards of real content into piles that make sense to them, which suggests groupings and names. In a tree test, participants try to find specific items using only the proposed hierarchy of labels, with no design at all, which shows whether the information architecture works before anyone builds it.
A UX or content designer usually leads the information architecture, working from research with the people who know the audiences and the product. On a technical site, engineers and product specialists check that the content types and the links between them match how the product works, and the marketing team confirms it can keep the structure in shape after launch.
Where this shows up in our work
Related terms
Working on this now?
Tell us what you’re building and where it’s stuck. We reply within 12 hours.
Most teams start with a call, then a sprint or an audit.
The people you’d work with, from the first call to launch