面包屑导航往往只占页面顶部一小行，字号比正文还小，很容易被当成装饰。但它有两个实际作用：告诉访客自己站在网站的哪一层，以及给搜索引擎一条从首页到当前页的层级路径。这两件事做不好，损失是安静发生的——访客默默按返回键，蜘蛛少认识一层结构。
面包屑解决的到底是什么问题
一个内容页通常有三条入口：导航菜单、站内链接、外部搜索或外链。面包屑补的是第四条：层级路径。它让一个藏在第三层、第四层的页面，有机会被理解为「某栏目下的某一类内容」，而不是一个孤零零的地址。
对访客来说，面包屑的价值在于「退一步」。看完一篇稿件想找同类文章，点一下上一级比按十几次返回键舒服得多。对运营来说，面包屑是栏目规划在页面上的显性表达：栏目怎么分，面包屑就该怎么显示。
面包屑常见的六类毛病
1. 和 URL 层级对不上
页面地址是 /news/2024/05/xxx.html，面包屑却从首页直接跳到标题，中间那层在页面上不存在；反过来也常见，URL 是扁平的，面包屑却硬造出五层。两者不一致本身不致命，但如果为了好看编造层级，点进去的栏目实际是空列表，那就把访客送进了死胡同。
2. 缺层、跳级
从首页直接跳到某个产品详情，省掉「产品中心 > 分类」。省掉的那一层，往往正是访客最需要的。自查办法很简单：随机抽二十个页面，看面包屑的每一级是否都指向真实存在的列表页，中间没有空缺。
3. 把当前页也做成链接
当前页不该是可点链接，点它等于原地刷新，还会让访客误以为下面还有一层。这一级用纯文本加粗即可。
4. 全站一套文字，不看页面类型
列表页、详情页、标签页的面包屑逻辑并不相同。列表页末级一般是栏目名，详情页末级是标题，标题过长时最好用短标题，免得撑破一行。
5. 移动端被整行隐藏
有些主题在小屏下直接 display:none，理由是省地方。如果导航菜单能提供同样的层级功能，隐藏可以接受；如果菜单只有一级栏目，那移动端访客就彻底失去了返回上级的入口。
6. 点击区域太挤
用箭头做分隔符没问题，问题是箭头和文字挨得太近，手指一点就误触。留出足够间距即可，不需要改结构。
一份可执行的自查清单
- 抽查十到二十个不同层级的页面，确认面包屑每一级的链接都返回 200，既不是 404，也不是需要多次跳转的地址。
- 核对面包屑层级与栏目规划表一致，不要出现只在面包屑里存在的「幽灵栏目」。
- 确认当前页那一段不可点击，前面的层级都可点击。
- 检查移动端断点下面包屑是否可见，字号是否够读。
- 确认面包屑从首页开始，而不是从某个频道开始，除非站点有明确的子站结构。
- 如果使用了结构化数据，用测试工具跑一遍，看路径是否完整、名称是否和页面一致。
结构化数据别自作聪明
BreadcrumbList 这类标记，作用是把路径信息讲清楚。注意两点：标记里的层级必须和页面上可见的面包屑一致，不能只写标记不显示；名称写栏目本来的名字就好，不要往里面堆关键词。标记本身不保证任何展示效果，写错只是多一处需要维护的地方。
别为了面包屑去改 URL
面包屑是页面上的表达，URL 是资源的位置。两者能对齐最好，但如果为了凑层级去大规模改地址，付出的跳转成本远大于收益。
更稳妥的做法是：新页面按栏目规划生成地址，老页面维持现状，用面包屑把层级补回来。
小结
面包屑是件小事，但它把栏目规划、站内导航和结构化数据串在了一起。每隔几个月抽出半小时抽查一遍，比等到访客抱怨再来翻页面省事得多。它不会带来流量奇迹，但能让站点结构清楚一点——对访客和蜘蛛都是。