2015网页导航设计趋势&案例大搜罗-UI设计 PS-优质IT资源分享社区

admin
管理员
管理员
  • UID1
  • 粉丝29
  • 关注4
  • 发帖数581
  • 社区居民
  • 忠实会员
  • 原创写手
阅读:162回复:0

2015网页导航设计趋势&案例大搜罗

楼主#
更多 发布于:2016-06-11 14:00



2015页面导航规划趋势&事例大网罗
1、全屏导航




当导航是整个页面规划的中心的时分,页面会是怎么的?只需合理地策划联系,全屏导航本来是一种十分有用的技能,用户能够愈加快捷地切换到不一样的页面,内容变成愈加触手可及的东西。
全屏导航式页面能够做的十分明显,也能够以愈加奇妙的方法呈现出来。用户是不是真的非得清楚地意识到它是导航呢?并不一定,假如你规划的够合理,用户会在无意识间充分运用起它的导航功用。
2、底部导航




绝大部分的导航会置于页面的顶部,这也是最常见的方法。顶部的导航契合用户的阅览习气,也契合一般的页面规划的逻辑。
可是置于底部的导航栏更有意思,它的规划不再拘泥于顶部导航规划的规程,它能够规划得更大,在很多单页式页面中这种导航的款式还能够愈加自在多样。
不过这种导航规划最佳是常驻于底部,避免用户迷失,便利定位也易于回到主页。
3、笔直导航菜单




打破常规规划的方法有很多,其中之一即是将导航菜当规划成纵向的。笔直的导航规划并不是简略的将横向变为纵向的就成,你需求联系内容从头考虑整个网站的规划和空间的运用。
最盛行的两种这类排版,一种是运用汉堡菜单的隐藏式的导航菜单,别的一种运用的是固定的侧边栏来承载菜单。
第二种菜单的风趣的当地在于,它为网站规划提供了一种新的视觉规划可能性。一起,这种导航在小屏幕上能够做成悬停隐藏式的,需求的时分点击显现。
4、无导航形式




有些规划较小的网站会挑选运用无导航的轻量级结构来规划网站,这里需求的留意的是,这类网站一般是单页网站。这种规划本来是可行的,尤其是用作预告、预览或许介绍功用的时分。
假如你的网站包括诸多页面,本来并不引荐这种规划,尽管有的网站还真即是这么做的,而且做的不错。Quincy Requin & Associes
的Q&A页面即是这么规划的,每个疑问链接到一个独立的页面。这种功用的共同性使得这种规划显得并不突兀。
5、滑出菜单




滑出式导航菜单已经盛行了一阵子了,这种规划让移动端的页面规划领会愈加优异,当用户翻开页面的时分榜首眼看到的会是首要的内容而非菜单,给用户十分好的榜首印象。耳熟能详的汉堡图标在这种场合下出镜率也十分之高。
当然,这种滑出菜单的规划也能够十分灵敏的运用在大屏幕上,呼应式全屏滑出导航也能够给人愉悦的领会,毕竟很少有桌面页面会享有如此“移动端”的规划福利。
6、巨型菜单




这种大型的导航菜单规划在几年前有短暂的盛行,而且大多运用在具有很多细分内容的公司站点。由于这种导航菜单的规划并不适宜于移动端的显现,因而并未大规划盛行。不过如今规划师开端从头考虑这种巨型菜单在今日运用的可能性。
作为大型零售公司的Target
,现在就选用的这么的规划。这个巨型菜单的完成度极高,两级式的菜单规划,榜首级常驻于页面,第二级菜单占有的空间是固定的,这么一来看起来较为规整。这么的规划会让页面看起来规整而洁净。
7、动画导航元素




