web交互设计原则

最新推荐文章于 2022-01-10 15:49:21 发布

浴盆

最新推荐文章于 2022-01-10 15:49:21 发布

阅读量4.3k

点赞数 1

分类专栏：设计文章标签： web设计设计 javascript

设计专栏收录该内容

1 篇文章 0 订阅

订阅专栏

人们经常问我：如果想确保网站容易使用，最重要的是什么？

别让我思考

这是最重要的原则，如果你只能记住一条可用性原则，那么就记住这条。它意味着，设计者应该尽量做到，当我看一个页面时，它应该是不言而喻，一目了然，自我解释的。
网页上的每项内容都有可能迫使我们停下来，进行不必要的思考。例如，名字。常见的罪魁祸首是那些很酷或者自以为很聪明的名字、带有营销倾向的名字、和具体公司有关的名字以及生僻的技术名词。
另一个不必要的疑惑来源是那些看起来不明显的链接和按钮，作为一个用户，永远不该让我画上几微秒来思考某个东西是否能够点击。
Web设计师和可用性专家们一直在争论，用户在到达目标之前点击多少次不会觉得有挫折感。一些站点甚至规定，到达网站的任何页面需要点击的次数永远不能超过指定的次数。
总的来说，我认为用户不介意有多少点击，只要每次点击都是毫不费力的。

如果做不到让一切不言而喻

你的目标应该是让每一个页面都不言而喻，不过有时候，在你进行一些崭新的，开拓性的或咨询和非常复杂的页面设计时，也许只能做到自我解释(self-explanation)。在一个自我解释的页面中，用户需要花一点点时间去理解。页面元素的外观、精心选择的名称、页面布局以及少量仔细斟酌过的文字，他们综合在一起将创造出一种接近瞬间的识别效果。

我们实际上是如何使用web的

当我们创建网站时，我们会认为用户会盯着每一个网页，仔细阅读我们精心制作的文字。而在大部分时间里，他们实际做的是在每个页面上扫一眼，点击第一个令他们感兴趣的或者大概符合他们寻找目标的链接。通常，页面上的很多部分他们看都不看。那么为什么用户会使用扫描的方式，有以下几个原因：

我们总是处于忙碌中，大部分时间我们使用web是想节约时间。
我们知道自己不必阅读所有内容
我们善于扫描，在日常生活中，我们一直在扫描报纸、杂志、书籍来找到我们感兴趣的部分。

在设计页面时，我们通常假设用户只是扫过整个页面，考虑所有可能的选项，然后选择一个最好的。然而事实上大多数时间用戶不会选择最佳选项，而是选择第一个合理的选项。当然，这是在假定页面载入速度很快的情况下，如果页面载入速度比较慢，用戶将会更加谨慎地进行选择。对于用户来说，是否明白事物背后的工作机制并不重要，只要我们能正确使用它们即可。如果发现某个事物能用，那么用户会一直用它。

扫描设计

如果用户们都是疾驰而过，那么你需要注意以下几个方面

在每个页面上建立清楚的视觉层次。一个视觉层次清楚的页面有三个特点：越重要的部分越突出。逻辑上相关的部分在视觉上也相关(例如可以把相近的内容分在一组，放在一个标题下，采用类似的显示样式等)。逻辑上包含的部分在视觉上进行嵌套(例如，一个分类的标题Computer Books，出现在某本具体书籍书名的上面，在视觉上包括书籍区域，而且书籍的标题也要横向覆盖描述这本书的元素)。
习惯用法是你的好帮手。然而和使用习惯用法相比，设计师都面临着很大的诱惑，想要重新发明轮子很大程度上是因为他们觉得网站是请他们来做一些崭新的与众不同的设计。如果不打算使用一种已有的web习惯用法，你必须确认你在使用一种同样清楚，同样不言而喻，没有学习曲线的方法。或者新的设计会带来很大的价值，因此值得用户付出一点努力来学习。
明显标识可以点击的地方。
降低视觉噪声。实际上有两种视觉噪声，一种是眼花缭乱。另一种是背景噪声。

省略不必要的文字

