151-3895-5886

网站导航设计的几个要点

2019年09月19日 维尼网络

导航菜单的重要性已经不言而喻,我们平时遇到的每一个网站或软件中都有它的存在;但并不是所有的导航菜单都设计得准确无误。我们也常发现用户因导航设计不当而感到困惑、难以操作,或者连导航在哪儿都不知道。下面是网站导航设计的几个要点.


1. 导航设计要大气

大屏中的导航菜单不要太小.如果空间足够,不要将菜单隐藏。


2. 导航操作要简单方便

通常用户会希望在浏览过的网站或app中的类似位置(譬如网站顶部、左侧等)中找到他们想要的UI元素。


3. 要有互动感

如果菜单选项看起来不可点击,用户未必能认出它是导航。如果我们的导航设计融入太重的图形、或太过追崇扁平化设计风格,会使它们看起来更像是装饰性图片或标题。


4. 有视觉冲击力

很多导航菜单的周围会留有一点空白区域以从视觉上突显它。但当网站UI元素比较拥挤时,如果导航菜单视觉比重太弱就会在各色图形、促销广告、标题里迷失,不易被用户识别。


5. 导航菜单与背景要对比鲜明

即便是熟悉以上规则的设计师设计出来的导航菜单也有可能会被用户忽视,因为他们很难客观地评价自己的作品——尤其是碰上比较主观的设计标准时,比如哪个UI元素需要拥有更明显的视觉效果。如果你知道你的导航菜单在哪儿,自然能一看看到它,因为这是你设计的。因此,让用户参与验证十分必要。


6. 位置导航

用户成功导航的一个最基本的标准是他自己能发现:“我在哪儿?” 通常被选中的菜单选项在视觉上与其他选项是有差异的,这可以帮助用户明确自己的当前所在位置(或者通过面包屑导航定位)。如果没有让用户明确所在位置、导致他们迷路,那么就犯了网站制作最基本的错误。讽刺的是用户不总是通过首页到达目的页,所以导航菜单对于用户来说意义重大。


7. 链接标签要清楚

清晰用户要找的是什么,使用相似且相关的类别标签。要记住导航菜单并不是拿自造词和行话去忽悠人的。请使用可以准确描述网站内容和特征的术语。


8. 链接标签要易读

减少用户阅读菜单具体内容的时间,如使用左对齐的垂直菜单、或将Keywords前置。


9. 对于二级菜单要易于查找

对于大型网站来说,让用户通过导航菜单预览子级内容。对于喜欢挖掘网站各层级内容的典型用户来说,下拉菜单可以让用户快速浏览、节省时间。


10. 为内容提供本地导航

如果用户喜欢对一些同类商品频繁对比、或在某个场景里完成多个任务,可以将这些临近页面做成本地导航菜单,这样用户就不需要在复杂的路径里“上蹿下跳”了。


11. 传达网站意图

利用视觉的传达力。图像、色彩等元素可以帮助用户理解菜单选项,但也要确保这些图形起的是积极作用(至少不能让操作变得更难)。


12. 菜单选项要够大、方便点击

如果导航菜单的选项过小或者彼此靠得太近,会给移动用户造成很大的困扰;大屏网站中导航菜单选项如果也设计成这样,那就会很难操作。


13. 确保下拉菜单不会太大或太小

鼠标悬停触发的下拉菜单呈现时间太过短暂会给用户带来挫败感,因为用户还没来得及点击菜单里的某个链接的时候,下拉菜单就消失了。另外,太长的垂直导航菜单也不利于底部选项的点击,除非滚动屏幕。最后,鼠标悬停触发的下拉菜单不能太宽,否则会让用户误以为是新页面、并且好奇为什么自己还没点击就出现了新的“页面”?


14. 悬浮吸顶(或固底)菜单的使用

当页面内容很长时,可以考虑悬浮吸顶(或固底)菜单。已浏览到页面底部的用户要想回到首屏需要一次又一次地回滚鼠标(手机端则是不断向上划动屏幕);如果导航可以悬浮吸顶,用户就可以很方便地进行其他菜单选项的切换。这很适合小屏幕场景。


15.缩短导航菜单最常用操作的物理距离

下拉菜单内容比较多时,将用户最常点击的链接放到离鼠标悬停的选项最近的地方可以减少鼠标移动的距离(手机端也类似)。最近一些app中流行的饼状菜单则将所有菜单选项成圆(有的是半圆)状围绕在菜单周围,这样每一个选项链接的物理点击距离都是最短的。

阅读更多内容
上一篇发布的SEO新闻没有被baidu收录的原因
下一篇怎么提升做网站的内容质量

声明:本页内容由郑州维尼网络收集编辑所得,所有资料仅供用户参考,转载请保留此链接http://www.zzwn.cn/website/3543.html

本文标签:

 

相关资讯 Related Info
相关分类 News Classification
解决方案 Solutions
相关热点 Hot spot
为什么建立的公司网站无法实现盈 为什么建立的公司网站无法实现盈
  1. 我们的承诺
  2. 我们的实力
  3. 我们的未来
郑州做网站咨询电话 建站咨询

151-3895-5886

网站备案安全放心网站

地址:郑州市上街区和昌都汇广场 / 电话:151-3895-5886
客服QQ: 7758021 / 邮箱:admin@zzwn.cn
Copyright © 2010-2019 郑州融科网络 版权所有