导读（3行收益）：企业网站常见问题：点进三级页找不到回哪、栏目层级太深、面包屑是死链接。本文给一套做法：栏目层级、面包屑联动与当前页高亮，附建表结构。看完网站导航不会再让人迷路。
一、为什么用户会迷路
三个高发问题：
- 层级太深：从首页点四下才到详情，回不去；
- 面包屑是摆设：点面包屑不跳转，或链接错；
- 当前在哪不明显：菜单不高亮，用户不知道自己在哪个栏目。
根源是导航只做了个顶部菜单，没有栏目树、没有面包屑、没有当前态。
二、先建栏目树
CREATE TABLE `site_category` (
`id` BIGINT PRIMARY KEY AUTO_INCREMENT,
`name` VARCHAR(64) NOT NULL,
`parent_id` BIGINT DEFAULT 0 COMMENT '0=一级栏目',
`sort` INT DEFAULT 0,
`path` VARCHAR(255) COMMENT '如 /about/news'
) COMMENT='网站栏目';
关键点：两层到三层就够——一级栏目+二级栏目，详情页挂在二级下；用 path 记录层级路径，面包屑直接拼。避坑：层级超过三层——用户点不到；不用 path——算面包屑要反复查父子。
三、面包屑怎么联动
| 位置 | 显示内容 |
|---|---|
| 首页 > 新闻 | 一级栏目链接 |
| 首页 > 新闻 > 公司动态 | 二级栏目链接 |
| 末级 | 当前文章标题，不可点 |
关键点：面包屑根据 path 反查栏目树生成；每一级都要能点回对应列表页。避坑：面包屑写死——栏目改了面包屑不变；末级也能点——点了刷新当前页。
四、当前页高亮
- 用户进到哪个栏目，顶部菜单对应项高亮；
- 二级页左侧栏也要高亮当前分类；
- 面包屑最后一项是当前页。
避坑：不做当前态——用户不知道自己在哪；高亮和实际栏目对不上——URL 变了菜单还停在首页。
五、踩坑清单
- [ ] 栏目层级超过三层；
- [ ] 不记录 path，面包屑现查父子；
- [ ] 面包屑写死、不随栏目变；
- [ ] 面包屑链接错或死链；
- [ ] 顶部菜单不高亮当前栏目；
- [ ] 二级页左侧不高亮；
- [ ] 详情页没有面包屑。
六、工程落地建议
网站导航建议按「栏目树+path+面包屑联动+当前页高亮」落地。若团队用成型建站平台（如乔拓云企业网站）起步，重点核对栏目层级、面包屑与导航高亮是否可用。
七、复盘清单（可直接抄走）
- [ ] 栏目是否控制在两三层；
- [ ] 是否记录栏目 path；
- [ ] 面包屑是否按 path 生成；
- [ ] 面包屑每级是否可点；
- [ ] 顶部菜单是否高亮当前栏目；
- [ ] 详情页是否有面包屑。
结语
网站导航不是摆个顶部菜单，而是栏目有树、面包屑能点、当前态清楚。这几步做对，用户才不会点进三级页就迷路。本文仅作技术分享，具体功能以各平台官方实时信息为准。
