创造性和创新性的导航设计

一个网站应该有它的独特性 - 它是一个反映的是其背后的我的或组织。当人们访问你的网站，你想让它从人群中脱颖而出，使人难忘，能过屡次回访，并使用你的网站或与您取得联系。

因此，您的网站想脱颖而出，不只须要卓越的内容，也应该有创新而实用。问问本身，什么使您的用户更容易的生活吗?可能须要简单的搜索功能，或者导航菜单，可使用一些打理一下。然而，个性的网站须要贯穿始终。如下网站将激起你的食欲超凡的创造力。浏览并探索他们本身。

创意导航设计

导航TOYBOX应始终有须要时，并亲切地消失，当用户想专一于一个特定的任务。例如，在一个网上商店的结账设计，导航应该始终访问，但也为关键的网站功能，如结账形式给予足够的突出。导航TOYBOX作到了这一点。

这感受就像你偷看后面的页面或盖的TOYBOX看看里面有什么。导航是使用方便，旋转效果的导航栏时，他们正在使用它引导用户的关注。隐藏导航还容许一个简单，干净的设计，使用户在观看项目很愉快，由于这两个项目没有注意竞争。

信息你可能会想知道，，好比什么TOYBOX它位于，仍能够被发如今一个不显眼的导航栏在顶部。悬停效果也颇有趣，与其余图像获得推回和淡出的用户集中在一个项目上。

奥利维尔Bossel

奥利维尔Bossel的投资组合，交互设计师，颇有趣。导航元素建立爆炸的像素，当你将鼠标悬停在他们的效果。效果至关动态对比与其余干净的设计。它工做得很好，由于它做为一种视觉元素鼓励用户继续经过网站。一致的视觉语音和语调补充品牌的身份。只要经过浏览网站，用户体验设计师的做品。

TSTO

TSTO，设计机构，有一个简单而非正统的方法来设计，它的导航不一样的是咱们期待什么。导航元素固定在屏幕的每一个角落，划分工做展现。建立了视觉识别与重热粉红色的字母，以及描述信息。层次清楚，可是，“工做”标签的左上角，和“联系人”和“关于”页面底部的标签。在保持的风格，正在展出的做品是在同一个沉重的粉红色字体的标题。

经过点击工做，这像幻灯片呈现时，预览下一个项目，当你将鼠标悬停在箭头。图像很大，占用了大部分的页面。当用户经过点击查看大图像TSTO的身份和工做，他们获得一个清晰的思路。

德里克· 德里克·博阿滕博阿滕的组合用一个礼貌的“你好”欢迎用户在加载时，箭头指示向下滚动。通常的设计是被低估的，它不喊你，而是轻轻地引导您完成工做。正如你从加载页面向下滚动，头和导航缩了回去，让更多的空间组合。这是一个很好的例子，导航，始终是访问的主要内容还给出了中心舞台。

第二个故事

啊，良好醇水平滚动!第二个故事的网站像一本杂志在平板电脑上的应用程序。它具备创新性的，由于它不具备一个典型的Web页面的触感和它水平滚动。的内容被布置在列中，每一个部分垂直滚动。过导航锚定到左边，这有助于创建的节奏。当您查看导航最大限度地减小这种组合，酒吧上空盘旋时，在左边，再次出现。您能够选择在缩略图视图或幻灯片查看投资组合。

正如它的名字代表有严重，有严重嬉闹它有一个元素。迎接你的导航被设计成左右的气球漂浮。友好的动画建立运动，不然静态网站，为品牌定下了基调。虽然你能够回来的主页，在任何阶段，一个微妙的导航栏会出如今页面底部。该网站功能，与飞溅工做室的个性乐趣。其实，它让我想起了时髦的Flash动画的好日子(EYE4U，任何人?)，但由于这个网站应该是有点顽皮，它的工做原理以及在此背景下。

最小的猴子

滚动经过这种大胆的设计简单的文章，让我想起了浏览书架。悬停效果为用户挑出一篇文章的重点。这个网站上也有一个聪明的设计：当您点击一个选项卡上的“关于”和“联系”部分，页面降低到透露的信息。这是一个简单的方式提供信息，而无需重定向到另外一个页面。

然而，观看老的文章也不是那么容易，由于没有搜索功能。若是用户正在寻找一个特定的文章，他们将不得不滚动来查找。搜索功能太多不改变总体的设计将是有益的。

LayerVault

它是惊人的，能够有什么样的影响，一个简单，干净的布局与俏皮的色彩和有趣的动画。LayerVault平衡白色空间和微妙的动画阴谋和从事用户。动画能够用来讲明一个点，引导用户经过一个网站，甚至说明了如何使用。动画并不老是这样的伎俩，，但LayerVault适用应谨慎，只有当用户在浏览页面的特定部分。结果呢?奠基了良好的页面，耐看，有吸引力的插图。

遁飞

