• 日常搜索
  • 端口查询
  • IP查询
  • 在线工具
  • 搜本站

网站设计提升用户体验的14条黄金法则

当你坐下来设计一个网站时,你是为谁做的?虽然向您付款的公司或个人最终设定了项目的目标,但您最关心的是最终用户。这就是为什么用户反馈和测试是设计用户体验 (UX) 的关键部分。

用户体验法则是什么?

用户体验法则不仅仅是网页设计最佳实践的集合。每条用户体验法则都基于基本的人性。 如果您了解人们对某些视觉效果的本能反应,您就可以创建更美观、更直观的界面。这就是这些用户体验法律和原则的全部内容。

  1. 费特定律

  2. 希克定律

  3. 米勒定律

  4. 雅各布定律

  5. 审美-可用性效应

  6. 奥卡姆剃刀

  7. 帕累托法则

  8. 波斯特尔定律

  9. 目标梯度效应

  10. 多尔蒂阈值

  11. 串行位置效应

  12. 峰终规则

  13. 冯·雷斯托夫效应

  14. 普拉格南茨定律

1、费特定律

完成操作所需的时间取决于两个变量。 

  • 距离,距离大需要时间长

  • 大小,太大就容易出错

例子:七城网店主Demo就很好地演示了这一规律。

网站设计提升用户体验的14条黄金法则  第1张

绿色的“购买新系列”按钮出现在用户的主视线内。另外,由于其突出的绿色和尺寸,它很容易找到,用户可以放心地单击它而不会出错。

2、希克定律

用户很难做出决定,当页面太复杂时。 

如果您听说过分析瘫痪(当用户被自己的选择淹没而难以做出选择时),

信息超载不仅影响做出决定时间。

还可能后悔之前的选择。

这就是为什么 KISS(保持简单,愚蠢)

原则在网页设计中至关重要。

示例:

网站设计提升用户体验的14条黄金法则  第2张

在上面中,您可以看到用户如何使用各种筛选排序工具。。

3、米勒定律

普通人的短期记忆中只能保存大约七位信息。

这条用户体验定律与希克定律密切相关。

因此,

请记住数字七(正负二)。 

示例:产生大量内容的网站必须注意一次与用户共享多少信息。像Newspaper的 Town Talk 演示那样为关键部分添加边界可以帮助用户一次专注于一个区域。

网站设计提升用户体验的14条黄金法则  第3张

除此之外,每个部分包含不超过七个项目将使您的用户记住他们所看到的大部分(如果不是全部)内容。

4、雅各布定律

用户在网上花费大量时间,

有时人们更喜欢熟悉的东西而不是奇怪的东西。

具体来说,

他们希望您的网站按照他们期望的其他网站的方式运行。

示例:AI ANN的演示样式、自定义光标和动画可能会突破界限。 

网站设计提升用户体验的14条黄金法则  第4张

上面那样,看起来很熟悉,也很舒服!

5、审美-可用性效应

界面的吸引力与其易用性之间存在相关性。

换句话说,

第一印象对用户来说非常重要。

请努力提高其视觉吸引力,减少跳出率。

或者功能难以使用,只要它看起来很棒即可。

这个原则只是让我们更好地了解是什么吸引人们进入网站,

示例:Bridge是多用途 WordPress 主题之一,具有大量专为商业构建的演示。 

网站设计提升用户体验的14条黄金法则  第5张

就像这个 Gym 演示一样,每个演示都有专门针对其目标业务而设计的独特且有吸引力的设计。访问者会发现很难不向下滚动并了解更多信息。

6、奥卡姆剃刀

最简单的方法通常是最好的。

而是仅包含必要的内容。 

一旦验证了现有技术的有效性。

示例:

网站设计提升用户体验的14条黄金法则  第6张

这样排版,您的注意力就可以集中在基础知识上。

7、帕累托法则

大多数系统本质上都是不平衡的。

具体来说,

你获得的 80% 的回报来自你投资的 20%。

当谈到网页设计时,

有不同的方式来解释这一点。 

对于初学者来说,

如果是这样的话,

那么花时间完善界面的那些方面就更有意义了,

另一种看待方式是,

网站 80% 的利润来自 20% 的用户。

与其花时间构建可能吸引新用户群体的功能,

不如致力于改善已经想给你钱的忠实用户的体验。

示例:这个房地产主题演示展示了该公司备受瞩目的项目徽标,图中的亮橙色图标。一旦访问者意识到他们是与网站互动的,他们肯定会停下来查看本节的其余部分。

网站设计提升用户体验的14条黄金法则  第7张

8、波斯特尔定律

我们应该限制对用户的要求,

但对我们从他们那里接受的东西要灵活。 

