面包屑导航(Breadcrumb Navigation)这个概念来自童话故事"汉赛尔和格莱特"，当汉赛尔和格莱特穿过森林时，不小心迷路了，但是他们发现在沿途走过的地方都撒下了面包屑，让这些面包屑来帮助他们找到回家的路。所以，面包屑导航的作用是告诉访问者他们目前在网站中的位置以及如何返回。

常见的面包屑可以分为三种基本类型

基于位置的面包屑导航：这种类型是最常见的。这种类型的面包屑导航可以很好的指出当前页面与整个站点的层次结构。这种面包屑导航可以显示当前页面的前一个页面或者目录的链接。可以使访客了解自己的位置，以及可以更快的找到自己想要到达的页面。可以很好的提高用户的友好体验。

基于属性的面包屑导航：这种面包屑导航最常出现在电子商务站点。这种面包屑导航可以很好的指出当前页面内产品的其他属性或者类别。对于一个产品来说，所具有的属性往往不只有一种，而通过这种面包屑导航可以给消费者一个更加直观的了解。

基于路径的面包屑导航：这种面包屑导航是最不常见到的。这种面包屑导航和上文所说的童话故事类型很像。他们可以显示访客在到达页面前所访问过的网页的链接。这种面包屑导航不是很受欢迎，因为他们的功能基本上是和前进和后退的按钮是一样的。

了解了面包屑，那么我们接下来看看在网站设计中面包屑导航都有哪些注意事项。

别把面包屑替代了主要导航系统：面包屑导航仅仅是一个辅助的导航系统，它是代替不了主要导航系统的，面包屑导航的作用就是抵达其他层级的快速定位链接系统，协助用户方便他们的选择。面包屑导航和主导航作用是不一样的，也是不能相比的。

分隔符的使用：一般面包屑的分隔最常见的就是">"。分隔符是没有硬性要求的，可以自由选择自己的风格。每个人的设计风格，都是不一样的，分隔符的使用也是存在很大差异的。合适的尺寸和间距：在设计面包屑导航时，一定要要结合网站页面的空间大小，不能占据太多的空间页面，保证面包屑的大小尺寸合理，不能超过主导航。同时，也一定要注意层级之间的间距，疏密合理，使用时简单、快捷。

面包屑不是视觉的焦点： 面包屑只是一个辅助导航，并不是主导航，它在设计字体和颜色时，应该相对要简洁，不必渲染，面包屑不应成为用户视觉的焦点。

虽然眼下很多网站都流行使用面包屑导航，但是并不是所有的网站都适用。符合下面两个条件的网站才适合使用面包屑导航。

1、层级较深的网站，面包屑导航适合层级较深的网站，如果只有一级分类的话，通过主导航就可以起到快速定位的作用。比如“豆瓣网”类型扁平构架的网站就没有使用面包屑导航。

2、独立不交叉的网站结构，由于面包屑网站导航路径是线性结构的，因此网站内容必须划分的非常清晰，且不存在交叉；否则，面包屑导航的路径就不是唯一的，同一分类可能出现在不同的路径中，让用户感到困惑。

在网站建设的过程中要合理的使用面包屑导航，为用户提供最佳的用户体验，实现网站的价值。

文章内容来源于网络，侵删