虽然网页设计是一门相对较新的学科，但它归功于人机交互（HCI）的科学研究。而这9个直接来自于人机交互研究的指南将帮助你在设计网站和应用程序时以用户为中心。
界面设计，主要关注界面的功能布局，是用户体验设计的一个子集，它关注的是大局：即整个体验，而不仅仅是界面。
1、了解你的用户
最重要的是，你必须了解你的用户是谁--从里到外。这意味着你必须了解你的分析应用程序可以拉取的所有人口统计学数据。但更重要的是，这意味着了解他们需要什么，以及是什么阻碍了他们实现目标。
要达到这种程度的同理心，需要的不仅仅是仔细分析统计数据。它需要了解使用你的网站的人。这意味着与他们面对面地交谈，观察他们使用你的产品（也许还有其他产品），并问他们更深层次的问题，而不是譬如 "你觉得这个设计怎么样？”之类的无聊问题。
目标是什么？是什么阻碍了实现这些目标？一个网站如何帮助克服或解决这些挑战？
不要仅仅停留在知道你的用户想要什么。必须深入挖掘，找出他们的需求。毕竟，欲望只是需求的衍生品。如果你能解决用户的深层需求，那么您将在满足他们最基本需求的同时满足他们的需求。
你将从分析数据和与用户交谈中发现的见解将为你的每一个决策提供参考，从人们如何使用你的界面，到你将在界面中突出显示哪些类型的内容。
2、定义用户如何使用你的界面
在你设计界面之前，你需要定义人们将如何使用它。随着触摸式设备的日益普及，这是一个比你想象中更关键的问题。看看以下产品：
Tinder：该应用程序的用户体验实际上是由简单的滑动即可轻松实现的。
人们使用网站和APP的方式有两种：直接（通过与产品的界面元素进行交互）和间接（通过与产品外部的UI元素进行交互）。
直接互动的例子
轻按一个按钮
刷卡
拖动一个目标
间接互动的例子
用鼠标指向和单击
使用按键命令/快捷键
输入表格字段
在Wacom上绘图
有时候，交互显得很容易
你的用户是谁，他们使用什么设备，应该深深地影响你的决定。如果你的设计对象是老年人或其他手部灵巧度有限的人，你就不希望依赖刷卡。如果你的设计对象是写手或编码人员，他们主要通过键盘与应用程序进行交互，你会希望支持所有常见的键盘快捷键，以减少使用鼠标的时间。
3、设定期望值
许多与网站或APP的互动都会产生后果：点击一个按钮可能意味着花钱，删除一个网站，或者对奶奶的生日蛋糕发表贬义的评论。而任何时候有了后果，也就产生焦虑。
所以，一定要让用户在点击那个按钮之前，先让他们知道点击那个按钮之后会发生什么。你可以通过设计或文案来做到这一点。
用设计设定期望值
突出显示与所需操作相对应的按钮。
使用一个广为人知的符号（如用垃圾桶做删除按钮，用加号来添加东西，或用放大镜做搜索）
选择一个有相关含义的颜色（绿色代表 “开始 "，红色代表 "停止 "）
以文本设定期望值
撰写清晰的按钮文字
在空白状态下提供方向性/鼓励性文字
发出警告并要求确认
对于具有不可逆后果的操作，例如永久删除某项，最好问用户是否确定。
在InVision中，单击垃圾桶图标不会立即删除。相反，它询问您是否确定，并告知您无法撤消。
4、预计到错误
人都会犯错，但他们不应该（总是）承担后果。有两种方法可以帮助减少人为错误的影响。
1.在错误发生之前就预防错误
2.提供发生后的修复方法
在电子商务和表单设计中，你会看到很多防错技巧。按钮保持不活动，直到你填写完所有的字段。表单会检测到电子邮件地址没有正确输入。弹出窗口会问你是否真的要放弃你的购物车。
预测错误通常比尝试事后解决错误要容易得多。这是因为它们发生在单击“下一步”或“提交”按钮可以带来令人满意的完成感之前。
话虽如此，但有时你不得不让意外发生。这时，详细的错误信息才是真正意义上的错误信息。
当你在写错误信息时，要确保它们能做两件事：
1.解释问题的原因。例如："你说你出生在火星上，人类还没有殖民过。还没有。"
2.解释一下如何解决。如："请在这里输入一个地球上的出生地。"
注意，在非错误的情况下，你可以从那本书中抽出一页来。比如说，如果我删除了一些东西，但可以恢复，让我知道，用一行复制，比如说 "你可以通过进入你的垃圾箱，然后点击恢复，总是可以恢复被删除的东西。"
预知用户错误的原则被称为poka-yoke原则。Poka-yoke是一个日语术语，翻译成 "防呆"。
5、迅速给予反馈
在现实世界中，环境会给我们反馈。我们说话，别人就会回应（通常情况下）。我们抓一只猫，它就会发出呼噜声或声嘶力竭（取决于它的情绪和我们对猫抓痒的程度）。
很多时候，数字界面不能给我们太多的反馈，让我们纠结于是否应该重新加载页面，重启笔记本，或者直接把它扔出窗口。
所以，给我一个加载动画。让那个按钮在我点击时弹出并弹回，但不要太多。当我做了一些你我都同意的事情时，给我一个虚拟的击掌。
计划或发送电子邮件时，MailChimp会提供反馈和鼓励。
只要确保这一切发生得快就可以了。Usability.gov将任何超过1秒的延迟定义为中断。如果超过10秒，则为中断。后者很慷慨：对于大约一半的人来说，3秒就足以导致跳出。
如果一个页面在5秒内加载，不要显示进度条，因为这实际上会使加载时间看起来更长。相反，使用一个不暗示进度的可视化，就像Mac的臭名昭著的 “死亡风车”。如果你的网站上确实使用了进度条，可以考虑尝试一些视觉技巧，让加载看起来更快。
6、仔细考虑元素的位置和大小
菲茨定律是人机交互（HCI）的一个基本原则，它指出：
获取目标的时间取决于目标的距离和大小。
换句话说：距离越近或越大的东西，你可以把光标（或手指）放在上面的速度就越快。这显然对交互和用户界面设计技术有各种各样的影响，但其中最重要的三个是。
让按钮和其他的 "点击目标"（如图标和文本链接）足够大，以便于看到和点击。这一点对于排版、菜单和其他链接列表尤其重要，因为空间不够大，会让人反复点击错误的链接。
将最常见的操作按钮做得更大、更显眼。
将导航（和其他常见的交互式视觉元素，如搜索栏）放在屏幕的边缘或角落。这最后一个可能看起来似乎有些反直觉，但它的作用在于减少了对准确性的要求：用户不需要担心过量的点击目标。
当你在考虑元素的放置和大小的时候，要时刻牢记你的交互模型。如果你的网站需要水平滚动，而不是垂直滚动，你需要考虑在哪里以及如何提示用户到这种不寻常的交互类型。
7、不要忽视标准
作为高度创意型的设计师，他们往往喜欢重新发明事物--但这并不总是最好的想法。
为什么？因为重新设计一个熟悉的交互或界面会增加 "认知负荷"：它让人们重新思考一个他们已经学习过的过程。很显然，你可以想方设法地重新发明轮子，但前提是它必须是在设计上有所改进。
这个经验法则解释了为什么Google Docs的菜单栏的功能几乎与Vista之前的Microsoft Word的所有选项相同：
Windows Vista之前的Microsoft Word菜单栏。
2015年Google文档菜单栏
这也解释了为什么Pocket在几年前不得不改变其Android应用中的存档按钮的位置。
更改单个按钮使其与Android的设计模式更加一致，使新用户继续使用Pocket的可能性提高了23％。
在2013年秋季之前，存档按钮一直位于屏幕的左上角，也就是安卓设计规范中所说的 “向上 "按钮的位置。Pocket希望将人们的注意力集中在阅读体验上，而不是重复现有的硬件控制，但不一致的位置导致新用户不小心关闭并归档他们正在阅读的文章，而不是像预期的那样简单地返回到他们的阅读列表。
这一微小的改变 "使新用户从这一点开始继续使用Pocket的可能性增加了23%。"
8、使你的界面易于学习
说到简单，人们经常会引用哈佛大学心理学家乔治-米勒的一篇论文，名为《神奇的数字七，加减二：对我们处理信息能力的一些限制》。文章认为，人们在短期记忆中只能掌握5到9件事情的可靠性。米勒本人称这是一种巧合，但这似乎并不能阻止任何人引用他的说法。
话虽如此，但是，越简单的东西越容易在短期内记住，这也是符合逻辑的。所以，尽可能地限制一个人需要记住的东西的数量，以便有效地使用你的界面。你可以通过将信息块化，即将其分解成可消化的小块。
这个想法与Tesler的 "复杂性守恒定律 "相吻合，该定律指出，UI设计师应该让他们的界面尽可能简单。这可能意味着在可能的情况下，在简化的界面背后掩盖了应用程序的复杂性。Microsoft Word就是一个不遵守这一定律的产品的常见例子。
大多数人只能在Word中做一些事情，例如打字，而其他人可以用它来做各种强大的事情。
这导致了一个叫做渐进式公开的概念，将高级功能隐藏在辅助界面上。你经常会在网站的主页上看到这种情况，在网站的主页上，用简短的文字介绍产品或功能，然后链接到用户可以了解更多信息的页面。(这也是移动设计的最佳实践，在这里，强大的导航总是一个挑战)。
专业提示：避免在链接和按钮中使用 "了解更多 "和类似的非特定文本。为什么？因为它并没有告诉用户他们会 "了解更多 "的内容。通常情况下，人们只是简单地扫描一个页面，寻找一个能带他们到他们想去的地方的链接，而 "了解更多"，重复15次，并没有帮助。这一点对于屏幕阅读的用户来说尤其重要。
9、使决策简单化
网络上有太多的广告向我们喊话。"横幅广告 "突然膨胀成了全屏广告。模板弹出，暗示我们要订阅我们还没来得及看的博客。视频间歇广告让我们停滞不前，迫使我们看着宝贵的几秒钟的时间慢慢流逝。甚至不要让我开始讨论那些小部件、弹出按钮、工具提示......
有时我渴望一个更平静的网络，昆山做app公司而希克斯定律给了我们所有人一个建立网络的理由。这个想法和它的最终结果一样简单：你给用户提供的用户界面选项越多，他们就越难做出决定。
这几乎影响到了我们构建的一切：
总体布局
导航菜单
定价页面
博客索引
内容提要
这个问题还在继续。但最终的结果是：我们的设计越简单，用户就越能更快、更容易做出我们希望他们做出的决定。这也正是为什么着陆页和非新闻通讯邮件应该只有一个行动呼吁的原因。
专业提示：有时候，你实际上确实希望用户能够慢下来，考虑一下他们的选择。这就是为什么Pinterest、Dribbble和许多博客的分层设计实际上效果很好。毕竟，你必须在更多的选项之间做出决定，你越有可能找到一个适合你的选项。
10、聆听数据
虽然我们都可能希望我们的设计纯粹是以艺术价值为评价标准，但实际上，优化设计以达到设计目的同样重要。
虽然用户研究和测试对于指导你的设计决策以实现网站的目标是非常有帮助的，但网站上线后收集的数据仍然是非常宝贵的。
因此，为你的网站设置分析，并定期进行分析。外面有很多不同的分析工具，但我推荐使用Google Analytics和/或Mixpanel，这取决于项目类型。
Mixpanel专注于事件，所以它根据访客在你的网站上的行为收集数据，而Google Analytics更多的是行为分析，给你提供会话时间、流量来源等。虽然这两种工具都可以提供这两种形式的数据，但它们真正的亮点在于它们的重点领域，所以请选择最适合您的需求。
注意：这两种工具都是免费的，最多可提供一定数量的数据点。Webflow和类似的平台通常通过简单的API密钥交换，使分析设置变得容易。
微信扫一扫
