skills.rest
scanbott
scanbottCOMMUNITY
Explore all skills by this author →
GitHub

site-architecture

Plan website information architecture with page hierarchy, URL structure, and internal linking.

Updated Apr 21, 2026
Search Tags:#mermaid#navigation#sitemap#information-architecture#internal-linking#site-architecture#url-structure
One-click install
npx skills add https://github.com/scanbott/claude-skills --skill site-architecture-scanbott
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: site-architecture
Source: https://github.com/scanbott/claude-skills/tree/main/site-architecture
Command: npx skills add https://github.com/scanbott/claude-skills --skill site-architecture-scanbott

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Planning and structuring website information architecture, including page hierarchy, navigation, URL patterns, and internal linking, to make sites intuitive and SEO-friendly.

Core Features & Use Cases

  • Plan page hierarchies, navigation schemas, and URL structures for intuitive UX and SEO.
  • Create ASCII trees and Mermaid diagrams to visualize site structure and navigation zones.
  • Generate internal linking strategies, breadcrumb schemes, and hub-and-spoke content models for scalable sites.

Quick Start

Draft a 2-3 level site hierarchy and navigation plan for the target site, then refine with stakeholder feedback.

Frequently Asked Questions about site-architecture

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I plan a website structure and navigation for a SaaS marketing site?▼

Information architecture planning structures page hierarchy, URL patterns, and internal linking to make sites intuitive and SEO-friendly. It outputs an ASCII hierarchy, Mermaid visual sitemap, URL map, navigation spec, and hub-and-spoke linking plan.

How do I create a visual sitemap and URL structure for my website?▼

Create a visual sitemap and URL structure by drafting a 2-3 level site hierarchy and refining it. The process outputs a Mermaid visual sitemap diagram alongside a detailed URL map to establish clear navigation zones.

What is the best way to design internal linking and breadcrumbs for a docs site?▼

Design internal linking and breadcrumbs for a docs site using a hub-and-spoke content model. This approach generates an internal-linking plan and breadcrumb schemes that optimize navigation and scalable content structures.

Can I generate a Mermaid diagram for information architecture without manual coding?▼

Yes, you can generate a Mermaid diagram for information architecture automatically. The workflow produces a Mermaid visual sitemap directly from your drafted site hierarchy without requiring manual diagramming code.

Does this site architecture approach work for hybrid content portals and SaaS sites?▼

Yes, this site architecture approach works for SaaS marketing sites, content portals, docs sites, and hybrid configurations. It accommodates diverse page hierarchies, URL structures, and internal linking strategies.

Related Skills

Explore More Design & Creative Skills→
humanmadehumanmade
8

accelerate-content-plan

Analyze site performance metrics to generate a 2–3 post content plan.

Official
Intermediate
Imd11Imd11
5

site-architecture

Plan and document website architectures with ASCII trees, Mermaid diagrams, and URL maps.

Community
Advanced
calm-northcalm-north
18

build-clusters

Generate pillar-spoke content clusters from a seed keyword with interlinking plans.

Official
Advanced
mvillmowmvillmow
18

agent-hierarchy-diagram

Generate ASCII, Mermaid, and GraphML diagrams of agent hierarchy and delegation.

Community
Basic