首页

导航设计趋势!关于图标式导航的改进

蓝蓝

不知不觉的,很多网页设计中采用了图标式导航(Navigation)——一般使用三道杠作为图标,用以导航界面设计
这种导航的好处是节省空间,让界面更简洁。

图标式导航的案例

这是YouTube的图标式导航(移动版):

为导航瘦身!关于图标式导航的改进

拥有创意导航设计的网站

蓝蓝

导航在网站设计中地位是举足轻重的,它引导着用户进行浏览和查找,一个良好的导航系统能让用户在离开网站时感觉享受了一次愉快的旅程。今天为蓝蓝设计收集了许多创意导航界面设计,我们一起来感受一下它们的魅力吧!Webvisionary Awards

navmenus09

TEDxPortland

革命性的创新网页导航设计

蓝蓝

为了让你的网站脱颖而出,不仅需要有丰富的高质量内容,同时也要兼顾网站设计的创新性和功能性。从用户的角度出发好好想一下,怎样让你的网站用户体验更友好?简单的搜索功能是需要的,或者你也可以精心设计一下网站的导航。同时,要注意保持整个网站界面设计语言的一致性。在这个html5狂潮涌进的时代,诞生了很多优秀的页设计作品,他们都有卓越的导航设计,接下来整理的这些网站将唤起你关于导航的极限创意,快来亲自体验下吧!

Toybox

在需要的时候导航栏应该一直在那里,而当用户想要专注于某个特定的任务时,导航栏则应该优雅的隐藏起来。比如说,在设计一个网上商店的出纳页面时,网站的导航应该可以随时都易于使用,但同时也要注意突出像出纳表单和按钮控件之类的鲜明功能。Toybox的导航设计就恰好满足了这些。

如下图示,这个侧边导航给人的感觉就像是你在窥视页面背后或者是掀开了一个玩具盒的盖子看看里面到底有些什么。这个侧边导航非常方便使用,鼠标悬停在浏览器左侧即可出现,主体部分即时出现的旋转效果也很带感,可以很好的引导用户的注意力。将导航隐藏起来同时也实现了界面的简洁,使网站的浏览体验非常的愉悦,因为网站并没有留下太多无用的信息去分散用户的注意力。

Toybox

华丽丽的导航设计PSD下载

蓝蓝

在2014年涌现了许多有视觉吸引和创造性的导航界面设计,她们不仅身段妙曼富有美感,而且传承了整个网站设计的导航指引,让浏览者轻松愉悦的访问网站。她们会温馨的提醒你在哪儿,还会体贴的带你获取到想要的东西。别等了,现在就去寻找你喜欢的导航下载它吧。下面请欣赏蓝蓝设计精心收集的华丽丽的导航设计PSD,希望对朋友们的ui设计能力有所帮助!

Simple Navigation Menu

时尚创新的侧边栏菜单网页设计

蓝蓝

信不信由你,侧边栏菜单将会是2014的一个新趋势!实际上,菜单已经有相当长的一个历史,最开始它只被用在计算机应用程序上,后来逐渐流行到社交媒体网站设计。现在很多单页界面设计的网站菜单都非常精美而便利。那么请欣赏一下蓝蓝设计收集到时尚创新的侧边栏菜单网页设计

Wanda Print

网站设计导航也采用了双重菜单,而且篇幅很广。菜单如此宽广,排版如此简洁,加上导航和背景产生的强烈对比,使得整个网站显得非常微妙而自由。

6

10个精致的导航菜单欣赏及点评

蓝蓝

这些导航菜单来自于Dribbble网站,出自于世界各地的优秀设计师之手,涵盖了各种不同的风格,个个都非常精美。这里我将这些导航菜单展示出来,依据自己的想法总结它们的可取之处,演示其中一些用得上的技术方法。这样比起简单粗略的看过就忘,更能在网页设计上让我们获取很多的灵感,提高我们的设计水平。

一、木质页面上的抽屉创意

不看这个案例话,你能想到将木质页面上的导航菜单做成类似这样抽屉式的样式吗?我自己反正是没想到,这就是值得学习的创意。我们不要一做导航菜单就想也不想的画一个直角或者圆角的矩形背景,将文字放在上面,用竖线隔开文字。这就落入了程式化的束缚之中了。

