超实用Web设计中导航与主页的设计原则.pdf

超实用Web设计中导航与主页的设计原则.pdf

《超实用Web设计中导航与主页的设计原则.pdf》由会员分享，可在线阅读，更多相关《超实用Web设计中导航与主页的设计原则.pdf（9页珍藏版）》请在冰豆网上搜索。

厚学网超实用！

Web设计中导航与主页的设计原则在开放性的门户网站中，这类网站中用户流量较大，且用户注意力极容易被分散，这时一个Web页面的瞬间识别性直接关系到用户转化率，也就显得尤为重要。

而对一些比较专业的或指定性的网站，政府网站等，用户面临缺少其他选择，网站缺少替代性的情况，以下原则可能没有前者这么性命攸关，但也同样具有相当的指导意义。

一、导航设计一、导航设计街头指示牌和面包屑街头指示牌和面包屑11、记住一个事实、记住一个事实：

如果在网站上找不到方向，人们会放弃使用你的网站：

如果在网站上找不到方向，人们会放弃使用你的网站（11）网络导航）网络导航101101法则法则人们进入站点时会遵循一个类似的过程：

人们通常是为了寻找某个目标人们会决定先询问还是先浏览如果选择浏览，人们会通过标志的引导在层次结构中穿行最后，如果没找到想要的东西，人们会离开（22）WebWeb与真实世界中的差异与真实世界中的差异感觉不到大小感觉不到方向感觉不到位置厚学网不论我是来闲逛还是来寻找固定内容，我能清晰地知道自己在哪，能去哪（明细分类），以及如何回去（主菜单）。

（33）导航的用途）导航的用途它给了我们一个被固定的感觉它告诉我们当前的位置它告诉我们如何使用网站它给了我们对网站建造者的信心厚学网如今我们逛一些相当成熟的购物网站（比如淘宝）的时候，甚至比在百货商厦中的感觉更清晰。

我能更便捷地找到自己想要的东西。

（商品分类，新品促销，其他功能。

）Web导航的用法基于实际导航用法，但我认为web导航现在已经实现了对现实世界导航的超越。

（可快速跳转，试错成本低）（44）只要跺三次脚，说）只要跺三次脚，说“我要回家我要回家”让一个“返回主页”的按钮始终可见，这一点很重要，用户可以随时（在短时间内）回到主页，可以有效地减少用户迷失方向的焦虑。

（55）提供搜索）提供搜索搜索的设计要注意三点：

慎用花哨的用词：

“快速搜索”“关键词搜索”“精确搜索”等等添加指示说明：

在PlaceHolder中增加对搜索的描述添加选项：

如果存在易混淆的搜索范围，如全站搜索？

部分站点搜索？

整个Web搜索？

请加选项区分。

（66）关于页面名称）关于页面名称标识要大：

足够引人注目在合适的位置：

通常在页面左上，目光焦点较多的地方厚学网每个页面都需要一个名称名称要和点击的链接一致（77）你在这里）你在这里关于关于“面包屑面包屑”面包屑帮你找到来时的路，其实就是级联菜单。

你能清晰的知道自己在哪，如何来的。

也可以快速回去。

（88）喜欢标签（）喜欢标签（TABTAB）的四个理由）的四个理由它们不言而喻：

从来没有第一眼看到会不明白的用户它们很难错过：

当Krug进行“用户点击测试”时，几乎所有人都会试着点击Tab标签它们很灵活：

设计得当能增加修饰作用，更实用它们暗示了一个物理空间：

能帮助你装载大量内容（99）“后备厢测试后备厢测试”想象你被蒙上双眼，所在车子后备厢中，车子开动一段时间后，把你放在网站某个内容的某个页面上，你能迅速的判断出：

这是个什么网站？

（风格主题设计）自己现在在哪？

（网页名称）如何回到主页？

当前我有什么选择？

（本页导航）厚学网网站主要栏目有哪些？

（栏目清单）我怎么进行搜索？

如果可以，说明这个页面设计良好。

这个页面设计还蛮清晰的对不对？

二、首先要承认，主页不由你控制二、首先要承认，主页不由你控制1.1.主页的任务主页的任务站点的标识和使命：

告诉我这是做什么的网站站点层次总览：

网站概貌搜索建立可信度和信任感：

专业优美的设计，是良好印象和继续使用的重要因素内容更新：

展现活跃迹象，不是死水一潭友情链接：

没办法快捷入口注册看到我自己正在寻找的东西：

让我有继续使用的第一动力厚学网还有我没寻找的东西：