结账表格就是一个很好的例子。

首先,

我们应该只询问绝对需要的信息。

如果可能的话,

我们也可以为用户创造更少的工作。

示例:您可以使用 Postel 定律来改进任何要求用户输入信息的网站。尤其是电子商务,

网站设计提升用户体验的14条黄金法则  第8张

顶部的智能搜索栏可以帮助用户找到相关的 NFT 产品,输入“art”之类的内容会在下面显示相关内容。

9、目标梯度效应

当用户越来越接近完成目标时,

他们会更快地完成目标。

例如: 

  • 位于结账表单顶部的进度条

  • A“只需 12 美元即可免运费!”购物车上方提示

  • 进度指示器,显示用户距离获得下一个奖励有多近

当人们能够看到剩下的工作有多么少以及即将到来的回报时,

他们就会努力完成它。

示例:您可以看到Blonwe杂货店如何使用它。 

网站设计提升用户体验的14条黄金法则  第9张

购物车上方有一个红色块,

让购物者知道他们需要多花多少钱才能获得免费送货上门。

虽然颜色对于没有视觉障碍的用户来说很有用,

但总体设计(阴影块和黑色进度指示器)

确保每个人都会注意到它。 

10、多尔蒂阈值

该定律规定网站应在 400 毫秒作出响应,加载速度太慢是没有客户的。

八十年代对此的初步研究发现,

做出这种反应的系统很快就会变得“上瘾”。

但用户对快速加载网页的期望却没有改变。

示例:

网站设计提升用户体验的14条黄金法则  第10张

如果没有首先加载图像,就不需要旋转加载器来让访问者忙碌。该网站几乎立即加载。 

11、串行位置效应

在网页设计中,

我们可以使用这个原则来设计组件,

例如:

  • 导航链接

  • 产品推荐

  • 定价计划

如果我们知道用户最关注并回忆起第一个和最后一个项目,

那么这就是最重要的信息应该放在的地方。

示例:每个人都知道最重要的信息显示在英雄部分。但对于那些在网上花费足够时间的人来说,他们也知道页面底部也包含好东西。以这个Nooni商店演示为例。 

网站设计提升用户体验的14条黄金法则  第11张

页脚上方是一个横幅部分,宣布闪购 80% 折扣。 

12、峰终规则

您可以在设计网页最重要的地方应用此原则。

记用离强烈记住它。

在设计的最后时刻时也很有用。

例如,

加一个有趣动画引导用户到“谢谢”页面,

而不是最后提交按钮并看谢谢。

示例:

网站设计提升用户体验的14条黄金法则  第12张

商店的主页统一设计,视差图像无缝滑动。但这个弹出窗口一路上带来了惊喜。对于尚未做好准备的游客来说,没关系。因为如果他们到达页面底部,他们会发现相同的订阅表格在等待着他们。

13、冯·雷斯托夫效应

该定律也称为“孤立效应”,

如我们在定价表中看到,有个别报价有特殊颜色,或者更大,又或者有图像。

示例:Outgrid的聊天机器人

网站设计提升用户体验的14条黄金法则  第13张

用户的眼睛将立即被 Pro 计划吸引,该计划具有蓝色圆形边界和顶部的蓝色推荐标签/丝带。 

14、普拉格南茨定律

人的眼睛和思想更喜欢简单。

这些原则涉及以下概念: 

  • 共同命运

  • 公共区域

  • 连接性

  • 连续性

  • 封闭

  • 邻近性

  • 相似性

我们越了解人类思维本质上如何理解看似混乱的情况,我们就能越有效地为它们设计界面。

示例:格式塔原则告诉我们在设计中所做的很多事情,而无需思考。出于本示例的目的,让我们重点关注EduBlink瑜伽教练演示网站上出现的这些推荐块。 

网站设计提升用户体验的14条黄金法则  第14张

包含每个推荐的纯白色背景告诉我们作为观众,所有内容都是在一起的,不要被外部不相关的内容分散注意力。这就是Common Region的原理。

结论

这14条用户体验法则是基于人类心理学长期实践总结的黄金法则。

一旦掌握了这些法则,

您就会发现为用户创建更有吸引力的网站会变得更加容易。

文章目录
  • 用户体验法则是什么?
    • 1、费特定律
    • 2、希克定律
    • 3、米勒定律
    • 4、雅各布定律
    • 5、审美-可用性效应
    • 6、奥卡姆剃刀
    • 7、帕累托法则
    • 8、波斯特尔定律
    • 9、目标梯度效应
    • 10、多尔蒂阈值
    • 11、串行位置效应
    • 12、峰终规则
    • 13、冯·雷斯托夫效应
    • 14、普拉格南茨定律
  • 结论
  • 发表评论