微信号:grzlwx

介绍:光荣之路官方资讯

IT人必看书籍:Don't make me think 摘录与读后感

2015-10-24 23:17 AmilyAmi


吴老的《selenium webdriver 实战宝典》出版了!

你喜欢这篇文章吗?请滑到楼底吐槽!

测试人员也应该了解的设计原则。

别让我思考

——Krug可用性第一定律


点击多少次都没关系,只要每次点击都是无需思考,明确无误的选择

——Krug可用性第二定律


去掉每个页面上一般的文字,然后把剩下的文字再去掉一半

——Krug可用性第三定律


2.1 第一个事实, 我们不是阅读而是扫描

2.2 我们不做最佳选择 而是满意即可

用户会选择第一个合理的选项,这就是满意策略,一旦我们发现一个链接,看起来似乎能跳转到我们想去的地方,那就是我们将会点击它的大好机会。寻找最佳策略很难,需要的时间也很长,满意策略效率更高。

2.3 我们不是追根究底,而是勉强应付

3 广告牌设计101法则,为扫描设计,不为阅读设计

需要注意以下5个重要方面,来保证他们尽可能的看到并理解了你的网站

3.1 在每个页面上建立清楚的视觉层次

3.2 尽量利用习惯用法

3.3 把页面划分成明确定义的区域

3.4 明显标识可以点击的地方

3.5 最大限度降低干扰,降低视觉噪声

4 动物、植物、无机物 (为什么用户喜欢无需思考的选择)

三次无需思考、明确无误的点击相当于一次需要思考的点击

5 省略不必要的文字

有力的文字都很简练,句子里不应该有多余的文字,段落中不应该有多余的句子。同样,画上不应该有多余的线条,机器上不应该有多余的零件。

多数页面上的大部分文字都不过是在占地方,因为没有人打算阅读他们。但是因为他们确实在那儿,所以这些多余的文字都在暗示你可能真的需要阅读它们来理解到底是怎么回事,这样常常使得页面看起来难度更高了。

去掉没有人会用到的文字的几个好处:

1 可以降低页面的噪声;

2 让有用的内容更加突出;

3 让页面更简短,让用户在每个页面上一眼就能看见更多的内容,而不必滚动屏幕。

实际上我说的文字是两种特别的文字:欢迎词和指示说明

你可以——而且应该——尽量减少欢迎词,能减多少就减多少。

如果指示说明非常冗长,用户发现他们所需信息的机会也就会很小。

你的目标应该是通过让每项内容不言而喻来完全消除指示说明,或者尽可能做到这一点,当指示文字变得完全没有必要时。则应把它们全部去掉。

必须正确处理的几个方面

街头指示牌和面包屑 设计导航

如果在网站上找不到方向,人们不会使用你的网站。

对应于网站的搜索和导航

如果我们想要再次访问网站上的某个内容,不是依靠他在那里的物理感觉,而是记住他在概念层次上的位置,然后重新顺着以往的连接过去,这就是书签——存储的个人捷径——如此重要的原因,也就是为什么后退按钮的点击率占据网络上所有的点击率的30%-40%的原因。

持久导航上只能放置4-5个实用工具——用户用得最多的那几个工具

持久导航中最重要的元素之一就是把我们送回主页的按钮或链接,让一个返回主页(Home)的按钮始终可见,它或者是一个按钮或者是一个图片。

提供搜索喜欢搜索的用户比喜欢浏览的用户更多,它应该是一个搜索框,大多数用户登录一个新站点后,第一件事就 是扫描页面,看有没有搜索框,记住一个简单的公式,一个输入框,一个按钮,还有‘Search’(搜索)两个字,不要弄得太复杂——坚持这个公式,特别是 要避免——花哨的用词,只是说明,选项,如果你使用搜索作为输入框的名称,那么应该使用“Go”作为按钮名称。

页面名称就是Web上的路牌,和路牌一样,如果一切顺利,我可能根本不会注意页面名称,但我觉得自己可能方向不 对时,就需要毫不费劲的看到页面名称来确定方向,所以1 每一个页面都需要有一个名称,2并且页面名称要出现在合适的位置,3名称要引人注目,4名称要和 点击的链接一致;在web上突出我的当前位置;

面包屑菜单(层级菜单)也告诉你你的当前位置——它们之所以被称作‘面包屑’是因为她们让人想起Hansel扔在森林里的面包屑踪迹,因为这样他和Cretel能找到回家的路。用于真正有庞大数据库且具有复杂层次结构的网站。例如雅虎的网站目录。

据我所知,About.com的面包屑做的是最完美的,它体现了几项最佳实践

1把它们放在最顶端(页面的最最顶端,不跟导航争宠)

2使用'>'对层级进行分割。各种尝试似乎都已经确认,大于号是最好的分隔符

3使用小字体

4使用文字:你在这里

5将最后一个元素加粗

6没有把他们用作页面的名称

标签是大型网站导航的上佳选择,因为

1 它们不言而喻

2 它们很难被错过( 我在进行‘用户点击测试’时非常吃惊地发现,你们想不到人们对网页顶部的按钮条视而不见的情况有多严重,但标签在视觉上是如此的与众不同,他们很难被忽略。

3 它们很灵活(标签样式可以变得很漂亮)

4它们暗示了一个物理的空间

标签做得很好的是Amazon,它做到了一下3点:

1 正确绘制,选中的标签应显示在未选中的之前,不是标签的不要用标签的形状

2 颜色编码,使色盲也能看得懂(使用同一色系的深浅色)

3 当你进入网站时,一个标签已经选中

后备箱测试

现在你已经对所有导航部分有所了解,可以进行以下的网络导航测试了,下面就是这个测试。想想你被蒙上双眼,锁在车子的后备箱里,车开动一会儿以后,把你放在某个网站内容的某个网页上。如果这个页面设计良好,当你除去眼罩时,应该能毫不犹豫地回答出一下问题:

1 这是什么网站?(站点ID)

2 我在那个网页上?(网页名称)

3 这个网站的主要栏目有哪些?(栏目清单)

4 在这个层次上我有哪些选择?(本页导航)

5 我在导航系统的什么位置?(‘你在这里’的指示器)

6 我怎么搜索?(搜索框)

(未完待续)

(作者:AmilyAmily 来源:http://www.cnblogs.com/AmilyWilly/p/4877431.html)


 
            
 
            
 
            
 
           
 
           
 
           
 
           
 
           
 
           
 
           
 
           
 
           
 
           

感谢作者,传播测试知识、技能与正能量!
分享测试生活,思考测试人生!欢迎来稿735821166@qq.com

光荣之路软件测试培训

官网:http://www.gloryroad.cn/

微信公众号:gloryroadtrain

性能测试QQ群:415987441
软件测试招聘QQ群: 203715128
自动化3群QQ: 371211499

 
光荣之路 更多文章 今天晚上的 linux 公开课- Awk 编程 7月28日(今天)晚上的 linux 公开课- shell编程 8月4日(今天)晚上的 linux 公开课- shell编程 9月1日(本周一)晚8点半,光荣之路Web自动化系列基础课—javascript第二讲 推荐本好书《与机器赛跑》
猜您喜欢 程序员面试什么最重要? 从优化性能到应对峰值流量:微博缓存服务化的设计与实践 携程Android App插件化和动态加载实践 我从腾讯那“偷 了”3000万QQ用户数据,出了份很有趣的独家报告! Win10上运行Docker