如何设计更好的面包屑导航_BG大游集团·(CHN)官方网站

没有人会对面包屑导航感到特别□□□□兴奋。这些微小□□□的路径碎□□片说明了□□□用户当前□□□□在网站错□□综复杂的□□□层次结构♦中的位置。它们的设◇计看起来□□□很明显，他们在页□□□□面上的位□□置也是如□□□□此，看起来面※包屑发光◇不需要太★多的创新。
事实证明，有很多细※微的小细□□□□节可以使□□□□面包屑变◣得混乱或□□无限地更□□□有用。在本文中，我们将仔□□□细研究其□□□□中的一些。我们将探▼索我们何时真正需要面包屑，用户如何□□□使用它们，以及如何□□□□更好地设□□计它们以◆加快用户□□□在我们网◉站上的导□□航。
让我们首□□先探索人□□们如何浏★览网站，以及面包□□□□屑究竟如▼何帮助我◤们的旅程。

如何浏览□□□□网站

每个可用□□性测试都□□□表明，没有单一□□□的、通用的和□□□完善的网□□□站浏览方□□□□式。根据手头▽的任务和□□□□访问频率，用户应用□□□□非常不同的导航模式。在某些网◉站上，几乎不使□□□□用搜索但□□□主导航得□□□□到很多关□□注的情况□□□□并不少见。在其他方□□□面，类别几乎□□没有任何□□□点击，但搜索查□□询却在屋□□顶。有时面包✦屑恰好是□□□整个网站★上最受欢□□迎的导航※选择。

网站设计1

澳大利亚□□邮政服务□□在一个页□□面上结合□□了大量的□□□□导航模式。它们都有□□□不同的用●途，并且运行✦良好。

以澳大利□□□□亚邮政为□□例，各种导航※需要协同□□□工作。全局导航□□□□栏、主导航、面包屑、侧边栏和□□□□选项卡。用户可以□□在各个级□□□别之间跳□□□□转，他们可以•使用面包□□□屑轻松地□□□向后移动，使用顶部◤的水平导△航向前移□□动，使用侧边□□□栏导航横□□□向移动以□□□□及使用选◢项卡在页◆面的各个□□部分中切□□□换上下文。
我们很少逐个浏览每个部分，甚至很少注意到网站上所有可用的导航。对于经常访问的网站，例如新闻网站，我们将使用非常有限的一组页面和功能。事实上，我们可能□□□无法记住□□□□我们单击□□了哪些功·能和部分，但我们可□□□□能会记住它们在界面中的位置。

网站设计2

一旦你登□□陆页面，你将如何□□□理解你在□□□哪里？在这里，面包屑有◉很大帮助。示例：冰岛邮政□□服务

当我们登□□陆一个我□□□们以前从□□□未访问过◆的网站时，例如国家※歌剧网站，我们首先□□□评估选项□□□□和功能的□□□广度。这通常是□□□□通过上下滚动页面来实□□□现的——先是慢，然后是更□□□快——并熟悉导□□□航菜单。我们点击▲侧边栏，在选项卡◉之间切换□□并打开大◤型下拉菜□□□单。我们只是□□四处游荡，相信导航○路标和我△们极其不□□□可靠的预□□□□感。我们扫描、识别模式□□□□并相信我□□们的直觉。
有时，如果我们☆找不到我□□□们所追求□□的东西，我们的旅□□□□程就会变□□□□成对各种□□□页面和类□□□□别的疯狂探索——通常是紧●张的、混乱的、耗时的和▽令人沮丧□□□□的。如果有任□□何事情没•有按预期□□工作，我们就不❖再使用它，因为我们▼不再信任□□□□它。一旦我们□□□真的没有□□任何选择，我们就会❖完全放弃。

网站设计3

有时，重新设计□□□□的网站会丨导致流量□□□□大幅下降。这不是因▽为出了什□□么问题。相反：我们在用□□□户所在的□□□地方遇见□□用户，直接显示□□答案，因此无需□□□访问网站。
但是，当几乎不□□□使用导航□□和搜索时，不一定是□□□因为网站❖设计或构□□□建不佳。相反：内容可能□□组织得非□□常好，以至于人□□□□们实际上□□□很快就找到了他们需要的东西——甚至可能□□□□在首先访□□问网站之□□前，仅仅通过□□□浏览谷歌□□□的搜索结□□□果。一旦他们□□□这样做了，就没有太◥多理由留□□□□在网站上。
虽然我们经常关注退出率和跳出率以及在页▽面上花费•的时间，但这些指□□□标很少能✦揭示用户□□□在网站上□□所做的事□□情的完整□□□□故事。有人在给□□□□定页面上◢花费 4:30 分钟这一□□□事实不一★定是一个□□□好的指标。有人在 30 秒内离开□□这一事实□□并不一定□□□是坏事。
为了跟踪□□□用户对导◣航（和搜索）的理解和□□使用情况，我们需要☆跟踪用户□□□□在手头任□□□务上的成□□功程度。您可以将❖其视为在△较长时间□□内建立和□□研究的设计 KPI 。值得收集有关以用户为中心的指标的见解，例如：

任务完成率，
任务完成时间，
第一次分享的时间，
客户支持查询，
负面评论的比率，
提交数据的准确性

因此，我们的任◎务是为用□□户铺平道★路，让他们清◥楚、明确、明确地帮□□助他们完□□□□成任务。这通常意◆味着支持三个导航方向：前向导航、后向导航和侧向导航。

网站设计4

