面包屑导航对 SEO 和可用性的重要性

什么是面包屑导航，何时使用面包屑？ 面包屑导航如何影响可用性和 SEO？ 在改善您的在线形象时，此类问题可能会让您不知所措。

作为网站所有者，您的主要任务是使您的网站尽可能舒适和实用，从而为访问者提供积极的用户体验。 否则，您将失去潜在客户，因为当今的客户更喜欢可访问性和可用性。 没有人愿意等待您的页面加载，也没有人愿意在您的网站上迷路。

想象一下，您将每周进行一次杂货店购物。 您访问了一个巨大的在线超市，该超市提供来自不同部门的大量产品。 而且您被困在列表的第一个位置，因为您不知道如何找到牛奶或切换到整个产品目录。 它会让你感到沮丧，特别是如果你没有太多时间购物。

当您的网站缺乏适当的面包屑导航时，这就是您的客户的感受。 在这种情况下，困惑、沮丧和烦恼只是潜在客户的一些情绪。 因此，如果您的网站还没有方便的导航，那么是时候考虑添加面包屑了。

什么是面包屑导航？

面包屑导航是指寻路，代表一个面包屑路径，帮助网站用户熟悉他们的位置并了解网站层次结构。 面包屑导航由面包屑组成——位于主网站导航（网站菜单）下方的特殊导航链接。

存在一种误解，认为面包屑仅对具有复杂结构和广泛层次结构的大型网站是必需的，例如电子商务网站。 然而，面包屑导航适用于任何至少三层深度的网站。

面包屑的基本类型

从根本上说，面包屑主要分为三种类型：层次或基于位置的面包屑、基于属性的面包屑和基于历史或路径的面包屑。 下拉面包屑导航也属于面包屑，但代表一种特定的类型，非常适合大型网站。 请记住，每种面包屑类型都有特定的元素轨迹。

层次结构或基于位置的面包屑

因此，基于位置或层次结构的面包屑向用户显示他们在网站上经过的整个路线，使他们能够无缝地导航多个站点层次结构级别。 这种便利性使这种面包屑类型成为简化网站导航的最受欢迎的选项。

基于属性的面包屑

基于属性的面包屑也称为动态面包屑，因为它们展示了用户选择的属性轨迹，并且可以根据点击路径而变化。 这种类型的面包屑导航可以让潜在客户了解更多他们可能感兴趣的产品，因此它是一种为客户提供增强选择选项的智能方式。

基于历史的面包屑

基于历史的面包屑代表用户登陆当前页面所经历的一组步骤。 它们提供访问过的网站页面的完整路径，并且可以在功能上替换为浏览器的后退按钮。

面包屑导航还有一个选项——带有下拉菜单的面包屑。 这种逐步增强的解决方案适用于具有复杂元素和大量信息的大型网站。 下拉面包屑导航与基于位置和基于属性的面包屑兼容。

为什么需要面包屑导航？

无论是基于位置的、动态的、下拉的，还是基于历史的面包屑导航，在您的网站中添加面包屑都可以为您带来极佳的收益。 因此，请查看使用面包屑的优势，并了解组织良好的面包屑跟踪如何帮助您改进您的网站。

精致的网站可用性

首先，连贯的面包屑导航极大地改善了您浏览网站的过程。 网站访问者可以在您的网站页面之间自由移动，没有任何麻烦，整个用户体验得到改善。 接下来，面包屑有助于可视化当前和最近的位置，因此用户无需花费额外的时间浏览您的网站。

此功能在处理像亚马逊这样的大型市场时非常有用，因为用户在面对各种各样的产品类别、子类别、产品页面等时可能会感到失望。使用经过深思熟虑的面包屑路径也可以使您的内容看起来井井有条并允许访问者快速找到所需的信息或切换到必要的站点部分。

此外，不同类型的面包屑将使您能够正确利用屏幕空间。 精心设计的面包屑作为简单的导航元素出现，通常代表平滑的水平线，为用户提供浏览网站的机会。 这么窄的线条看起来很整齐，有助于设计师防止页面超载。

增强的 SEO 性能

精心设计的面包屑导航路径还为提高网站在自然搜索结果中的性能提供了广泛的机会。 例如，面包屑允许您通过调整网站页面上的链接汁来微调内部链接。 它对 SEO 非常有益，因为它可以帮助搜索引擎更好地掌握您网站内容的结构。

此外，详细的面包屑标记是丰富您在 Google 上的搜索片段的绝佳方式。 Google 片段或搜索片段是在搜索引擎结果页面或 SERP 中表示的内容提取。 它们包含网站页面（元数据）的简要描述，帮助用户了解特定网站页面与其查询的相关性。 由于 Google 更喜欢直接在搜索结果中显示面包屑，因此最好编写准确的面包屑轨迹，这将对您的代码段产生积极影响。

如果您想检查搜索片段的外观，可以在 Google 的帮助下手动检查页面。 还有一些自动工具可以帮助您检查不同关键字的 Google 代码段并监控特定时期的代码段性能。 例如，看一下 SE Ranking 的 SEO 监控工具。

该工具具有一项功能，可让您按关键字全面跟踪搜索片段，并在方便的选项卡中调查网站页面的搜索外观。 通过到达分析和流量部分并导航到片段选项卡，创建一个新项目并监控所需关键字的片段。

