面包屑网页导航设计参考实例和最佳方案...(实用4篇)

网友 分享 时间:

【导言】此例“面包屑网页导航设计参考实例和最佳方案...(实用4篇)”的范文资料由阿拉题库网友为您分享整理,以供您学习参考之用,希望这篇资料对您有所帮助,喜欢就复制下载支持吧!

面包屑导航设计交互设计1

使用面包屑导航是一个相当简单的事情,让我们一起来看看一些常见的错误以避免。

1、当你不需要使用面包屑

实施面包屑的一个常见的?错误是:使用它们的时候没有意义。

在上面的例子,SLICETHEPIE网站让用户有太多的导航选项。 (1)(2)面包屑导航(3)辅助导航主导航,非常接近。在此应用程序的痕迹线索,因为坐在下方的较低级别的页面的二级导航,没有使用户更加方便。此外,在面包屑导航(“音乐”)第二级链接上点击带您回到第一个选项卡(“听”),错误地认为,第一个选项卡上一个更高的水平比其他两个是(“搜索“和”成名的艺术家 “)。

2、作为主要的导航使用面包屑

如前所述,使用面包屑导航是作为一个可选的协助方式。

范例

在上面的例子,MEFEEDIA不提供一个观看影片的主导航菜单。虽然有文本页脚部分中的链接导航,但没有导航菜单在页面的内容部分,使得它难以浏览到网站的其他部分。

范例

如果直接到达一个视频网页上 – 也就是说,通过谷歌搜索结果,例如 – 唯一的导航选项,你可能有痕迹线索。或者如果你已经在浏览一个网站的网页,并达到一个页面不显示主导航菜单,你会点击你的浏览器“返回”按钮,进入主菜单。

3、当页面有多个类别的使用面包屑

面包屑导航有线性结构,因此,如果您的网页不能被整齐的类别划分,将很难使用它们。决定是否使用面包屑,在很大程度上取决于你如何设计你的网站层级。当较低级别的页面(或可放)在多个父目录,面包屑路径无效的、不准确,会给用户造成混淆。

夫参署者,集众思,广忠益也。以上就是山草香给大家分享的4篇面包屑网页导航设计参考实例和最佳方案...,希望能够让您对于面包屑导航的写作更加的得心应手。

面包屑导航设计交互设计2

在很多大厦或是大型超市的入口处一般都会树立路牌之类的标识来为用户指明方向,而进入到内部后则会有另外更详细的导航指示,这两者之间的关系就像是网站的主导航与面包屑导航一样,前者为用户做一个大概的结构介绍,而后者则是在大架构之后的细节延伸。

面包屑导航可以很清晰的标明用户当前所处的位置以及可供返回的链接,这在很大程度上解决了用户在网站里迷失的问题。用户从庞杂的入口到最终的目的地,面包屑导航是按一种递减的结构来呈现的。

然而这种递减的结构的最上级应不应该包括“首页”这个最大最杂的入口呢?如果面包屑导航里没有“首页”的链接,那这算不算是完整的导航结构呢?

国内四大门户网站里,关于面包屑导航设计里,网易跟腾讯是有“首页”链接的,而新浪跟搜狐则是没有“首页”与链接的:

在包括“首页”链接的导航结构里又分为两种,其一是如网易般的在“首页”之前还有当前频道首页的链接,这点与新浪以及搜狐的设计是一样的;另一种则是如腾讯般的最上级直接就是“首页”,

如网易这般的面包屑导航设计可以突显出当前频道,但同时也存在另一个问题,那就是在同一个导航中出现了两个相同的链接,提供了更多入口的同时也让更容易让用户迷惑。

而在面包屑导航里不包括“首页”的设计则给人感觉怪异,就如同从一栋大厦门口进去到某个楼层的某个房间,结果出房间的时候发现指示牌里没有大厦门口的指示位置,只是指示到这一楼层的门口。

这样的设计不得不让人联想到,这是一种各自为政的作法,最大可能的把用户留在当前频道里,而不管用什么方法。

一个完整的面包屑导航应该是从最初的入口开始,也许很多用户的最初入口直接就是某个频道首页,但不可否认,面包屑导航的递减架构的最上级应该是如金字塔的最底层一样,而国内网站们的首页设计就如金字塔的最底层一样,信息庞大而复杂,网站首页是整站中聚集度最高的地方。

关于面包屑导航的结构呈现,你有什么更好的想法?

本文来自

面包屑导航设计交互设计3

面包屑主要有三种类型

1、基于位置

基于位置的面包屑显示用户在网站的层次结构。它们通常用于导航方案(通常超过两个级别)。在下面的例子中,每一个文本链接是一个网页,是比其右侧的一个高一个层次。

范例

2、基于属性

基于属性的面包屑显示某个特定页面的属性。例如,在Newegg,面包〖〗屑显示一个特定的页面上的层级属性:范例

3、基于足迹

基于足迹的面包屑向用户展示他们已经浏览的轨迹,到达一个特定的页面。基于足迹的面包屑是动态的,因为它们显示到达当前页面上的用户已经访问过的网页。

面包屑网页导航设计参考实例和最佳方案...4

这里只是一些使用面包屑导航的好处。

1、方便用户

主要用于面包屑提供给用户浏览一个网站的辅助手段。作为用户寻找路径的一种辅助手段,能方便他们定位方向和导航

2、减少点击或操作,返回到更高级别的网页

而不是使用浏览器的“后退”按钮或网站的主导航返回到一个更高层次的页面,减少用户的点击次数

3、通常不占用屏幕空间

因为他们通常是水平方向和白风格,面包屑不需占用页面上很大的空间。这样做的好处是,他们几乎没有内容过载方面的负面影响。

4.降低跳出率

面包屑导航可以是一个伟大的方式来吸引首次细读后查看登陆页面网站的访问者。例如,假设到达用户通过谷歌搜索页面上,看到一个面包屑的线索可能诱使用户点击到更高级别的页面,以查看相关的利益主题。这反过来,降低了整体的网站跳出率。

38 984341
");