《点石成金：dont make me think》由会员分享，可在线阅读，更多相关《点石成金：dont make me think（84页珍藏版）》请在金锄头文库上搜索。
1、,Dont make me think读后分享,点石成金:访客至上的网页设计秘笈,作者：（美）Steve Krug,如何让你的网站焕然一新,用户模式,为浏览而 设计,主页布局,可用性 测试,导航设计,内容模块,为浏览而 设计,主页布局,可用性 测试,导航设计,用户模式,如果想确保网站容易使用，最重要的是什么？,Krug可用性第一定律,一个网页应是不言而喻，一目了然，自我解释的。,我能明白它是什么？怎样使用它？不需要花费精力进行思考。,Dont make me think！,终极法则,噢(o)，这是,对比图片,VS,No thinking VS Thinking,Things that make
2、 us think,1.事物的名称,2.不太明显的链接和按钮,我在哪里？,我应该从哪里开始？,最重要的是什么？,它放在哪里？,这是什么玩意？,。,Things that make us think,。,3.其它,失去信心,How do we really use the Web?,How do we really use the Web?,Fact of Life #1,设计师们设计的,我们看到的,我要买票。,怎样核对我 的累计航空 里程？,How do we really use the Web?,满意 策略,大多数时间里我们不会选择最佳选项，而是选择第一个合理的选项。,Fact of Li
3、fe #2,为什么web用户不寻找最佳选择呢？,猜测更有意思。,Fact of Life #2,理由,How do we really use the Web?,这对我们来说并不重要。,如果发现某物能用，我们会一直用它。,Fact of Life #3,原因,导航设计,用户模式,为浏览而 设计,主页布局,可用性 测试,5.最大限度的降低干扰。,Designing pages for scanning, not reading,5,1.建立清楚的视觉层次。,2.尽量的利用习惯用法。,3.页面划分成明确定义的区域。,4.明显标识可以点击的地方。,5.最大限度的降低干扰。,Designing pag
4、es for scanning, not reading,5,1.建立清楚的视觉层次。,2.尽量的利用习惯用法。,3.页面划分成明确定义的区域。,4.明显标识可以点击的地方。,越重要的越突出,逻辑上相关的部分 在视觉上也相关,逻辑上包含的部分 在视觉上进行嵌套,Three Traits,5.最大限度的降低干扰。,Designing pages for scanning, not reading,5,1.建立清楚的视觉层次。,2.尽量的利用习惯用法。,3.页面划分成明确定义的区域。,4.明显标识可以点击的地方。,Conventions,Whats this ？,1.它们非常有用,2.设计师通常不
5、愿意利用它们,Two Important,5.最大限度的降低干扰。,Designing pages for scanning, not reading,5,1.建立清楚的视觉层次。,2.尽量的利用习惯用法。,3.页面划分成明确定义的区域。,4.明显标识可以点击的地方。,Clearly Defined Areas,娱乐,动漫,课堂,5.最大限度的降低干扰。,Designing pages for scanning, not reading,5,1.建立清楚的视觉层次。,2.尽量的利用习惯用法。,3.页面划分成明确定义的区域。,4.明显标识可以点击的地方。,Make it Obvious,5.最大
6、限度的降低干扰。,Designing pages for scanning, not reading,5,1.建立清楚的视觉层次。,2.尽量的利用习惯用法。,3.页面划分成明确定义的区域。,4.明显标识可以点击的地方。,Keep the Noise Down,1.眼花缭乱,2.背景噪声,Keep the Noise Down,五次！ 最多五次！,三次！ 最多三次！,用户点击多少次到达目标才不会有挫折感？,点击次数并不重要，只要每次点击都是无需思考，明确无误的选择。,经验准则： 三次无需思考，明确无误的点击相当于一次需要思考的点击。,Krug 可用性第二定律,Home,Office,Krug 可
7、用性第二定律,需贴邮票,免贴邮票,？,Krug 可用性第二定律,去掉页面上一半的文字， 然后把剩下的文字再去掉一半。,Krug 可用性第三定律,Beneficial Effects,1.可以降低页面的噪声,2.让有用的内容更加突出,3.让页面更简洁，让用户一眼就能看见更多内容，而不必滚动屏幕。,conclusion,来点不一样的！,用户模式,为浏览而 设计,主页布局,可用性 测试,导航设计,网站浏览过程图,用途,1.它帮助我们找到想要的任何东西,2.它告诉现在身在何处,3.它给了我们一些固定的感觉,4.它告诉我们当前的位置,5.它告诉我们如何使用网站,6.它给了我们对网站建造者的信心,Desi
8、gning navigation,站点ID,栏目,出现在可视化层次的首要位置,Designing navigation,也称主导航条。是到达主要栏目的链接。,Designing navigation,实用工具,是到达网站不属于内容层次的重要元素的链接。,搜索的方式,记住一个简单的公式,Designing navigation,Designing navigation,回主页的方式,1.在栏目或实用工具清单中包含一个回到主页的链接,2.在主页外地站点ID上小心地加上“主页”字样， 让大家知道可以点击它。,面包屑,1.把它们放在最顶端,2.使用“”对层级进行分隔,3.使用小字体,4.使用了文字你在
9、这里,5.将最后一个元素加粗,Designing navigation,最佳实践,假定把您眼睛蒙住，塞到汽车后备箱里，然后 开车开一段时间，再把您扔到网站中的某个页 面。如果页面的设计合理，当去掉您的遮眼布 时，您应该能很容易地回答以下问题：,Test,。这是个什么网站？ 。我在哪个页面？ 。这个网站都有哪些主要栏目？ 。在这个层次上都有哪些选项？ 。我在整个网站中处于哪里？ 。我怎么进行搜索？,绑架？,执行过程,Test,5.最大限度的降低干扰。,Designing pages for scanning, not reading,5,1.建立清楚的视觉层次。,2.尽量的利用习惯用法。,3.页
10、面划分成明确定义的区域。,4.明显标识可以点击的地方。,可用性 测试,用户模式,为浏览而 设计,主页布局,导航设计,任务,站点的标识（zhi）和使命,站点层次,导读,内容更新,友情链接,快捷方式,注册,让我看到自己正在寻找的东西,还有我没有寻找的,告诉我从哪里开始,建立可信度和信任感,Designing home page,传达整体形象,图片,整体形象,Four Questions,如何传达？,1.需要多大的空间就是用多大的空间,2.但也不要使用过多的空间,3.不要把使命陈述当做欢迎广告,4.最重要的是进行测试,Designing home page,没有什么比得上一个好口号,考虑,1.好的口
11、号要清楚、言之有物,2.不好的口号含混不清,3.好的口号长度适中,4.好的口号能表述出网站的特点和显而易见的好处,5.不好的口号听起来太笼统,6.好的口号有个性、生动，有时候还很俏皮,Designing home page,从哪里开始？,当进入一个新的网站，快速扫描主页之后，我应该能明白无误地知道：,如果我想搜索，可以从这里开始 如果我想扫描，可以从这里开始 入股我想扫描该网站最精彩的内容，可以从这里开始,Designing home page,1.在没必要时，放个横幅广告条。,2.推销所有的东西。,3.让广告驱动了首页的设计。,4.过于贪心得到用户信息。,Bad Idea,4,下拉框的问题,
12、你必须把它们找出来,它们难以扫描,它们不好控制,Bad Idea,用户模式,为浏览而 设计,主页布局,可用性 测试,导航设计,争论！,一次一个用户展示一些内容， 并且要求用户说出 1）这时什么； 2）试着用它来完成一项典型的任务。,适合用来了解你的网站运行情况，以及怎样改进网站。,告诉你人们是否确实能使用你的网站。,Usability testing,流程,优势,关于测试的几个事实,如果想建立一个优秀的网站，一定要测试。,测试一个用户比不做测试好一倍。,在项目中，早点测试以为用户好过最后测试50为用户。,不需要非要雇佣“具有代表性的用户”。,测试的关键不是证明什么或者反驳什么，而是了解你的判断
13、力。,测试是一个循环的过程。,没有什么比现场用户的反应更重要。,Usability testing,跳楼大减价的简易可用性测试,Usability testing,一个测试过程实例,Usability testing,常见问题,1.用户不清楚概念,2.他们找不到踪迹要找的字眼,3.内容太多了,1）你用来组织内容的分类不符合 用户的习惯 2）分类符合他们的习惯，单没有 使用他们期望的名字,1）减少页面上的整体干扰 2）把他们需要看到的内容设置的更加醒目，让她 们从可视化层次中更加突出,Usability testing,分类指南,1.忽略Kayak（皮划艇）问题,2.抵制添加的冲动,3.不要太看重人们对心功能的要求,4.抓住够得着的果子,1.恍然大悟型,2.便宜型,Usability testing,谢谢您的 聆听！,谢谢观看！ 2020,
