马海祥博客是一个专注于分享SEO优化、网站制作、网络营销和运营思维的自媒体博客!
马海祥博客 > 网站制作 > 网站策划 > 如何在网站策划中做好导航设计

如何在网站策划中做好导航设计

时间:2015-11-14   文章来源:马海祥博客   访问次数:

网站中导航的设计既存在着科学,也蕴涵着艺术,使用者可以用最短的时间从A点到达B点,这是导航的魅力所在,也是它的职责所在。

在一个完整的网站中,导航不单单是链接,可以说导航是一种思维,是一种创建网站的思维,这样的思维让用户清晰可见网站中的信息内容,所有想查找的信息是处于可及范围之内的,并不需要费劲去寻找,是显而易见的。

如何在网站策划中做好导航设计-马海祥博客

网站是通过电脑显示屏显示给我们的,是平面的,所以我们根本看不见网站整体内部结构,如果再没有一个明确的导航,我们在网页中就容易迷失,迷失是一方面,最终会导致该网站无人问津,关门大吉,所以,我们在进行网页设计时,首先要考虑设计一个清晰明了的导航,这样才可以让使用者浏览时畅通无阻,还可以了解到自己想到达的网页目的地有多少步骤,这样也会使浏览者在浏览此网站时有一个很愉快的心情。

1、网站导航设计的意义

网站这样的虚拟世界要想拥有一个完全准确的导航还存在困难,有诸多问题,有时是设计人员大意,把浏览者所在位置尚未标明,这样浏览者很难知道自己所在站点的确切位置,最后晕头转向,只好重进该网站首页,重新进行链接。

还有的干脆就扫兴离开,不再给该网站机会,将它拉入自己的黑名单,再也不点击进入。

还有的设计人员在进行主导航设计时,特点不突出不明显,也不吸引人目光,浏览者面对这样的导航有时想到达哪里都不知所措。

还有的网页,在页面某个位置莫名其妙地就安插返回键,我们却不知道这个返回键要把我们返回到哪里去,让人觉得莫名其妙,甚至会认为是一些小广告而不去点击,这样设计就是没有意义的设计。

2、创建醒目确切的导航

好的网站的导航系统应该醒目且明确,浏览者在浏览网页时是随性的、跳跃的,这样设计人员所设计的网站就得达到让浏览者无论在网站的哪个位置,只要想到达目的地页面,都可以自由跳跃,我们需要在所有的网页页面上都设计一个链接点,最好是只通过一次的跳跃便能达到目的地。

也可以做一个网站的结构图,让浏览者一看便了解了网站的整体面貌及内容,想了解什么内容,可以轻而易举地到达,不会浪费时间(具体可查看马海祥博客《如何规划并架构网站的导航信息结构》的相关介绍)。

当我们到一个陌生的城市,不知身处何处时,都要打听旁人来帮助我们,在网络这个大世界里,也会让人经常不知身处何处,这就需要设计人员设计时应该更加注重人性化设计,告诉浏览者目前的所在,下一步又该去往何处,这就要求导航要醒目并确切。

3、导航具有简洁大方易操作的特点

你所设计的导航应当是容易操作且简洁大方的,设计人员觉得自己设计的网页很成功,但是如果使用者不理解他所设计的意图,也不会操作,那么一切都是白费工夫。

浏览者想看到想要的内容却需要花费很长时间,并且还要点击数次才能到达所要到达的页面,这样的设计是不可取的,这只会消耗尽浏览者的耐性,引起浏览者的厌烦感,以最少的点击却可以得到想要的信息,这是网页设计的一个标准。

如果网页设计的层次越来越复杂,信息被访问的次数也会随之降低,那么想传递给用户的信息也就越难到达,这就要求我们设计人员设计网页时应该把网页的层次设计得简单化,打造可以通过最少的点击次数却可以得到最多的信息量,最好是只需要两次或三次的点击便可以到达内容所在地。

4、导航位置安排合理化

通过导航我们可以随心所欲地到达任何一个页面,是网页设计中视觉要素的重要环节,所以导航的设计一定要一目了然,具有合理化(具体可查看马海祥博客《详解网站的五大导航》的相关介绍)。

一般情况下,导航栏最好是出现在电脑屏幕的第一屏上,因为在进行网页设计的时候,把页面向下拖动是唯一可以让网页内容增加的方法,否则就得跳转到下一个页面,这样我们最好是把导航栏设计在第一屏并且是横向放置,横向摆放比纵向摆放更能方便浏览者。