动效是这些年的规划重头戏,而它在导航中得到更多的运用也是天然的工作。当动效融入导航规划中的时分,并不需求过于杂乱的展示。
美丽的悬停动效,或许妥当的跳跃作用,都能够用来引导用户。事例中的导航规划也十分交心,导航凭借动效延展变成五颜六色的线条,添加用户点击的面积。动效不只让用户知道他们在哪里,而且以愈加明晰的方法引导他们去点击。
细巧奇妙的动效不只带来不错的视觉加成,而且为用户带来惊喜,鼓舞用户操作,提示用户界面的鸿沟。
8、卡片式导航选项




Pinterest
即是典型,它所运用的卡片式导航简直存在于网站的一切旮旯,明晰直观,简略大气,简直一切用户都能够在这种导航下找到他们想要的东西。
每个卡片能够承载一个特定的品种,也能够包容若干小的分支,这种规划自在而充溢延展性,你能够在这么的网站里边来回点击探索一整天。
google的Material Design的逐渐推行则让这种规划为大众所熟知,而且越来越家喻户晓。
9、无按钮导航




在绝大多数用户对互联网并不了解的期间,拟物化的按钮规划是引导我们点击的主要手法,而跟着网络的大规划遍及和扁平化/现代风的盛行,无按钮的文字导航也具有了越来越大的市场。
无按钮导航和大图布景配合起来十分不错,这个时分无按钮导航规划满足简略,也具有极强的可读性,能够和布景构成鲜明的比照。操控好文字的间距,保证用户有满足的空间阅览和点击。
10、单页翻滚导航




当网站运用单页规划的时分,它的导航即是你的手指和鼠标。只需求你翻下去,内容就会继续不断地到你的眼前。
对于不含有很多内容的网站而言,单页式的导航的作用本来十分不错。这么的网站只需求简略的向下翻滚操作就能够搞定,用户也等待翻滚浏览的成果。不过这么的页面需求给予用户满足的刺激和吸引力,才能鼓舞他们浏览下去,所以请务必将风趣的内容呈现给他们。
福利:5个具有共同导航规划的网站
下面引荐的5个网站在导航规划上十分有特征,最佳翻开网站细心领会它们的共同规划。
Adwyse




尽管规划师选用了规范的汉堡图标菜单,可是当你点开图标的时分,导航会占有全屏,十分不错。
Cave a Bieres




你能在这个网站中找到导航元素么?规划师将导航隐藏在视觉化的故事傍边,十分不错。
Seeing Data




这个网站完全是一个信息的迷宫。你的每一次点击都会为你展示一组数据集,给你不一样的挑选。看起来它和导航毫无关系,可是它真即是个导航。
Ludlow Kingsley




这个网站的导航是隐藏在底部的开端按钮旁边的三角形傍边。这种规划方法挺格外的,鼓舞用户去点击或许翻滚。
Nike LiDyana




这个网站相同凭借导航来讲故事,可是不一样于绝大多数的网站,导航会以愈加共同的方法,将你引导到愈加风趣的当地。
结语
导航的规划多样而风趣,可是导航怎么运用,仍是要联系你的项意图详细特征来决议的。导航存在的意图是引导用户、整理内容、强化流程,假如从用户的视点或许规划的目标从头考虑导航,你会发现导航具有很多可能性。




[font=Tahoma  ]
优质IT资源分享社区为你提供此文。
本站有大量优质UI设计(含PS,软件 网页 平面设计等)教程视频,资料等资源,包含UI设计基础教程,高级进阶教程等等,教程视频资源涵盖传智播客,极客学院,达内,北大青鸟,猎豹网校等等IT职业培训机构的培训教学视频,价值巨大。欢迎点击下方链接查看。

UI设计教程视频
优质IT资源分享社区(www.itziyuan.top)
一个免费,自由,开放,共享,平等,互助的优质IT资源分享网站。
专注免费分享各大IT培训机构最新培训教学视频,为你的IT学习助力!

!!!回帖受限制请看点击这里!!!
!!!资源失效请在此版块发帖说明!!!

[PS:按 CTRL+D收藏本站网址~]

——“优质IT资源分享社区”管理员专用签名~

本版相似帖子

游客