面包屑导航是一种辅助导航元素,通常显示在页面顶部附近,它向购物者展示了从首页到当前浏览页面的路径——例如,“首页 > 服装 > 毛衣 > 有机棉圆领衫”。它让访客能够立即了解自己在网站分类层级中的位置,并能轻松返回上一级分类,而无需使用浏览器的后退按钮或在主菜单中查找。对于使用目录数据源的产品页面,面包屑导航通常会根据对每个商品进行分类的相同分类数据自动生成。
为什么面包屑导航对目录驱动型网站至关重要
通过购物广告或自然搜索结果进入特定产品页面的消费者,通常对该产品在整个产品目录中的位置一无所知,而面包屑导航则能让他们一眼就了解这些信息。这对于转化率至关重要:如果访客觉得某个产品不太合适,可以通过面包屑导航返回上一级类别,而不是直接离开网站,从而挽回原本可能流失的流量。面包屑导航还可以作为内部链接,强化页面在搜索引擎导航结构中的位置,许多平台还会将面包屑导航直接显示在搜索结果中,以清晰的类别路径而非原始URL的形式呈现,从而提升自然搜索结果的点击率。
面包屑导航的工作原理
面包屑导航几乎总是根据网站其他地方使用的相同分类体系动态生成的,最常见的是…… product_type or google_product_category 信息流中每个项目都被赋予一个值。这意味着面包屑导航的准确性仅取决于信息流本身的分类工作——信息流中分类错误的商品在其页面上也会显示同样错误的面包屑路径。搜索引擎也会通过结构化数据读取面包屑标记(BreadcrumbList (架构),这使得类别路径可以直接出现在搜索结果摘要中,并且此结构化版本应与任何 HTML站点地图 它以不同的格式记录了相同的层级结构。
例如:
<item>
<g:id>SKU-10234</g:id>
<g:title>Organic Cotton Crewneck Sweater - Charcoal, M</g:title>
<g:google_product_category>Apparel & Accessories > Clothing > Sweaters</g:google_product_category>
<g:product_type>Men's > Sweaters > Crewneck</g:product_type>
</item>
<!-- Breadcrumb rendered from the same category path -->
<nav aria-label="breadcrumb">
<a href="/zh-CN/">Home</a> >
<a href="/zh-CN/mens">Men's</a> >
<a href="/zh-CN/mens/sweaters">Sweaters</a> >
<span>Organic Cotton Crewneck</span>
</nav>
因为面包屑路径直接来源于信息流的 product_type 其价值在于,纠正信息流中错误分类的产品,会自动修复其在所有出现位置的面包屑路径,无需任何手动逐页编辑。
相关概念
面包屑导航是网站整体导航结构的直观体现,与HTML 站点地图配合使用效果最佳。站点地图以扁平化、简洁明了的格式记录相同的类别层级结构,方便搜索引擎爬虫抓取。由于面包屑导航能让用户轻松从错误的点击中恢复,因此对于任何接收信息流流量的页面来说,它都是优化着陆页的有效且低成本的方法。