导航系统的核心目标是让用户始终知道”我在哪里、我去过哪里、我可以去哪里”。

导航模式

顶部导航

顶部导航用于全局入口，承载官网与产品线的核心切换。

• 包含品牌 Logo、核心产品入口、文档链接、语言切换
• 高度固定，不随页面滚动消失
• 当前所在区域通过视觉高亮标识
• 移动端收折为汉堡菜单

文档侧边栏

文档侧边栏用于结构化内容的层级导航，是文档中心的主要导航方式。

• 展示当前文档的完整目录树
• 支持多级折叠与展开
• 当前页面高亮，所在分类展开
• 支持分组标签，如”入门”、“指南”、“API 参考”
• 折叠时不影响阅读区域宽度

面包屑

面包屑用于标识当前页面在信息架构中的位置路径。

• 格式示例：文档 / 快速开始 / 安装
• 每一级可点击跳转
• 不用于主导航，只用于位置标识
• 在页面标题上方显示

页面目录（TOC）

页面目录用于当前页面的锚点导航，帮助用户快速定位内容。

• 提取当前页面的二级和三级标题
• 跟随滚动，高亮当前阅读位置
• 固定在页面右侧（桌面端）
• 点击后平滑滚动到对应位置

移动端抽屉导航

移动端将侧边栏与顶部导航合并为抽屉式导航。

• 从左侧滑入，覆盖页面内容
• 支持与桌面端相同的层级结构
• 点击导航项后自动收起
• 提供明确的关闭操作

版本切换

版本切换用于不同产品版本之间的导航跳转。

• 在文档顶部或侧边栏顶部显示
• 下拉选择目标版本
• 切换后保持当前文档路径（如路径不存在则跳转到首页）
• 版本号格式统一，如 v1.2、v2.0-beta

语言切换

语言切换用于多语言文档的导航跳转。

• 在顶部导航或文档顶部显示
• 支持中文、英文、日文等语言
• 切换后保持当前文档路径
• 使用语言名称而非国旗图标（如”中文”、“English”）

搜索

搜索用于全局内容查找，是最高效的导航方式。

• 支持快捷键触发（如 Cmd+K / Ctrl+K）
• 搜索范围覆盖文档、博客、API 参考
• 支持模糊匹配与关键词高亮
• 搜索结果按相关度排序
• 移动端搜索入口始终可见

设计原则

当前位置必须明确

用户在任何页面都必须清楚知道自己在哪里。

• 侧边栏高亮当前页面
• 面包屑显示完整路径
• 页面标题与导航项一致
• 顶部导航标识当前区域

层级关系必须清晰

用户应能理解当前页面在整体信息架构中的层级位置。

• 一级分类明确，不超过 7 个
• 二级分类可折叠，每个一级分类下不超过 10 项
• 三级内容通过页面内 TOC 导航
• 层级不宜超过四级

文档路径应支持从入门到进阶

文档导航应支持不同经验水平的用户找到合适的内容。

• 提供”快速开始”入口，降低新手门槛
• 按难度或主题分组，支持渐进式学习路径
• “下一步”引导帮助用户自然过渡到相关内容
• 进阶内容通过侧边栏分组区分，不与入门内容混排