遁飞设计巧妙，标志动画页面正在加载新颖和时髦。导航固定在顶部，看起来像一个离港及抵港板的，好像你已经在机场!下拉菜单看起来像一个旅游清单，行之有效的主题。当你点击一个位置，而后向下滚动，全部的重要信息仍然固定在顶部，访问的内容更容易，更温馨，强悍的旅客。

逃生飞行最大化利用使人惊叹的摄影，其空间。这正是你想从一个旅游网站。它可让你的冒险等待着，精美的展现了惊人的目的地有点味道。当你将鼠标悬停在一个目的地，你会发现，正是你须要知道：门票价格，天气情况，飞行时间和行程长度。你还能有什么要求呢?

aSCIIaRENa

调用全部ASCII爱好者!九十年代恶臭aSCIIaRENa。人们能够注册并发布新闻的墙壁上，提交本身的文字艺术，并在墙壁上的名气特点。

照片是Sartorialst本网站上的焦点，并设计支持，绝不费力地。更重要的是，网站使用悬停效果至关优雅;字幕幻灯片从侧面再次滑出，光标以后。

后面的人SilkTricky SilkTricky是打破现状，以及他们的网站并无放下。鼠标在图像上建立一个有趣的效果。页面上的运动创造了一种阴谋活动的用户。在此单页网站，用户没必要点击从页面浏览。只需点击“查看”，所选择的文章折叠的其余文章推卸。这将是一个很好的方式来展现摄影组合，太。

SumAll

SumAll的布局是干净的，没有没必要要的额外的，会分散用户的注意力。悬停在一个简单低调的方式，揭示了更多的信息和转换是一个扩展悬停效果。当你点击一个按钮，简洁的信息和选项出如今下面。我很喜欢，你是否是重定向到另外一个网页，当你点击一个选项，而是整齐的信息出现下面的按钮。一个缺点：导航是没有反应，看着破碎而没法 ​​在较小的意见。

便饭

对不起，这一个如此热心，但聚餐呈现出梦幻般的用户体验。大方的白色空间，能够帮助用户访问他们须要什么，当他们须要的时候。表单和按钮有新鲜和开放的审美，使他们很容易发现和使用。文字和漂亮的图形的方式，引导用户经过网站。按钮和图标很好地协同工做，全部按钮和输入区感受一致，引人入胜。位精心挑选的排版和一个微妙的，干净的用户界面如何从事取悦用户很长的路要走，这是一个很好的例子。

Lowdi

单页响应布局至关精美。Lowdi使用线条和形状来陪衬部分的页面，一个伟大的方式脱离传统的四四方方的布局。我爱“如今订购”按钮注册成立的线条和形状的设计。这些元素调整到你的屏幕，并设计有效地维护流贯穿始终，这使得方便观看。

Barcamp奥马哈

Barcamp奥马哈是一个在线的活动邀请。单页的工具，有效地引导用户经过叙述一致的视觉主题。全部的本质是什么，什么时候何地资讯页面的顶部，但设计敦促用户向下滚动才能看到他们能找到什么。我真的很喜欢Twitter和Facebook图标的巧妙融合。

当用户向下滚动，更多的信息提供系统，和布局保持整齐，简洁，大胆的标题。会议会谈的类别说明用简单的动画，以保持用户从事。一旦你向下滚动建设，并达到地面，正等着你的联系信息，方便。

Combadi

这个网站感到宁静很快，由于它的负载，精心设计的结果。虽然它不会有大量的白色空间，它不以为幽闭恐惧症。标签悬停扩大，提供更多的信息和提升可用性。随着其余元素，这种效应传递一个通风，平静的感受。设计反映了词汇的网站，以及各类元素的共同努力，以实现连贯一致的身份。

沃勒溪水利：最后四

悬停效果应该不只提供更多的信息，并且还有助于网站的视觉吸引力。扩大图像，当你将鼠标悬停在该网站确实是至关漂亮。形象也改变，从灰度的全彩色标题。其效果是至关诱人。

提起

奠基了网站上的产品或项目时，很容易落得静态的目录式视图。电梯的简单的悬停效果旋转显示的3-D版本的书籍。这看似微小和简单的视觉效果，真正使网站更有趣。涉及用户感受，并能够与网站进行交互。你能够作到这一点的3-D效果。

雪鸟

雪鸟是一个动态的网站，涉及用户。显示当前的天气，当你将鼠标悬停在折叠，揭示本周预测。“完整报告”按钮悬停效果是潜移默化的，由于它变换成直角，圆角还没有生效。玩笑是三角形的，看起来像一种雪鸟的翅膀;上空盘旋时，他们得到较大视图展开成一个正方形。

蚀刻

的方形部分牢牢地奠基在这个网站上，但不感到局促。在左上角的导航占用空间小，由于图标用于各类类别。您能够切换导航显示和隐藏在大视图，经过点击菜单图标。响应式设计使得在任何设备上访问的网站很容易，而失去功能或品牌号召力。

 

本文由红蜘蛛网络联盟（www.rswebun.com）编译，原文地址：http://www.smashingmagazine.com/2013/07/11/innovative-navigation-designs/