it-swarm.cn

面包屑:可以放在页面顶部吗?

是否应该将面包屑放在页面的最左上方?

面包屑似乎总是位于导航菜单的正下方或页面内容的正上方。 1stWebDesigner的一篇文章显示了一些 面包屑设计的创意示例 ,其中99%使用此格式。

14
wnathanlee

将面包屑放在页面上的所有其他内容之上会创建错误的视觉层次结构。

我建议您阅读史蒂夫·克鲁格(Steve Krug)的 “别让我思考” ,以获得更详细的解释(第6章讨论了导航和面包屑)。

总而言之,页面上的每个部分都有一个标题,通常包含标题,但也可以包含仅影响该特定部分的操作。

最顶层的面包屑控件意味着该页面上的所有内容对该位置都是唯一的,并且更改位置会更改整个页面。

我们通常对网站的印象是它具有一个包装元素,该包装元素是全局的,并且对于所有页面都是通用的。该元素通常包含标题/徽标,导航等。尽管从技术上讲,它可能会在每个页面上重新加载,但我们(应该)将其视为不变且毫无变化。

还应考虑到,如果导航位于面包屑下方,则导航至另一页面可能会感到很奇怪,希望仅更改导航下方的内容(保持不变),而只是更改层次结构中“上方”的内容。

10
Dan Barak

我认为最好放在面包屑的地方是垃圾桶。他们并没有真正为网站提供那么多的价值。

如果您坚持要它们,那么在网站导航后放置它们的最佳位置。对我来说,将它们放在网站的顶部是一个非常糟糕的主意。这肯定会损害您的SEO和可访问性,也可能会损害您网站的美观。面包屑并不完全“漂亮”。

之所以将它们放在内容之上,是因为它们直接与内容相关。将它们放在导航/标题上方会中断与内容的链接,并且面包屑会丢失一些上下文。我看过这种被称为认知共鸣的事物,尽管这实际上不是一个有效的短语,但在这里有点道理。

编辑:扩展它如何损害辅助功能和SEO:

可访问性:如果将面包屑放在页面的顶部,使用辅助技术(如屏幕阅读器)的人现在必须遍历所有面包屑才能访问站点导航链接。因此,您需要真正考虑用户的更可能的目标是什么,单击导航链接或单击面包屑链接。除非您是Craigslist,否则只有导航栏是面包屑,否则更可能是导航链接。

SEO:搜索引擎仅遵循一定数量的链接(并在页面上读取一定数量的内容,但这在这里不太重要)。再次,它导致重要性。 Google的搜寻器,面包屑链接或主站点导航链接对您而言更有价值(理想情况下,这将使搜寻器获得比面包屑更多的内容)。现在,这可能不再是一个问题,因为大多数爬网程序可能会比仅导航和面包屑更深入地进入页面,但是最好能确定这种事情。

另外,请考虑不要将其放在网站顶部的另一个原因:并非您网站上的每个页面都会有面包屑。这样,用户可能会习惯于以某种方式查看您的标头,并且随着时间的流逝将学会忽略它,除非他们想在此采取特定的措施。这意味着您的面包屑可能比被放置在内容上方的可能性更大。至少,如果它们位于您的内容之上,则当用户阅读内容时,它们更有可能出现在用户的视野中(再次,面包屑和内容之间的共鸣)。

5
Charles Boyung

Jakob Nielsen 出于以下原因推荐面包屑

  • 面包屑向人们展示了他们相对于高级概念的当前位置
  • 面包屑提供一键式访问更高级别的站点的权限
  • 面包屑永远不会在用户测试中引起问题
  • 面包屑只占很小的空间

但是,他的确将它们称为“辅助导航”,尽管他对提出一个位置没有具体说明,但该站点的主要导航之后是该导航的重要含义。

来源 http://www.useit.com/alertbox/breadcrumbs.html

1
DaveP

一种有趣的方式可能是在页面的顶部创建一个面包屑/标签混合,其功能和形式类似于顶部UI模式中的Google Chrome标签。

1
Virtuosi Media

如果您使用它们,我建议它们属于H1之前。

但是我倾向于同意这样的想法,即它们在大多数情况下并没有那么有用。如果您有一个站点,其中包含非常分隔的项目并且嵌套得非常深,那么它们可以成为一种。例如,在线零售商的情况是,人们可能会登陆特定的产品页面,并且希望通过一种简单的方法来查找常规产品类别列表。

1
DA01