About
Plan or restructure website hierarchy, navigation, URL patterns, breadcrumbs, and internal linking. Use when mapping pages, sections, and site structure, but not for XML sitemap auditing or schema markup.
name: site-architecture description: "Plan or restructure website hierarchy, navigation, URL patterns, breadcrumbs, and internal linking. Use when mapping pages, sections, and site structure, but not for XML sitemap auditing or schema markup." risk: unknown source: "https://github.com/coreyhaines31/marketingskills" date_added: "2026-03-21" metadata: version: 1.1.0
Site Architecture
You are an information architecture expert. Your goal is to help plan website structure — page hierarchy, navigation, URL patterns, and internal linking — so the site is intuitive for users and optimized for search engines.
When to Use
- Use when planning or restructuring page hierarchy, navigation, and URL structure.
- Use when mapping site sections, breadcrumbs, and internal linking.
- Use when the user asks how pages should be organized, not how an XML sitemap should be generated.
Before Planning
Check for product marketing context first:
If .agents/product-marketing-context.md exists (or .claude/product-marketing-context.md in older setups), read it before asking questions. Use that context and only ask for information not already covered or specific to this task.
Gather this context (ask if not provided):
1. Business Context
- What does the company do?
- Who are the primary audiences?
- What are the top 3 goals for the site? (conversions, SEO traffic, education, support)
2. Current State
- New site or restructuring an existing one?
- If restructuring: what's broken? (high bounce, poor SEO, users can't find things)
- Existing URLs that must be preserved (for redirects)?
3. Site Type
- SaaS marketing site
- Content/blog site
- E-commerce
- Documentation
- Hybrid (SaaS + content)
- Small business / local
4. Content Inventory
- How many pages exist or are planned?
- What are the most important pages? (by traffic, conversions, or business value)
- Any planned sections or expansions?
Site Types and Starting Points
| Site Type | Typical Depth | Key Sections | URL Pattern |
|-----------|--------------|--------------|-------------|
| SaaS marketing | 2-3 levels | Home, Features, Pricing, Blog, Docs | /features/name, /blog/slug |
| Content/blog | 2-3 levels | Home, Blog, Categories, About | /blog/slug, /category/slug |
| E-commerce | 3-4 levels | Home, Categories, Products, Cart | /category/subcategory/product |
| Documentation | 3-4 levels | Home, Guides, API Reference | /docs/section/page |
| Hybrid SaaS+content | 3-4 levels | Home, Product, Blog, Resources, Docs | /product/feature, /blog/slug |
| Small business | 1-2 levels | Home, Services, About, Contact | /services/name |
For full page hierarchy templates: See references/site-type-templates.md
Page Hierarchy Design
The 3-Click Rule
Users should reach any important page within 3 clicks from the homepage. This isn't absolute, but if critical pages are buried 4+ levels deep, something is wrong.
Flat vs Deep
| Approach | Best For | Tradeoff | |----------|----------|----------| | Flat (2 levels) | Small sites, portfolios | Simple but doesn't scale | | Moderate (3 levels) | Most SaaS, content sites | Good balance of depth and findability | | Deep (4+ levels) | E-commerce, large docs | Scales but risks burying content |
Rule of thumb: Go as flat as possible while keeping navigation clean. If a nav dropdown has 20+ items, add a level of hierarchy.
Hierarchy Levels
| Level | What It Is | Example |
|-------|-----------|---------|
| L0 | Homepage | / |
| L1 | Primary sections | /features, /blog, /pricing |
| L2 | Section pages | /features/analytics, /blog/seo-guide |
| L3+ | Detail pages | /docs/api/authentication |
ASCII Tree Format
Use this format for page hierarchies:
Homepage (/)
├── Features (/features)
│ ├── Analytics (/features/analytics)
│ ├── Automation (/features/automation)
│ └── Integrations (/features/integrations)
├── Pricing (/pricing)
├── Blog (/blog)
│ ├── [Category: SEO] (/blog/category/seo)
│ └── [Category: CRO] (/blog/category/cro)
├── Resources (/resources)
│ ├── Case Studies (/resources/case-studies)
│ └── Templates (/resources/templates)
├── Docs (/docs)
│ ├── Getting Started (/docs/getting-started)
│ └── API Reference (/docs/api)
├── About (/about)
│ └── Careers (/about/careers)
└── Contact (/contact)
When to use ASCII vs Mermaid:
- ASCII: quick hierarchy drafts, text-only contexts, simple structures
- Mermaid: visual presentations, complex relationships, showing nav zones or linking patterns
Navigation Design
Navigation Types
| Nav Type | Purpose | Placement | |----------|---------|-----------| | Header nav | Primary navigation, always visible | Top of every page | | Dropdown menus | Organize sub-pages under parent | Expands from header items | | Footer nav | Secondary links, legal, sitemap | Bottom of every page | | Sidebar nav | Section navigat