information-architecture
Compare original and translation side by side
🇺🇸
Original
English🇨🇳
Translation
ChineseInformation Architecture
信息架构(Information Architecture)
Design the structure that holds the content. Stack-agnostic. Applies to marketing sites, product surfaces, knowledge bases, e-commerce, and editorial content.
A well-designed IA makes the rest of the project easier. A poorly-designed IA forces every downstream decision to fight the structure.
设计承载内容的结构。与技术栈无关。适用于营销网站、产品界面、知识库、电商平台和编辑类内容。
设计良好的信息架构能让后续项目推进更顺畅,而设计糟糕的信息架构会让所有下游决策都受限于不合理的结构。
When to use
适用场景
- Designing a new site or major section from scratch
- Restructuring an existing site
- Adding a new content type or category
- Designing site navigation or menu systems
- Defining URL structure and slug patterns
- Building taxonomies or tag systems
- Auditing an existing IA for problems
- 从零开始设计新网站或核心板块
- 重构现有网站结构
- 添加新的内容类型或分类
- 设计网站导航或菜单系统
- 定义URL结构和slug规则
- 构建taxonomy(分类法)或标签系统
- 审核现有信息架构的问题
When NOT to use
不适用场景
- Single-page design (use )
design-standards - Content production (use )
content-and-copy - SEO-driven content planning (use )
seo-keyword - Initial brand and audience discovery (use )
brand-discovery
- 单页设计(使用)
design-standards - 内容创作(使用)
content-and-copy - SEO导向的内容规划(使用)
seo-keyword - 初始品牌与受众调研(使用)
brand-discovery
Required inputs
必要输入
- The site or product scope
- The audience and what they're trying to do
- The content that exists or is planned
- Any constraints (parent IA, regulatory, technical)
If audience is unclear, run first. If content scope is unclear, run first.
brand-discoverycontent-strategy- 网站或产品的范围
- 受众群体及其需求目标
- 已有的或规划中的内容
- 任何约束条件(上级信息架构、合规要求、技术限制)
若受众群体不明确,先执行;若内容范围不明确,先执行。
brand-discoverycontent-strategyThe framework: 6 layers
框架:6个层级
Information architecture has six layers. Each builds on the one below.
信息架构包含6个层级,每个层级都建立在下层基础之上。
1. Mental models
1. 心智模型(Mental models)
Before structure, understand how the audience thinks about the domain.
- What concepts do they group together naturally?
- What words do they use? (Often different from what the company uses.)
- What is the dominant frame of reference? (By task? By role? By topic? By time?)
- What do they expect to find where, based on conventions in similar products?
Methods:
- Card sorting (open or closed): Give the audience the content items, ask them to group them. Open card sorts surface natural groupings. Closed card sorts validate proposed groupings.
- Tree testing: Give a proposed structure, ask users to find specific items. Surfaces where the structure breaks down.
- First-click testing: Given a goal, where do users click first? If first clicks are wrong, the labels and structure are wrong.
在构建结构之前,先理解受众对领域的认知方式。
- 他们会自然地将哪些概念归为一类?
- 他们使用哪些词汇?(通常与企业内部使用的词汇不同)
- 主要的参考框架是什么?(按任务?按角色?按主题?按时间?)
- 基于同类产品的惯例,他们期望在哪里找到特定内容?
方法:
- Card sorting(卡片分类法)(开放式或封闭式):向受众提供内容条目,让他们进行分组。开放式卡片分类法可呈现自然的分组方式,封闭式卡片分类法用于验证预设的分组逻辑。
- Tree testing(树状测试):提供一个预设结构,让用户查找特定内容条目,以此发现结构存在的问题。
- First-click testing(首次点击测试):给定目标,观察用户首次点击的位置。如果首次点击错误,说明标签和结构存在问题。
2. Sitemap
2. Sitemap(站点地图)
The map of all pages and how they relate.
Sitemap deliverables:
- A hierarchy diagram showing parent-child relationships
- Indication of page types (static, dynamic, listing, detail)
- Cross-references showing how pages relate beyond the hierarchy
- Sometimes a separate user-flow overlay for key journeys
Sitemap types:
- Hub-and-spoke (cornerstone content + supporting content): Common for content marketing
- Tree (strict hierarchy, every page has one parent): Common for product documentation
- Faceted (content lives in many overlapping categories): Common for e-commerce
- Flat (everything reachable from the home): Common for small sites
Most sites blend types. Pick the dominant pattern and document the exceptions.
所有页面及其关联关系的映射图。
Sitemap交付物:
- 展示父子层级关系的结构图
- 标注页面类型(静态页、动态页、列表页、详情页)
- 显示层级之外的页面关联关系的交叉引用
- 有时会为关键用户旅程添加单独的用户流覆盖层
Sitemap类型:
- Hub-and-spoke(中心辐射型)(核心内容+支撑内容):常见于内容营销类网站
- Tree(树状型)(严格层级,每个页面仅有一个父页面):常见于产品文档类网站
- Faceted(分面型)(内容可归属于多个重叠分类):常见于电商平台
- Flat(扁平型)(所有内容均可从首页直接访问):常见于小型网站
大多数网站会混合使用多种类型。选择主导模式并记录例外情况。
3. URL structure
3. URL结构
URLs are part of the IA. They are user-facing, indexed by search engines, and shape how content is referenced.
URL principles:
- Reflect the content hierarchy
- Lowercase, hyphen-separated
- Predictable (same pattern across same content type)
- Stable (URLs don't change without redirects)
- Short (under 60 characters where possible)
- Descriptive (slug indicates the content)
- Free of dates unless time-bound
- Free of session IDs and tracking parameters in canonical form
Common patterns:
/ home
/[section] section landing
/[section]/[subsection] subsection landing
/[section]/[subsection]/[item] detail page
/blog blog index
/blog/[slug] blog post
/blog/category/[category] category index
/blog/tag/[tag] tag index
/products product catalog
/products/[category] category page
/products/[category]/[product] product detailPick a pattern and stick to it. Inconsistent URL patterns confuse users, crawlers, and analytics.
URL是信息架构的一部分,面向用户、被搜索引擎索引,还会影响内容的引用方式。
URL设计原则:
- 反映内容层级
- 小写字母,连字符分隔
- 可预测(同类内容类型使用相同规则)
- 稳定(URL变更必须配置重定向)
- 简短(尽可能控制在60字符以内)
- 描述性(slug能体现内容主题)
- 除非内容具有时效性,否则不包含日期
- 规范形式中不包含会话ID和跟踪参数
常见模式:
/ home
/[section] section landing
/[section]/[subsection] subsection landing
/[section]/[subsection]/[item] detail page
/blog blog index
/blog/[slug] blog post
/blog/category/[category] category index
/blog/tag/[tag] tag index
/products product catalog
/products/[category] category page
/products/[category]/[product] product detail选定一种模式并保持一致。不一致的URL模式会让用户、爬虫和分析工具产生混淆。
4. Navigation
4. 导航
The chrome that gets users where they need to go.
Primary navigation:
- The top-level structure of the site
- Should reflect what the audience cares about, not what the org chart looks like
- 5 to 7 items maximum (more becomes cognitively heavy)
- Each label is recognizable in 2 to 3 words
- Order matters (left/first gets the most attention)
Secondary navigation:
- Within-section navigation
- Often shown as sidebars, sub-menus, or in-page tabs
- Supports the primary nav, doesn't duplicate it
Utility navigation:
- Account, search, login, support
- Visually subordinate to primary nav
- Often top-right (LTR languages)
Breadcrumbs:
- For nested hierarchies (3+ levels deep)
- Always linked except the current page
- Match the URL hierarchy or the conceptual hierarchy
- Marked up with BreadcrumbList schema
Footer navigation:
- Comprehensive; sometimes includes everything
- Organized by category for findability
- Includes secondary content (privacy, terms, contact)
帮助用户到达目标页面的界面组件。
主导航:
- 网站的顶层结构
- 应反映受众关心的内容,而非企业组织架构
- 最多5-7个选项(过多会增加认知负担)
- 每个标签使用2-3个易于识别的词汇
- 顺序很重要(左侧/第一个选项获得最多关注)
次导航:
- 板块内的导航
- 通常以侧边栏、子菜单或页内标签形式呈现
- 辅助主导航,不重复其内容
实用导航:
- 账户、搜索、登录、支持等功能入口
- 视觉上从属于主导航
- 通常位于右上角(左文右语环境下)
Breadcrumbs(面包屑导航):
- 适用于深度超过3层的嵌套层级
- 除当前页面外,所有层级均需设置链接
- 匹配URL层级或概念层级
- 使用BreadcrumbList schema进行标记
页脚导航:
- 内容全面,有时包含所有页面入口
- 按分类组织以提升可查找性
- 包含次要内容(隐私政策、条款、联系方式)
5. Taxonomy and metadata
5. Taxonomy(分类法)与元数据
The classification system applied to content.
Categories:
- A small, controlled list (typically 5 to 15)
- Mutually exclusive ideal (one item, one category)
- Used for structural navigation
Tags:
- A larger, often growing list (50+)
- Multi-assignment (one item, many tags)
- Used for cross-cutting connections, related-content, and long-tail discovery
Metadata fields:
- Author, date, content type, audience segment
- Whatever is useful for filtering, sorting, and surfacing
Common failures:
- Categories that overlap (item could go in 3 different categories)
- Tags that are unmaintained (sprawl into thousands, become useless)
- Metadata fields that get filled inconsistently
- Different content types using different taxonomies for the same thing (chaos)
应用于内容的分类系统。
分类(Categories):
- 数量较少的受控列表(通常5-15个)
- 理想状态下互斥(一个内容条目仅属于一个分类)
- 用于结构性导航
标签(Tags):
- 数量较多且持续增长的列表(50+个)
- 可多分配(一个内容条目可属于多个标签)
- 用于跨领域关联、相关内容推荐和长尾内容发现
元数据字段:
- 作者、日期、内容类型、受众细分
- 任何有助于筛选、排序和展示的字段
常见问题:
- 分类重叠(一个内容条目可归入3个不同分类)
- 标签缺乏维护(泛滥成数千个,失去效用)
- 元数据字段填写不一致
- 不同内容类型对同一事物使用不同分类法(导致混乱)
6. Labeling
6. 标签系统(Labeling)
What you call things.
Label principles:
- Audience language, not internal language
- Specific enough to be useful, short enough to scan
- Consistent across the site (call it "Product" or "Solutions" but not both)
- Tested with real users (closed card sort or tree test surfaces label problems)
Common label problems:
- "Solutions" (vague; usually means "products with marketing copy")
- "Resources" (catch-all; everything ends up there)
- Internal jargon ("PRD," "OKRs") that doesn't match user vocabulary
- Labels that change meaning across the site
内容和组件的命名规则。
标签设计原则:
- 使用受众的语言,而非企业内部术语
- 足够具体以发挥作用,同时足够简短便于扫描
- 在整个网站保持一致(统一称为“产品”或“解决方案”,不要混用)
- 与真实用户一起测试(封闭式卡片分类法或树状测试可发现标签问题)
常见标签问题:
- "Solutions"(过于模糊;通常指“带有营销文案的产品”)
- "Resources"(万能分类;所有内容都归入此处)
- 内部行话(如“PRD”、“OKRs”)与用户词汇不匹配
- 标签在网站不同区域含义不同
Workflow
工作流程
- Understand the audience and content. Use existing discovery and content strategy if available.
- Card sort or interview to surface mental models.
- Draft the sitemap. Hierarchy, page types, cross-references.
- Define URL patterns. One pattern per content type.
- Design navigation. Primary, secondary, utility, footer, breadcrumbs.
- Build taxonomy. Categories (controlled, small) and tags (open, large).
- Validate labels. Tree test or closed card sort with target users.
- Document. Use the template in .
references/ia-document-template.md - Hand off to design and development. IA decisions inform navigation components, URL routing, and taxonomy implementation.
- 了解受众与内容:使用已有的调研和内容策略成果(如有)。
- 卡片分类或用户访谈:挖掘受众的心智模型。
- 起草Sitemap:包含层级、页面类型、交叉引用。
- 定义URL规则:为每种内容类型制定一套规则。
- 设计导航系统:主导航、次导航、实用导航、页脚导航、面包屑导航。
- 构建Taxonomy:分类(受控、少量)和标签(开放式、大量)。
- 验证标签:与目标用户进行树状测试或封闭式卡片分类法测试。
- 文档记录:使用中的模板。
references/ia-document-template.md - 交付给设计与开发团队:信息架构决策为导航组件、URL路由和分类法实现提供依据。
Failure patterns
常见失败模式
- IA designed by org chart. "Engineering" and "Marketing" sections make sense to the company, not to the audience.
- Categories that proliferate. Every team adds a category for their thing. Becomes unscannable. Hold the line at 5 to 15.
- Tags that sprawl. No tag governance. Tags become a junk drawer.
- Inconsistent URL patterns. Some posts at /blog/[slug], some at /[slug], some at /articles/[slug]. Pick one.
- Navigation that hides primary content. The most important pages should be one click from home.
- Search as a substitute for IA. "Just use search" is not a structure. Search supports IA, doesn't replace it.
- No validation. Card sorts, tree tests, and first-click tests are cheap and surface huge problems early.
- Treating IA as a one-time deliverable. IA evolves with content. Plan for evolution.
- 按企业组织架构设计信息架构:“工程”和“营销”板块对企业内部有意义,但对受众毫无价值。
- 分类数量失控:每个团队都为自己的内容添加分类,导致分类过多无法扫描。严格控制在5-15个以内。
- 标签泛滥:缺乏标签管理,标签沦为“杂物抽屉”。
- URL规则不一致:部分博客文章位于/blog/[slug],部分位于/[slug],部分位于/articles/[slug]。选定一种规则并坚持使用。
- 导航隐藏核心内容:最重要的页面应从首页一键可达。
- 用搜索替代信息架构:“直接用搜索”不是一种结构。搜索是信息架构的补充,而非替代品。
- 缺乏验证:卡片分类、树状测试和首次点击测试成本低,能在早期发现重大问题。
- 将信息架构视为一次性交付物:信息架构随内容演变而发展,需规划迭代方案。
Output format
输出格式
Default output is an IA document at plus visual assets:
information-architecture.md- Executive summary
- Audience and mental models (synthesized)
- Sitemap (hierarchical diagram)
- URL structure (per content type)
- Navigation specification (primary, secondary, utility, footer, breadcrumbs)
- Taxonomy (categories and tag governance)
- Labels (validated wording for navigation, categories, content types)
- Implementation notes for design and development
Visual deliverables:
- Sitemap diagram (Whimsical, Figma, OmniGraffle, etc.)
- Navigation wireframes for primary surfaces
- Optional: card sort and tree test results
默认输出为格式的信息架构文档,加上视觉资产:
information-architecture.md- 执行摘要
- 受众与心智模型(综合分析)
- Sitemap(层级结构图)
- URL结构(按内容类型划分)
- 导航规范(主导航、次导航、实用导航、页脚导航、面包屑导航)
- Taxonomy(分类与标签管理规则)
- 标签(经过验证的导航、分类、内容类型用词)
- 设计与开发实现说明
视觉交付物:
- Sitemap示意图(使用Whimsical、Figma、OmniGraffle等工具制作)
- 核心页面的导航线框图
- 可选:卡片分类和树状测试结果
Reference files
参考文件
- - Template for the IA deliverable.
references/ia-document-template.md - - URL pattern conventions for common content types.
references/url-pattern-library.md
- - 信息架构交付物模板。
references/ia-document-template.md - - 常见内容类型的URL规则规范。
references/url-pattern-library.md