有力的文字都很简练，句子里不应该有多余的文字，同样，画上不应该有多余的线条，机器上不应该有多余的零件。
去掉没有人看的文字有几个好处：可以降低页面的噪声；让有用的内容更突出；让页面更简短，让用户在每个页面上一样就能看见更多的内容，而不用滚动屏幕。

街头指示牌和面包屑

记住下面的事实：
如果在网站上找不到方向，人们不会使用你的网站。
从你自己作为Web用户的体会就可以知道这一点，如果到了一个网站，却找不到你需要的内容，或者不知道这个网站是怎么组织的，你不太可能在那里待很长时间。
举一个例子。当你要去买一把锯子。你会先走到工具区，然后开始查看每个走到尽头的指示标志。到了你认为正确的走道后，你开始查看具体的产品。如果你发现自己猜错了，你会看看另一个走道。基本上，你是依赖上场的导航系统来寻找商品。
当你进入站点也遵循同样的过程，你会决定先询问还是先浏览。区别是，网站上没有一个真人来告诉你东西在哪，在Web上等价的服务是搜索，然后得到一堆链接，指向目标可能所处的地方。如果选择浏览，用户将通过标志的引导在层次结构中穿行。最后，如果找不到想要的东西，用户会离开。
如果我们想再次访问网站上的某个内容，是通过记住它在概念层次上的位置，然后重新顺着以往的链接过去。这就是书签如此重要的原因，也是为什么后退按钮的点击率占据网络上所有点击率的30%~40%的原因。这也解释了为什么主页的概念如此重要，相对来说，主页就是固定的空间，在一个网站上主页就像北极星，可以点击主页给用户一个重新开始的机会。
我们使用Web导航是因为得知你当前的位置在Web中比在物理空间上要重要得多。把Web导航放在标准的位置可以让我们快速定位、不必费力。仅仅让导航在每一页以一致的外观出现在同样的位置，会让你确认自己仍然待在这个网站上。
面包屑导航之所以被称为面包屑，是因为它们让人想起Hansel扔在森林里的面包屑踪迹，因为这样他和Gretel能找到回家的路。它想尽办法给用户一种感觉，那就是他们处在一个大的导航机制中。

主页

主页要完成的任务：

站点的标识和使用。主页要告诉我这是什么网站，它是做什么的。
站点层次。主页要给出网站提供服务的概貌：既要包括内容(我能在这里找到什么)，也要包括功能(“我能做什么”)
搜索。大多数网站需要在主页上设置一个显示突出的搜索框。
内容更新。
友情链接。
注册。

主页上的每一样东西都有助于我们理解网站是做什么，在页面上有两个重要的位置。

口号(Tagline)。最有价值的位置之一是靠近站点ID的地方，当我们看到一个和站点ID相关联的短语时，就知道这是口号，然后我们会把它当作整个网站的描述。口号是一条精炼的语句，刻画了整个企业。
欢迎广告。欢迎广告是网站的简要描述，在主页的首要位置显示，不需要滚动屏幕就能看到。

由于主页的位置实在有限，设计师常常会想方设法创造出一些空间，最常见的方法就是使用下拉框。遗憾的是，它们存在几个问题：

你必须点击下拉框，才能看到下拉列表。
它们不好控制。从某种程度上说，列表的显示和收缩很快，因此会影响查看效果。

下拉框对于组织按字母顺序排列的项目来说最有效，但当我不知道自己在找什么名称的时候，下拉框的效率就很低了。

测试

测试会提醒你，不是每个人和你用同样的方法使用网站。测试一个用户比不做测试好一倍。测试总是会有效果，哪怕对错误的用户做一次糟糕的测试，也会让你看到一些改善网站的重要方面。在项目中，早点测试一位用户好过最后测试50位用户。大多数人觉得用户测试很复杂，但如果把它设计得复杂，就不会尽早测试。在你有机会用上你的测试所得的时候，总是比以后进行一次复杂的测试更有价值。测试的关键不是要证明什么或者反驳什么，而是了解你的判断力，测试能做的就是给你提供有价值的参考。