即使第一屏非常矮,横向的导航也可以全部被看到,但是纵向的导航就不一定了,因为显示器现在宽屏的越来越普及,所以,马海祥觉得浏览者不会受宽度的影响,但是纵向就存在不定性因素,要想让浏览者向下拖动屏幕继续向下浏览,那必须是非常具有吸引力的内容,否则,浏览者拖动页面不会超过三个屏幕。

5、导航模式

常见的导航模式有很多,从显示位置来说分为:顶部水平横栏式,垂直导航栏,侧边固定式,滑出或者弹出窗口导航等,通常网站是根据所要展示的内容要点来选择不同的导航,在此,马海祥也例举几种导航模式进行详细解说。

(1)、当网站内容相对较少时,选择网站水平式的导航相对来说比较方便,能够突出重点内容,且简单清晰,又不至于显得页面太空荡,对于某个大类的信息还可以通过下拉菜单的方式进行展示,归类明确。

(2)、当网站内容相对较多时,一般采用固定式或者抽屉式的导航,这样在用户浏览网站时,导航就想网站目录一样,从最大内容标题细分到各个详细内容页的标题,用户浏览时不管跳转到哪个网页,都可以通过导航目录快速回到目标信息上继续浏览,还可节省网页的位置资源。

(3)、当网站内容在网页显示过长的时,用户习惯用鼠标无限去滚动网站内容,以便更加快速加载下面的内容,这时网站适合采用垂直式的导航,方便用户在浏览内容时导航信息始终保持在一个位置可以被快速找到。

6、导航的设计原则

我们先看看导航的分类:横排导航、竖排导航、多排导航、图片式导航、Frame框架快捷导航、Jump Menu下接菜单导航、隐藏式导航,甚至还可以是动态效果的Flash导航等,有时,大的导航里面还有小的导航,在某些情况下,大导航和小导航需要设计在同一个页面内。

网站导航系统基本遵循以下设计原则:

(1)、尽可能多的提供相关资源的链接。

(2)、一致性原则,导航样式非常多,怎样选用适合网页风格一致的志航条呢?就是要符合页面风格,要符合信息类别分类。

(3)、网站板块和层次划分合理,导航条既是网站路标,又是分类名称,是十分重要的,导航条应放置到明显的页面位置,让浏览者在第一时间内看到它并作出判断,确定要进入哪个栏目中去搜索他们所要的信息。

导航条的设计根据具体情况可以有多种变化,它的设计风格决定了页面设计的风格,反过来,设计师已经大致上有了网页设计的模式,也可以按照模式的方向去把握导航的风格。

7、导航设计按钮应符号化

把导航按钮设计得具有符号化,使得风格更加统一稳定,我们进行符号化设计时也应该与网站的整体环境相匹配,这样使用者在运用过程中也不会出现错误,在进行具体的导航按钮设计时,应该运用大众化的方式,让人一看便明白。

运用符号规范化,便于人们应用起来得心应手,也缩短了到达信息所在地的时间,在进行按钮符号化设计时,我们应遵守以下设计原则:

(1)、符号在隐喻设计上要合理。

(2)、设计图标符号时功能要确切、简单化、简洁化。

(3)、与使用者文化观念上不应该有冲突。

(4)、尺寸大小应该适中等。

遵守这些符号设计规则,设计人员把符号运用到导航按钮设计中去,最终可以提高使用者浏览网页信息内容的速度。

8、导航内容

网站的导航内容是对整个网站想要展示的信息的总结,首先要遵循的是导航栏目标题要与对应的详细页面相符合,才不会导致用户认为信息不一致产生不信任的后果(具体可查看马海祥博客《如何从内容需求的角度策划设计网站导航》的相关介绍)。

当然,标题总结词要精简,注意网站小内容最好不要以导航的总标题形式出现,可通过细分的下拉菜单,或者以更多形式的小菜单栏里出现。

从用户体验度的角度来看:一般情况下,网站导航上的栏目或单页面,是这个网站中最主要的、必不可少的内容,也是站长希望除了首页外,最希望访客点击进入的一些页面,或想要别人了解的一些信息。

从搜索引擎优化的角度来看:网站的主导航位于优化网站中F区的最重要的部位,是搜索引擎蜘蛛检索最看重、权重较高的一个位置,同时在网站的主导航上还布局了产品新闻栏目及各个单页面的导入链接(各个二级栏目间的回流设置),是设置整个网站回流的最核心的部分(具体可查看马海祥博客《网站导航的优化方法和设置技巧》的相关介绍)。

