导航菜单Menu
你可能会说
功能越来越多，得有一列菜单让用户找得到入口。
导航菜单是按层级组织页面或功能入口、帮助用户在产品中移动的导航组件后台可用侧边菜单列出“项目、成员、设置”，并高亮当前位置。它用于前往不同位置；切换同一对象的平级内容应使用标签页。
你可以这样告诉 AI Agent
请把后台 8 个页面按任务分组放进导航菜单，并高亮当前页面。不要把整站页面改成标签页或全部藏进“更多”。请逐个打开入口，确认网址、页面标题和当前态一致，手机上也能找到菜单。
什么时候用
- 产品有多个页面，需要一个常驻的「导航中枢」首页产品文档定价
- 后台系统用侧边栏，便于组织较多功能页面仪表盘项目成员设置
- 功能有层级，用分组和子菜单一层层收纳项目全部项目我负责的系统成员设置
- 高亮当前页，用户随时知道自己在哪概览数据成员高亮告诉你：现在在这儿
什么时候不用
- 在同一页面内切换并列内容：使用 标签页 Tabs评论历史收藏
- 菜单项过多却不分组，会降低查找效率仪表盘项目任务文件成员日程报表消息设置回收站
- 不要将保存、删除等当前页面操作混入导航菜单保存删除导出
- 页面入口很少：直接展示链接通常更清楚首页关于
组成结构 · Anatomy
整条菜单，负责排列菜单项和管理高亮状态
一个可点入口，点击跳转到对应页面
可选，用于辅助识别功能
可选，提示未读数或有新内容
常见变体 · Variants
水平导航Horizontal
入口较少且横向空间充足时，适合网站顶栏
侧边导航Vertical
功能较多并需要持续显示分组时
收起态Collapsed
内容区宽度不足时，可收起为图标导航
典型使用场景
后台管理系统侧边栏
网站顶部主导航
文档站多级目录
移动端抽屉菜单
林小狐
延伸阅读 · 权威出处
快速练习