【译】【UX】一个页面可以有多个面包屑导航吗?


原讨论地址

提问

面包屑导航可以让用户在网站中定位,展示了到达当前页面的路径。如果一个网页属于不同的类别,能用多个面包屑导航吗,或者有没有更好的展示方式?

例如一个作家可以有不同的归类:

Writers // Origin // England // William Shakespeare
Writers // Periods // XVI century // William Shakespeare
Writers // Schools // Dramaturgy // William Shakespeare

这时候放多个面包屑导航是正确的做法吗?

评论

#1 这个页面是怎么来的?直接打开还是一步一步点进来的?
比如莎士比亚的页面,是怎么进来的,是从

www.MyWeb.Site/Writers/Origin/England/William%20Shakespeare.php
还是
www.MyWeb.Site/Writers/Periods/XVI%20century/William%20Shakespeare.php
或者就只是
www.MyWeb.Site/pages/William%20Shakespeare_(writer).php
看路径就知道该展示哪一个了吧?

回答 1

面包屑路径只有一条,最好不要打破这个惯例。一般来说用户看到面包屑主要是为了这几件事:

  • 我现在在哪
  • 我怎么来到这儿的
  • 向后导航

如果有多个路径,完成上面几个任务就很麻烦,有的还做不了。

如果想要面包屑路径交互性更好,还想要多个分支,可以考虑下拉菜单。

breadcrumbs1

同级别的其他分类链接放到下拉菜单中,可以方便的导航到其他分类,还能保持页面展示的路径不变。

breadcrumbs2

这种做法也不常用,建议使用前做个用户测试。

回答 1 的评论

我觉得这已经不能叫面包屑导航了。

回答 2

你这种场景就不应该用面包屑。

你的问题已经描述的很清楚了,从ShakespeareWriter中间有多条路径,但是面包屑只有一条路径。

怎么办?
换成 tags,按照你的例子,莎士比亚应该会关联到英格兰十六世纪戏剧标签。

tag

用标签有很多优点:

  • 很容易识别,用户可以不用点击也不用离开当前页面,就直接看到所有的类别。
  • 还可以改进不确定的搜索,用户可以从多个标签中选择一个搜索
  • 标签占用的空间,不会超过原本类别需要的空间

总之标签不但可以提升作家页面的体验,还可以简化用户寻找其他作家的方式。并且用户在线上购物网站,早已经对这个体验很熟悉了。

面包屑最后变成了这样:

Writers // William Shakespeare

用来过滤和加书签的 url 使用类似这样的结构:

example.org/writers?origin=England&Schools=Dramaturgy

回答 3

维基百科已经解决过这个问题了
面向对象编程 举例,右侧的 编程范式 框中,有多个层级的链接指向当前页面。

实际上这已经不是面包屑导航了,而是一个网站地图,同时展示相关的其他类别。根据网站规模,可以适当缩减站点地图的范围,有必要的话,也可以默认隐藏一些分支,可以点击展开。

站点地图的有点是它包含了用户需要的所有信息,让这些信息尽可能的方便访问。如果用户想看波兰的作家,只需要点击一次就行了。此外,网站地图在整个网站任何页面看起来都是内容一致的,因此用户很容易熟悉使用。

用户在读关于莎士比亚的内容时,可能会参考一下网站地图,但是用户对莎士比亚以外的内容感兴趣的时候,就会去认真读网站地图。因此不应该只列出莎士比亚所在的类别,而是列出一些用户可能会感兴趣的其他类别。