面包屑以内部链接的形式为网站上的用户提供选项,以便快速返回主页或网站的另一层级。因此,借助面包屑导航,用户可以重建他们之前访问过的页面。这种二级路径导航通常根据网站按层次结构构建,并显示从主页到当前位置的逻辑路径。面包屑导航通常位于网站的上部区域,通常作为设计元素不太显眼。
内容
1 背景
2 面包屑的图形描述
3 种面包屑
4 应用
5 网站上面包屑的实现
面包屑导航的6 个优点
搜索引擎优化的7 个重要性
8 个 网页链接
背景
该术语源自格林兄弟的童话故事“汉塞尔和格莱特”。在童话故事中,两个孩子利用面包屑找到了回家的路。面包屑在互联网中的应用,为用户提供了返回主页的能力。面包屑导航可追踪您之前的页面。此导航采用分层结构,显示从主页到页面树中当前位置的路径。面包屑导航通常位于页面顶部,通常不会以华丽的方式显示。
面包屑
面包屑的图形描绘
标签将通过箭头、其他印刷符号或图形和按钮来表示。通过点击,用户要么进入主页,要么进入 wiki 主页。因此,导航的最后一点无法点击。面包屑导航始终显示在网站的“首屏”区域,但它们的字体和颜色相当低调,因此主导航仍然引人注目。一致性也很重要:如果使用辅助导航,则应在所有页面和子页面上提供。
面包屑的类型
严格来说,面包屑与点击路径是不同的,因为点击路径可以通过跳转到不同的层次结构来区分,可能是循环的,在逻辑上没有必要。然而,面包屑产生的数据通常来自用户所遵循的点击路径。根据面包屑的变化,带有点击路径的导航 司法部数据库 与网站的其他元素和级别相同或相关。
因此,面包屑导航可以根据用户当前所处的相对网站级别或点击路径进行区分。
点击路径:这是一种基于路径的导航,它跟踪实际的点击路径并显示当前位置。对于路径繁多且结构深厚的网站,变化的可能性较小。最重要的是,用户可以使用浏览器的前进和后退按钮实现相同的功能。数据的实现取决于点击路径分析的数据,在某些情况下,基于路径的导航可能会非常长。
位置:所谓基于位置的面包屑导航,指的是用户在网站层次结构中的当前位置。拥有 2 个以上子层级的网站通常会实现这种变化,以便能够快速到达页面树中的父元素。
类别(属性):基于属性的面包屑导航允许用户查看当前访问的页面属于哪个类别,以及该页面可以归属于哪个属性。通常,电子商务网站和在线商店会在产品层面使用此类导航系统,并与搜索一起使用,并提供搜索和个性化功能。因此,实施起来更加复杂,因为面包屑导航必须适应网站的功能,甚至可能还要适应数据库。
应用
面包屑导航主要用于具有复杂层次结构的大型网站和门户。您也会经常在网上商店中看到面包屑导航选项,因为它们可以帮助用户在大量类别和产品选择中找到自己的方向。如果网站没有逻辑层次结构,则不建议使用面包屑导航。一种方法是构建像站点地图一样的面包屑结构,这通常反映了网站架构。
值得创建站点地图,然后检查面包屑导航是否有用。如果页面结构包含多个级别,则应在站点地图中看到。最后,面包屑可以像站点地图一样构建,因为它们反映了页面架构。以下规则很重要:面包屑导航始终是辅助帮助,既不能替代菜单也不能替代导航。因此,即使在布局和设计方面,主要和次要导航也应该分开。
网站上面包屑导航的实现
面包屑可以通过多种方式整合:
插件:根据 CMS(例如 word press),面包屑可以使用不同的插件。附加程序可以进行更改并集成辅助导航。结构化数据或微数据的支持是可选的,因为面包屑可以被搜索引擎读取并显示在 SERP 中。
PHP 和JavaScript:或者,可以将不同程序员和脚本语言的代码元素集成到源代码中。例如,在PHP中定义一个函数,然后在文档中检索该函数。这与 JavaScript 类似,尽管动态生成的网站也会获得面包屑。
内容管理系统:一些 CMS 和商店系统在后端也提供面包屑导航选项。实现通常相对简单,只需点击几下即可。
HTML:手动变体基于可在 Div 中总结的链接。相对路径指向之前访问过的部分。设计通过 CSS 塑造,并且应保持一致。
面包屑导航的优点
面包屑对于网站的 可用性有以下优点:
它们向用户显示当前相对于网站其他层级的位置。借助它,面包屑可以支持使用和导航。
只需单击一下,即可浏览页面层次结构。如果用户在信息架构中间停留在 Google 搜索或深层链接上,面包屑导航是一种快速而简单的导航帮助。
面包屑在网站上占用的空间不大,而且相对容易实现。
据可用性专家雅各布·尼尔森 (Jakob Nielsen) 称,它们从来不会对用户测试造成问题。用户知道这个二级导航是什么,以及如何使用面包屑导航。
搜索引擎优化的重要性
根据大量可用性测试,人们认为面包屑导航极大地帮助了用户导航。因此,从可用性的角度来看,面包屑导航是不可或缺的。从 SEO 和页面优化的角度来看,正确实施面包屑导航非常重要。一段时间以来,Google SERP部分将面包屑导航作为丰富摘要显示在 URL 行中。建议使用微数据在源代码中标记面包屑导航(更多信息可在Google 支持中找到)。
从另一个意义上讲,面包屑导航有助于搜索引擎抓取和汇总网站。通过导航,内部链接将得到加强,主题相符的 URL 将通过导航元素进行链接。因此,通过面包屑导航,可以到达页面层次结构中更深层次的目录,并更快地进行抓取。