|
一般的网站会有很多页面，面包屑导航可以大大改善用户寻找他们的路径的方法。就可用性而言，面包屑可以减少一个网站的用户返回上一级页面的操作次数，而且他们可以提高网站部分和页面的可查找性。他们还是在网站层次中指示用户所在位置的有效的视觉助手，这使之成为承接页面上下文信息的很棒的根源。 什么是面包屑? 面包屑(或称为面包屑路径)是一种显示用户在网站或网络应用中的位置的二级导航方案。这个术语来自于神话故事《奇幻森林历险记》，故事的两个小主人公丢下一条面包屑路径，然后顺着这条路径回到了家中。就像这个故事一样，在现实世界的应用程序中，面包屑为用户提供一种追踪返回最初访问页面的方式。 Delicious.com网站的面包屑 通常可以在有大量的按一定等级组织的内容的网站上找到面包屑。也可以在有多于一个步骤的网络应用上见到它们，这个时候他们的功能类似于进度条。最简化的方式是，面包屑就是水平排列的被大于号" > " 隔开的文本链接;这个符号指示该页面相对于链接到它的页面的深度(级别)。 在本文中，我们将探索面包屑在网站上的用法，并讨论在自己的网站中应用面包屑路径的一些最佳实践方法。 什么时候使用面包屑? 面包屑导航用于大型网站和按分级排列页面的网站。一个典型的案例就是电子商务网站，在这类网站中，大量的产品被按照逻辑分类分组。 你不必在没有逻辑等级或分组的单级网站上使用面包屑。一个决定是否使用面包屑导航的方法是建立一个网站地图或结构图来描述网站的导航结构，然后分析面包屑是否能提高用户在类别内和类别之间的定位能力。 面包屑导航应该作为扩展的额外的功能，而不能替代有效的主要导航菜单。它是一个方便的功能;一个允许用户定位他们在哪里的二级导航方案;一个定位你的网站的可选择的方法。 面包屑主要分为三类: 一、基于位置 基于位置(Location-based)的面包屑向用户显示他们在网站的哪一个级别页面。它们一般典型的用于有多个级别(一般是多于两级)的导航方案。在下面的例子中(来自于SitePoint)，每一个页面的文本链接表示它比它右边的文本链接高一级。 二、基于特性 基于特性(Attribute-based)的面包屑路径显示一个特定页面的特性。例如，在Newegg，面包屑路径表示在一个特定页面显示的特性内容。
三、基于路径 基于路径(Path-based)的面包屑路径显示用户到达特定页面的操作步骤。基于路径的面包屑是动态的，它们显示用户在到达当前页面之前访问过的页面。 使用面包屑的优势 一、方便用户：面包屑主要用于为用户提供导航一个网站的次要方法。通过为一个大型多级网站的所有页面提供面包屑路径，用户可以更容易的定位到上一次目录。 二、减少返回到上一级页面的点击或操作：不用使用浏览器的“返回”按钮或网站的主要导航来返回到上一级页面 ，用户现在可以使用用更少点击数的面包屑来。 三、不用常常占用屏幕空间：因为它们通常是水平排列以及简单的样式，面包屑路径不会占用页面太多的空间。这样的好处是，从内容过载方面来说，他们几乎没有任何负面影响。 四、降低跳出率：面包屑路径会是一个诱惑首次访问者在进入一个页面后去浏览这个网站的非常好的方法。比如说，一个用户通过谷歌搜索到一个页面，然后看到一个面包屑路径，这将会诱使用户点击上一级页面去浏览感兴趣的相关主题。这样，从而，可以降低网站的总体 跳出率。 面包屑路径的错误使用 使用面包屑路径是一件相当简单的事情，而且在决定使用它们之间只需要很少的指导性考虑。让我们看一些可避免的常见错误。 一、在你不需要的时候使用面包屑 一个常见的使用的错误是在没优势的时候使用面包屑。 在上面的例子中，Slicethepie 冒险迫使用户使用太多的导航选择。(1)主导航， (2) 面包屑路径和(3) 次要导航太接近了。这个应用中的面包屑路径不能为用户提供额外的便利，因为下一级页面的次要导航正好在它下面。而且，当点击面包屑的二级链接“Music”时，它将带你到第一个tab“Listen”，这会错误的暗示第一个tab在另外两个tab(“Search”和“Artist hall of fame”)的较高级别。 二、使用面包屑作为主要导航 就像前面规定的，使用面包屑作为一个可选的辅助导航。 在上面的例子中，mefeedia 网站没有提供一个浏览视频的主要导航菜单，尽管在页面底部有文字链接导航，在页面的主体部分没有导航菜单，这使得浏览网站的其它部分就比较困难。 如果你直接到达了一个页面——比如说，通过谷歌搜索结果，你可以选择的导航就只有面包屑。或者如果你已经浏览过一个网站页面，然后到达一个没有显示主要导航的页面，你将不得不点击浏览器的“返回”按钮来获取主菜单。 三、在页面有多级目录的时候使用面包屑 面包屑路径有一个线性结构，因此如果你的页面不能分类到整洁的目录，使用面包屑时间比较困难的事情。决定是否使用面包屑很大程度上取决于你如何设计你的网站分级。当一个低一级的页面在(或能放入到)多于一个上级目录下时，面包屑路径将会是无效、不正确和让用户困惑的。 面包屑导航设计注意事项 当设计一个面包屑导航方案时，记住几件事情。让我们看看在你处理面包屑的时候可能发生的几个问题。 一、什么时候应该使用分割链接条目? 一般接受和最被认可的分割面包屑路径的超级连接的符号是“大于号”。一般来说，> 符号用于指示级别，就像父目录 > 子目录的格式一样. 其它常用的符号有指向右边的箭头、右直角引号(») 和反斜线(/). 使用哪种符号取决于网站的审美和使用的面包屑类型。比如，对于基于路径的面包屑，链接不必相互之间有等级关系，那么使用“大于”号可能不能正确的传达它们之间的关系。 二、它应该多大? 你应该不希望你的面包屑支配页面。一个面包屑仅仅担任对用户的一种辅助(便利)作用。它的大小应该向用户传达这个理念，然后相对于主要导航菜单至少要比较小、或不太突出。 在确定你的面包屑的大小的时候，一个服从的很好的凭感觉的方法是，当访问这个页面的时候，它不应该是页面中最醒目的元素。 (责任编辑：admin) |