所以,不管是从用户体验度上考虑还是从搜索引擎优化的角度考虑,网站的主导航都是一个网站中必不可缺少的一部分。

9、导航创意

千篇一律的导航形式,用户早已习惯,如果在网站建设时将用户最先注意到的导航加点创意,那么是否能给网站一个画龙点睛的作用呢?

事实是这样的,导航在指引用户搜寻内容时,还能改变用户浏览网站的心情,浏览网站也像一场旅行,有创意的导航栏让用户欣赏起来也会更加愉悦,增加对网站的兴趣,例如,采用别致的图标式导航,情景式导航等(具体可查看马海祥博客《常见的七种响应式导航设计模式的优点和缺点》的相关介绍)。

导航是网站风格的主要组成部分,一个好的导航条可以在确定网页风格的同时,使页面层次清晰,导航制作一直是设计师们需要重点思考的问题,是网页创意的重要体现,现在互联网最流行的导航布局方式有以下几种:

(1)、水平导航条:以水平方式排列导航项,如百度

(2)、垂直导航条:以垂直的方式排列导航项。

(3)、POP导航条和组织有序的导航条。

10、导航设计的细节

大家有没有注意到,很多网站在内容过多时,用户往下滚动内容过长,如果用户想要快速回到导航上面,就会浪费部分时间往上滚动内容,对于缺乏耐心的客户来说,若不是内容确实吸引人,那么他们很有可能就此结束对网站的浏览,所以一般对于这种导航的设置,还要考虑一个细节,通常在内容旁边设置一个“回到顶部”的标志,以便用户快速到达头部的导航位置。

规划一个大型网站,规划好内容是进行导航设计之前的第一要务,而我们此处所说的信息架构,是合理的组织信息的展现形式,支撑起网站内容的骨架,信息架构的主要任务是为信息与用户认知之间构建一座畅通的桥梁。

从更高的位置来看待网站内容有助于信息架构的搭建,更重要的是,你得学会从用户的角度来看待网站内容,这也就意味着,有的时候你得站在正反两个位置来看待同一个东西,不同视角下你会发现有的内容的呈现方式非常反人类,你可以通过下面的问题来完善整个架构:

(1)、哪些页面是这个网站必不可少的?

(2)、从宏观架构上来看是否每个页面都有其独立的目的,它们的存在是否影响整体的连续性和可靠性?

(3)、有哪些内容是需要在将来持续提供并更新的?

(4)、网站所需要涉及到的用户群有哪些?(登录用户、订阅用户、广告商等等)

(5)、针对每种用户,网站所要达成的目标是什么?

思考这些问题能够帮助你更好的完善网站的信息架构,为导航设计做好准备。

综上所述,导航是网站的一项重要组成部分,设计人员一定要重视它在网页设计中所起到的作用,努力设计一个清晰明确的导航。

马海祥博客点评:

综上所述,一个好的导航可以让用户了解目前所处的位置,以及当前页面在整个网站中的位置,它体现了网站的架构层级,能够帮助用户快速学习和了解网站内容和组织方式,从而形成很好的位置感,并且好的导航能够提供返回各个层级的快速入口,提升用户体验。

本文发布于马海祥博客文章,如想转载,请注明原文网址摘自于http://www.mahaixiang.cn/wzch/1350.html,注明出处;否则,禁止转载;谢谢配合!

相关标签搜索: 网站策划   导航设计   网站导航  

上一篇:如何从内容需求的角度策划设计网站导航
下一篇:资深架构师如何看待大型网站系统架构