对于导航□□□□树较浅的○网站，面包屑可□□□□以集成到☆标题和标□□题中。手工艺委□□□□员会就是★这样做的。

转发导航

我们访问□□□网站是有□□□原因的，在某些网□□□□站上，它可以像□□检查银行◇账户或探□□索大型数□□□□据集一样□□□具体。因此，一旦我们❖最终进入◇主页或仪□□□表板，我们就会□□□在网站的□□□层次结构□□□□中向前移▲动，从非常广□□泛的页面☆到非常具□□□□体的页面，以尝试完□□成我们已○经着手完●成的任务。

网站设计5

结合了多◣种导航方□□□□向——通过主导□□□航、侧边栏导□□□航、页内导航□□和面包屑□□□导航，可以轻松□□□□向前、向后和横▽向导航。一次全部。
在导航方□□面，我们从主□□□页移动到□□□□一个类别，再到子类□□□别，再到进一□□步的页面□□内导航，以找到我□□□□们最终需•要点击的□□□特定功能。如果幸运□□□□的话，我们可以□□□□跳过整个□□□□旅程，并更早地□□□□从大型下□□□□拉菜单或□□□号召性用□□语中获得▲该功能。作为设计•师，我们越能缩短意图和行动之间的距离，用户体验就会越好。

向后导航

不过，我们并不总是有一个特定的任务。通常情况下，我们的目标是多方面的，我们会改□□□□变主意，忽略事物，做出自发□□□□的决定，并因闪烁□□的通知而※分心。因此，我们的数✦字旅程很少是严格线性的，尤其是当网站上的导航有些复杂时。
在这种情□□况下，我们最终□□□会倒退。事实上，我们后退□□是为了重□□□□新定位自□□己，选择一条□□探索的路●线，然后朝着□□□另一个方□□□向前进。然后我们▼再次跳同◣样的舞蹈，一次又一□□次，直到我们□□□□实现了我□□们的意图。在许多方♦面，这个过程□□类似于写□□一篇这样□□□□的文章。有一个总□□□□体思路可◤以推动文❖章向前发❖展，但也有绊□□脚石和重□□新考虑让□□□你退缩。
在网络上，尤其是当我们最终进入一个似乎无处可寻、内容过时、没有提供□□□急需功能□□□□的页面，或者当我□□□□们的搜索□□□查询过于□□□模糊而无□□法提供准丨确和相关□□□的结果时，就会发生▲这种情况。

网站设计6

德意志银行的导航不会突出显示用户当前所在的位置。
我们经常丨使用的一□□□□个简单测□□试是给用□□□□户一个 URL，并要求他•们解释他□□□们目前在□□□网站的哪□□个部分，并找到相似或相关的•部分。在上面的□□□德意志银□□行示例中，这会有点□□□□困难，因为导航□□中没有当□□前页面的□□□□亮点。

网站设计7

默认情况下，当前导航级别不会在导航栏中突出显示。
事实证明，我们处于◥导航的第□□三级。通常“spare and anlegen”应该处于❖活动状态□□并在页面□□□□上突出显•示，但事实并□□□非如此。只有当我·们打开一□□□个悬停菜□□单时，我们才能□□□□发现当前※页面实际□□□□上是什么。在德意志◣银行，向后导航○有点麻烦。

横向导航

好像来回□□□走动还不□□□够，有时我们□□还会横着□□走——在各个级□□□别、部分、页面和子□□□□类别之间□□猛烈地上△下跳跃。这通常发□□□□生在我们□□想要探索类似的主题或相关页面，或者探索以某种方式与当前页面相关的更多信息时。
当我们浏□□览可用选□□□项但尚未□□□□下定决心□□□□时，也会发生□□□这种情况。基本上，我们探索、浏览和点□□□击，试图创建□□□一个我们□□□面前的综□□□□合图片。

网站设计8

奥地利邮政服务支持横向导航，右侧有附加信息侧边栏。
正如我们□□□所做的那□□□样，我们需要◢指引我们□□朝着正确□□□方向前进◇的路标。事实上，考虑到发□□□□生了多少✦运动，对我们的导航方式进行□□一致且可□□预测的跟□□□踪肯定会□□□有所帮助。事实上，这正是面△包屑提供◣的。
乍一看，面包屑似乎只对向后导□□航有帮助，但我们经□□□□常使用它□□们向后移□□□动，找到更好•的路线并□□再次向前□□□□移动。通过这种□□□□方式，它们服务□□□于所有方·向的导航，并且做得□□很好。
上面列出的所有选项确实提供了方向感，但它们也▲需要相当□□□□多的水平□□□或垂直空♦间才能做◆到这一点。在整个用□□□□户旅程中，它们需要□□□□是可见的，以引导用□□□户从一个□□□页面移动□□□□到下一个□□□页面。如果它们▽在其中一□□□□个页面上□□突然消失，用户很可□□□能会迷路。在搜索结□□□□果中添加□□□□健康剂量□□□的噪音和□□□稍微繁琐♦的导航，我们不应□□该对用户◣在查找他□□□们正在寻□□找的内容·时遇到问□□□□题感到惊◣讶。
相比之下，面包屑简洁、紧凑、集中，并且可以★很好地完□□□□成工作。它们不是□□□显示所有□□级别的导□□□航，而是指示□□页面所在□□□的位置，以及对其□□□所有父级□□□□的快速访□□□□问，一直到主□□□页。有时这正□□□□是我们所□□□□需要的：不多也不□□□□少。