值得学习研究!纯CSS3编写的面包屑导航收集

蓝蓝

蓝蓝设计 :随着Web技术越来越先进,浏览器更新换代也很快,在国内很多网站已经有使用css3和html5的技术了,所以我们也应该多学习这些新知识,设计达人网站整理的资料,你在学校、图书上也是未必能看到的。

今天我们整理了10个纯CSS3制作的面包屑导航,这些都是通过CSS3来编写,十分方便,而且实用。有些文章附有教程,大家可以学习研究一下。

漂亮面包屑导航

css3-breadcrumb-1

扁平化面包屑导航

拥有创意导航设计的网站

蓝蓝

导航在网站设计中地位是举足轻重的,它引导着用户进行浏览和查找,一个良好的导航系统能让用户在离开网站时感觉享受了一次愉快的旅程。今天为您推荐24枚创意导航设计,我们一起来感受一下它们的魅力吧!

Beautiful Type

navmenus18

Drupalcon Denver

navmenus01

华丽丽的导航设计PSD下载

蓝蓝

在2012年涌现了许多有视觉吸引和创造性的导航,她们不仅身段妙曼富有美感,而且传承了整个网站的导航指引,让浏览者轻松愉悦的访问网站。她们会温馨的提醒你在哪儿,还会体贴的带你获取到想要的东西。别等了,现在就去寻找你喜欢的导航下载它吧。

 

Elegant Ribbon Menu

3d block menu bar

网页新趋势:革命性的创新网页导航设计

蓝蓝

每个网站有属于自己的个性——它能反射出背后的个人或者团队。如何做到让自己的网站显得与众不同、卓尔不群,让用户流连忘返或者立马下单?

为了让你的网站脱颖而出,不仅需要有丰富的高质量内容,同时也要兼顾网站的创新性和功能性。从用户的角度出发好好想一下,怎样让你的网站用户体验更友好?简单的搜索功能是需要的,或者你也可以精心设计一下网站的导航。同时,要注意保持整个网站设计语言的一致性。在这个html5狂潮涌进的时代,诞生了很多优秀的网页设计作品,他们都有卓越的导航设计,接下来整理的这些网站将唤起你关于导航的极限创意,快来亲自体验下吧!

Toybox

在需要的时候导航栏应该一直在那里,而当用户想要专注于某个特定的任务时,导航栏则应该优雅的隐藏起来。比如说,在设计一个网上商店的出纳页面时,网站的导航应该可以随时都易于使用,但同时也要注意突出像出纳表单和按钮控件之类的鲜明功能。Toybox的导航设计就恰好满足了这些。

如下图示,这个侧边导航给人的感觉就像是你在窥视页面背后或者是掀开了一个玩具盒的盖子看看里面到底有些什么。这个侧边导航非常方便使用,鼠标悬停在浏览器左侧即可出现,主体部分即时出现的旋转效果也很带感,可以很好的引导用户的注意力。将导航隐藏起来同时也实现了界面的简洁,使网站的浏览体验非常的愉悦,因为网站并没有留下太多无用的信息去分散用户的注意力。

Toybox

至于其他你想知道的信息,比如说Toybox公司的主营业务和地址,可以在顶部的一个直接呈现的导航栏里找到。首页的磁贴鼠标hover效果也非常的有趣,当鼠标悬停于某个项目的缩略图时,其余的项目缩略图都后退变暗并且产生景深的效果。

Olivier Bossel

交互设计师Olivier Bossel的个人作品博客非常有趣。该网站的导航元素在鼠标hover状态下会产生像素爆炸式的效果(译者注:火狐浏览器测试通过,chrome测试无效果)。这个效果相对于网站其余的简洁设计来说非常有动感,由此产生强烈的对比效果。作为一个视觉元素它非常有效的促进了用户继续阅读该网站,统一的视觉语言也彰显了品牌的特点。

Olivier Bossel

日历

链接

blogger

蓝蓝 http://www.lanlanwork.com

存档