您可能还会对以下这些文章感兴趣!

  • 基于用户体验的网站可用性策划建议

    关于网站的可用性策划,我想应该是每位站长都首先要考虑的因素了。因为网站的可用性是你这个网站能否受欢迎的一个重要判定方面了,无论你进行的是企 业网站、网购网站还是其它类型的网站,马海祥觉得让你的网站界面变得容易操控,使用时令人舒服是关键,近几年已经有很……【查看全文

    阅读:813关键词: 用户体验   网站可用性   可用性策划   可用性设计   日期:2013-10-11
  • 一个普通网站发展成大型网站的架构演变历程

    大型网站都有复杂的应用,这些应用必须使用数据库,那么在面对大量访问的时候,数据库的瓶颈很快就能显现出来,这时一台数据库将很快无法满足应用,于是我们需要使用数据库集群或者库表散列。在数据库集群方面,很多数据库都有自己的解决方案,Oracle、Sybase等都有很好……【查看全文

    阅读:3236关键词: 普通网站   大型网站   架构演变   演变历程   网站架构   日期:2014-09-14
  • 网盟环境下广告位置的变化对广告关注度的影响

    广告位置是指一则广告在特定媒体发布时所处的规定地位,广告位置直接对广告效果和广告成本发生影响。比如,斯塔奇研究认为,杂志封底广告比杂志内页广告吸引读者数多达65%。同样,在电视广告中,处在广告时段开头的广告和结尾的广告,比居中的广告回忆度要高。另外,广……【查看全文

    阅读:518关键词: 网盟   广告位置   广告位置变化   广告关注度   广告影响   日期:2014-05-11
  • 门户网站导航的信息结构分析

    网站导航是网站中最重要的元素,是网站提供给用户的最直接最方便的访问网站内容的工具,导航的核心目标是设计一个简便快捷的操作入口,帮助用户快速到达网站中的相应内容,设计上应当根据网站类型及内容的需求设计合理的导航信息结构,导航设计不光只是信息结构或组织方……【查看全文

    阅读:793关键词: 门户网站   网站导航   网站信息   网站结构   网站分析   日期:2014-12-18
  • 大型网站系统的升级演变过程

    一个成熟的大型网站的系统架构并不是开始设计就具备完整的高性能、高可用、安全等特性,它总是随着用户量的增加,业务功能的扩展逐渐演变完善的,在这个过程中,开发模式、技术架构、设计思想也发生了很大的变化,就连技术人员也从几个人发展到一个部门甚至一条产品线,……【查看全文

    阅读:470关键词: 大型网站   网站系统   日期:2016-03-28
  • 策划一个具有高质量度移动站点的方法步骤

    如果做个SEOer或站长们近期工作重点排名调查表的话,我估计排名首位的一定是移动站点或手机网站的建设了。移动站点之所以被站长们如此的看重,主要是因为其强大的平板电脑和手机用户群了。据悉在百度推广后台也已经有移动站点质量度的星级评价体系了,页面大小、页面内……【查看全文

    阅读:1746关键词: 移动站点   手机网站   高质量度网站   网站策划   移动站点步骤   日期:2013-09-19
  • 关于网站搜索框功能的策划及设计

    如今,很多网站都有搜索框,这主要是因为搜索功能可以让用户快速查找到自己想看的内容,节省用户的时间。稍微具有一定规模的网站,在网站建设上可能都会考虑加入网站搜索功能,前期网站内容较少,网站搜索功能显示不出威力,但是,随着网站内容越来越多,那么,搜索功能……【查看全文

    阅读:2793关键词: 网站策划   搜索框   网站设计   日期:2017-08-14
  • 网站策划必须要注意的可用性设计

    可用性主要是指使一个功能或者产品易于使用,但同时也要保持产品质量维持在高水平上。在过去十年中高品质的可用性一直是各个行业讨论的核心,因为它对用户来说越来越重要。一般来说,良好的可用性成为那些成功的初创公司的核心。多数情况下,简单的想法最具创造性的,好……【查看全文

    阅读:709关键词: 网站策划   可用性   可用性设计   日期:2013-09-05
  • 如何在网站策划中做好导航设计

    网站中导航的设计既存在着科学,也蕴涵着艺术,使用者可以用最短的时间从A点到达B点,这是导航的魅力所在,也是它的职责所在,导航不单单是链接,可以说导航是一种思维,是一种创建网站的思维,这样的思维让用户清晰可见网站中的信息内容,所有想查找的信息是处于可及范……【查看全文

    阅读:853关键词: 网站策划   导航设计   网站导航   日期:2015-11-14
  • 物理结构(扁平结构和树形结构)与逻辑结构之间的关系区别

    在网站初期的策划建设中,一个好的网站结构也说是网站未来发展成功与否的重要成败点,同时也是我们对网站优化的指导方向。整体来说,网站结构一般分为物理结构和逻辑结构。网站物理结构就是也就是我们网站实际目录,或者说是文件实际的物理地址,指的是网站目录及所包含……【查看全文

    阅读:4243关键词: 物理结构   扁平结构   树形结构   逻辑结构   日期:2013-11-18
↓ 点击查看更多 ↓

互联网更多>>

SEO优化 更多>>

企业网站SEO推广能给企业带来哪些好处? 百度搜索用户建议专区上线公告