以后用得到告诉我从哪开始：

面对一个新网站，无从下手的感觉糟透了导读：

精彩内容的推介2.2.你还要面临的一些不利因素你还要面临的一些不利因素每个人都想占有一席之地：

主页的版面很珍贵，但信息量太多会容易造成堵塞供应不足想要参与的人太多：

产品，设计，市场，CEO，（甚至技术）都想在主页加上一些个人需要（或喜欢）的东西一个尺寸要适合所有人：

主页要呈现在每个访问者面前，不管他们兴趣差别有多大3.3.第一个受害者第一个受害者由于上面的几个不利因素，主页很容易变得非常复杂，这时最重要的事情往往被忘记传达整体形象。

忘记整体形象的五大错误理由：

这本就是显而易见的，我们不需要这么做：

我们自己建立网站时，很清楚自己将提供什么，但是你很难想到别人对此其实并不清楚。

人们见过一次这些说明后，会觉得重复见到很烦人：

很少有人每次看到同样的解释就不再访问这个网站。

真正需要我们网站的人会知道的：

这样很容易让人觉得，那些没有马上明白的人可能不是你的目标受众，从而丢失大量流量那是广告的任务：

就算人们理解你的外部广告，但当他们来到你的网站时，真正留住兴趣的是你的主页。

我们会增加一个“初次访问？

”的连接来专门针对新人：

人们更倾向自己尝试摸索，而不会依赖教程。

这并不能代替他们一眼见到网站的整体形象，而且很多人再试着摸索后就已经糊涂了。

4.4.如何传达整体形象如何传达整体形象口号欢迎广告需要多大空间就使用多大空间厚学网但也不要使用太大空间不要把使命陈述当做欢迎广告最重要的是进行测试5.5.没什么比得上一个好口号没什么比得上一个好口号SloganSlogan好的口号要清楚、言之有物，不好的口号含糊不清好的口号长度适中好的口号能表述出网站的特点和显而易见的好处，不好的口号听起来太笼统好的口号应该有个性、生动，偶尔很俏皮推荐几个不错的Slogan：

（11）阅读）阅读网易新闻：

有态度的新闻门户ONE：

复杂世界里一个就够了简书：

交流故事，沟通想法一席：

听君一席话大眼：

呈现世界精彩（22）出行）出行面包旅行：

与世界分享你的旅行经验蝉游记：

发现旅行之美旅行加：

方便快捷的一站式旅行助手Uber：

你的专属司机Airbnb台湾站：

躺在山海间，睡在人情里（33）财务）财务支付宝：

改变因我而来随手记：

理财第一步挖财：

爱记账会生活（44）购物）购物京东：

多快好省（这才是最直接最长情的告白）手机淘宝：

随时随地，想淘就淘什么值得买：

高性价比产品网购推荐，值得您常来看看厚学网（55）音乐）音乐网易云音乐：

听见好时光！

QQ音乐：

听我想听的歌豆瓣FM：

与喜欢的音乐不期而遇落网：

我们记录独立音乐（66）视频）视频爱奇艺视频：

悦享品质优酷：

世界都在看迅雷看看：

你的随身电影院（77）生活）生活KitchenStories：

anyonecancook下厨房：

唯有美食与爱不可辜负美团外卖：

把世界送到你手中百度外卖：

我们想要给你更多饿了么：

叫外卖，上饿了么百度云：

云上的日子，你我共享any.do：

OrganizeanythingwithAny.do豆瓣：

汇聚一亿人的生活趣味（以上摘自知乎，侵删）6.6.从哪里开始？

从哪里开始？

当进入一个新的网站，快速扫描主页之后，我们应该明白无误地知道：

如果我想搜索，可以从这里开始。

如果我想浏览，可以从这里开始。

如果我想扫描网站最精彩（推荐，特价，有趣）的内容，可以从这里开始。

7.7.下拉框的问题下拉框的问题为了节省空间，设计师常常会想方设法创造一些空间，比如下拉框遗憾的是，他们存在几个问题：

他们难以扫描，你必须把它们找出来：

必须点击下拉框，才能看到下拉列表，然而用户精力尤其宝贵的浏览时间，这无异于自寻死路。

厚学网他们不好控制：

当下拉框伸展开露出一大长串内容时所以他们更多被用在一些用户不得不看的场景，比如注册。

8.8.节约主页节约主页因为主页的内容实在太重要，所有利益相关者都想在主页加上自己的内容（分一杯羹），这样很容易造成过度使用，需要其他方法来缓解这种需求，比如其他热门页面进行推介。