适当的面包屑导航也有助于降低跳出率。 如果访问者来到您网站的特定登录页面，他们可以通过适当的面包屑进入其他页面。

此外，准确的面包屑跟踪还可以让初次使用的用户在您的网站上停留更长时间。 他们可能对您网站的不同类别和子类别感兴趣，这就是为什么面包屑非常适合降低网站的整体跳出率。 您可以在 Google Analytics 或 SE Ranking 中查看跳出率和平均会话持续时间（导航到Analytics & Traffic ，然后转到Traffic ）。

使用面包屑的 9 个实用技巧

由于其对网站可用性和搜索结果可见性的显着影响，使用面包屑导航已变得司空见惯。 然而，要获得最佳结果，您需要正确使用面包屑标记。 有一些使用面包屑的实用方法，您可以在下面查看。

#1 确保您的网站确实需要面包屑

当然，大型电子商务网站并不是唯一使用面包屑导航的地方。 然而，在某些情况下，面包屑看起来很笨拙并且无法发挥其主要功能。 例如，如果您有一个单级网站或具有扁平层次结构的网站，则面包屑标记是不合适的。

因此，您需要确保添加面包屑路径对您的网站有意义。 要检查您的网站是否需要面包屑，请使用一些网站爬虫，例如 Screaming Frog，它会显示您网站架构的所有级别。 或者，您可以手动可视化您的网站结构。

#2 不要用面包屑代替你的主站点导航

您的主要网站导航菜单的便利性和相关性是增强用户体验的关键，而面包屑代表了一种彻底的增强，使网站探索过程对访问者来说更好、更舒适。 考虑使用面包屑导航作为支持主站点菜单的绝佳方式。

#3 优先链接到您的主页

在为您的网站创建完美的面包屑导航时，请考虑使用指向主页的链接开始面包屑导航。 通过在面包屑标记的开头添加指向您的主页的链接，您可以提供一个强大的锚点，强调用户的旅程并阐明整个路线。

#4 确保你的面包屑路径是一致的

如果面包屑导航具有一致性，那么它就可以很好地工作。 这就是为什么确保您的面包屑提供有关您网站上的用户路径的足够信息至关重要的原因。 链接面包屑标记的所有元素，除了路径中的最后一项，以避免没有任何意义的空链接。 此外，要添加对比度并突出显示路径的当前页面，请将最后一项设为粗体或用不同的颜色强调它。

#5 使用分隔符突出显示面包屑

您绝对不希望您网站上的面包屑路径看起来凌乱。 因此，尽量分离面包屑导航的元素，并为标记提供干净整洁的外观。 随意使用斜线、箭头、引号等符号，或要求您的设计师以独特的布局样式突出显示面包屑，以合适的颜色模仿线条或标签。

#6 选择正确的面包屑位置

您的网站布局应该结构良好且有条理，以提供高水平的用户体验。 每个网站页面都需要有一个连贯的标题标记，以确保正确抓取和其他页面元素的正确位置。

例如，H1 标题上方的区域是放置面包屑路径的最佳位置，因为它在访问者的视线范围内，提供了更好的方向感。 Marks and Spencer 网站是正确放置面包屑的一个很好的例子。

#7 确保你的面包屑显示当前用户的位置

在您的网站上实施面包屑导航之前，请确保您了解此类基本导航元素的主要目的。 面包屑标记不应显示会话历史记录，因为浏览器的后退按钮完全可以处理此任务。

从本质上讲，面包屑导航旨在帮助访问者整理整个网站层次结构，因此让您的面包屑导航实现这一主要功能至关重要。 您的面包屑应该向用户阐明您网站上的路径，反之亦然。

#8 不要在面包屑导航中使用 IA 类别

特定的面包屑路径应包括与网站上所需用户路径相对应的有效页面，以提供精细的网站导航。 因此，每个面包屑元素（除了跟踪中的最后一项）都必须将用户导航到相关页面。 面包屑标记旨在实现页面之间的无缝导航。

如果您网站的某些页面没有相关页面可登陆，请考虑在面包屑导航中避免使用它们。 例如，看看维多利亚的秘密网站。 主站点菜单包含具有手袋子类别的配饰类别。

此子类别没有单独的页面。 因此，面包屑路径不包括 Handbags，但包含一个类似的 Bags & Accessories 元素，该元素在网站上具有相关页面。

#9 确定最佳面包屑填充和大小

尽管您的面包屑导航应该引人注目，但它不应代表整个网站页面上最突出的元素。 因此，请考虑面包屑的填充和大小，以使它们成为页面样式的一个很好的补充。

面包屑标记完全是为了用户的方便，所以尽量保持冷静和统一，避免明亮的口音和大而非凡的字体。 例如，请注意 Tommy Hilfiger 网站，其带有简洁的面包屑路径，非常适合整个网页布局，并且不会分散用户对页面内容的注意力。

概括

面包屑导航使浏览网站变得更快、更舒适。 实施面包屑可以显着提高网站的可用性并提高您的 SEO 性能。 我们希望本指南能帮助您完美地将面包屑标记添加到您的网站。