10个“以人为本”的网页设计准则

　　网站不仅仅是通过链接连接的一组页面。它是一个界面，一个空间，不同的事物(公司或个人的网站)彼此相遇，交流并相互影响。这种互动为访问者创造了一种体验，作为南京网站建设专家，确保体验尽可能好是我们的工作。

　　关键是始终和永远考虑您的用户。尽管网页设计是一门相对较新的学科，只要我们在设计网站和应用程序时专注于用户即可。 界面设计着重于界面功能的布局，是用户体验设计的子集，用户体验设计着眼于更大的图景：即整个体验，而不仅仅是界面。

　　1.了解您的用户

　　最重要的是，您必须了解内部和外部用户的身份。这意味着知道您的分析应用程序可以提取的所有人口统计数据。但更重要的是，这意味着知道他们的需求，以及阻碍他们实现目标的方式。

　　要达到同理水平，不仅需要仔细分析统计数据。它需要了解使用您网站的人。这意味着与他们面对面交谈，看着他们使用您的产品(也许还有其他产品)，并向他们提出比“您如何看待这种设计?”更深入的问题。

　　他们的目标是什么?他们实现这些目标的方式是什么?网站如何帮助他们克服或应对这些挑战?

　　不要停止了解您的用户想要什么。深入挖掘，找出他们需要什么。毕竟，欲望只是需求的产物。如果您可以解决用户的根深蒂固的需求，那么您将在满足他们最基本需求的同时满足他们的需求。

　　您将从分析数据和与用户交谈中发现的见解将指导您做出的每个决定，从人们如何使用您的界面到您将在该界面中突出显示哪些类型的内容。

　　2.定义人们如何使用您的界面

　　在设计界面之前，您需要定义人们将如何使用它。随着基于触摸的设备的普及，这是您可能想到的更为关键的问题。看看

　　火种：该应用程序的用户体验实际上是由简单的滑动即可轻松实现的。

　　人们以两种方式使用网站和应用程序：直接(通过与产品的界面元素进行交互)和间接(通过与产品外部的ui元素进行交互)。

　　直接互动的例子

　　轻按一个按钮

　　刷卡

　　用指尖拖放项目

　　间接互动的例子

　　用鼠标指向和单击

　　使用按键命令/快捷方式

　　键入表单字段

　　在平板电脑上绘图

　　您的用户是谁，以及他们使用的设备应在这里深深地影响您的决定。如果您是为老年人或其他手脚灵活性有限的人设计的，则您不希望依靠刷卡。如果您是为主要通过键盘与应用程序交互的作家或编码者设计的，则需要支持所有常见的键盘快捷键，以最大程度地减少使用鼠标的时间。

　　3.设定期望

　　与网站或应用程序的许多交互都会产生后果：单击按钮可能意味着花钱，删除网站或对奶奶的生日蛋糕发表贬低的评论。每当有后果时，都会有焦虑。

　　因此，请务必让用户知道在单击该按钮之后将要发生的事情。您可以通过设计和/或复制来做到这一点。

　　通过设计设定期望

　　突出显示与所需操作对应的按钮

　　结合使用广泛使用的符号(例如用于删除按钮的垃圾桶，用于添加内容的加号或用于搜索的放大镜)与复制结合使用

　　选择具有相关含义的颜色(绿色表示“开始”按钮，红色表示“停止”)

　　用复制设定期望

　　编写清除按钮副本

　　在空状态下提供定向/鼓励性副本

　　发出警告并要求确认

　　对于具有不可逆转后果的操作，例如永久删除某项，最好问人们是否确定。

　　4.预期错误

　　人们会犯错误，但他们(永远)不必承受后果。有两种方法可以减少人为错误的影响：

　　防止错误发生

　　提供在它们发生后修复它们的方法

　　您会在电子商务和表单设计中看到很多防止错误的技术。在填写所有字段之前，按钮将保持不活动状态。表单检测到电子邮件地址输入不正确。弹出窗口会询问您是否真的要放弃购物车。

　　预测错误通常比尝试事后解决错误要容易得多。这是因为它们发生在单击“下一步”或“提交”按钮可以带来令人满意的完成感之前。

　　也就是说，有时您只需要让事故发生即可。那是真正的详细错误消息出现的时候。

　　在编写错误消息时，请确保它们执行以下两项操作：

　　解释问题。例如，“您说您是在火星上出生的，但人类还无法到达火星。”

　　说明如何解决。例如，“请在地球上选择出生地。”

　　请注意，对于非错误情况，您可以从同一本书中摘录。例如，如果我删除了某些内容，但可以还原它，请告知我，例如“您始终可以通过移至回收站并单击还原删除的项目。”

　　5.快速提供反馈

　　在现实世界中，环境为我们提供反馈。我们说话，而其他人则回应(通常)。我们抓挠猫，猫会发出嘶嘶声或嘶嘶声(取决于猫的喜怒无常以及猫抓挠时的吸吮程度)。

　　通常，网站无法提供太多回报，这使我们想知道是否应该重新加载页面，或者只是将其弹出最近的可用窗口。

　　所以如果加载过慢请提供加载动画。当我点击该按钮时，使其弹出提示用户，但不要过多。如果页面将在5秒钟内加载，请不要显示进度条，因为它实际上会使加载时间看起来更长。相反，请使用不暗示进度的可视化效果，例如Mac臭名昭著的“死亡风车”。但这不是。如果确实在网站上使用进度条，请考虑尝试一些视觉技巧以使加载看起来更快。

　　6.仔细考虑元素的放置和大小

　　菲茨定律是人机交互(HCI)的基本原理，它指出：

　　获取目标的时间取决于目标的距离和大小。

　　换句话说：物体越近和/或越大，将光标(或手指)放在上面的速度就越快。显然，这对交互和用户界面设计技术具有各种含义，但是最重要的三个是：

　　将按钮和其他“点击目标”(例如图标和文本链接)设置得足够大，以方便查看和点击。这对于排版，菜单和其他链接列表尤为重要，因为空间不足将使人们一次又一次地点击错误的链接。

　　将最常见操作的按钮放大并突出显示。

　　将导航(以及其他常见的交互式视觉元素，如搜索栏)放在屏幕的边缘或角落。最后一个看上去似乎违反直觉，但它之所以有效，是因为它减少了对准确性的需求：用户无需担心过高的点击目标。

　　在考虑元素放置和大小时，请始终牢记交互模型。如果您的网站需要水平滚动而不是垂直滚动，则需要考虑在何处以及如何引导用户使用这种异常的交互类型。

　　7.不要忽视标准

　　作为具有高度创造力的网站设计，设计师倾向于喜欢重塑事物，但这并不总是最好的主意。

　　为什么?因为熟悉的交互或界面的改进版本增加了“认知负担”：它使人们重新考虑他们已经学习的过程。显然，您可以重新发明所有想要的轮子，但前提是要切实改进设计。

　　此经验法则解释了为什么谷歌文档的菜单栏几乎具有与Microsoft Word的相同。

　　8.使您的界面易于学习

　　说到简单性，人们经常引用哈佛心理学家乔治·米勒(George Miller)发表的一篇论文，题为“神奇的数字7，正负2：我们处理信息能力的某些限制。”该文章建议人们只能容纳5到9事物在其短期记忆中具有任何可靠性。米勒本人称这是一个巧合，但这似乎并没有阻止任何人引用他。

　　也就是说，事情越简单，在短期内记住起来就越容易。因此，只要有可能，就限制一个人有效地使用您的界面需要记住的事物数量。您可以通过对信息进行分块来简化此过程，即将其分成可消化的小块。

　　这个想法与Tesler的“复杂性守恒定律”相吻合，该定律指出UI设计人员应使其界面尽可能简单。这可能意味着只要有可能，就可以在简化的界面后掩盖应用程序的复杂性。Microsoft Word是产品不遵守该法律的流行示例。

　　大多数人在Word中只做一些事情(例如键入)，而其他人则可以使用它来做各种功能强大的事情。但是在世界各地，每个人都使用相同的UI打开相同版本的Word，而普通的Joe(不是超级用户)会被他们可能永远不会使用的各种选项所淹没。

　　这导致了一个称为渐进公开的概念，其中高级功能隐藏在辅助接口上。您经常会在网站的首页上看到此信息，其中短篇幅的副本介绍了产品或功能，然后链接到用户可以了解更多信息的页面。(这也是移动设计的最佳实践，在该设计中，强大的导航始终是一个挑战。)

　　专家提示：避免在链接和按钮中使用“了解更多”以及类似的非特定文本。为什么?因为它不会告诉用户他们将“了解更多”的知识。通常，人们只是扫描页面以寻找将他们带到想要去的地方的链接，而“学习更多”(重复15次)无济于事。对于屏幕阅读器的用户来说尤其如此。

　　9.简化决策

　　太多的广告折磨着我们：“横幅广告”突然改变为全屏广告弹出，迫使我们聚焦广告。视频插页式广告将我们挡在了页面上，迫使我们观看。

　　有时候，我们渴望一个净化的互联网，而希克斯定律给了我们所有人建立一个网络的理由。这个想法就像最终结果一样简单：向用户展示的用户界面选项越多，他们做出决定的难度就越大。

　　这几乎影响了我们构建的所有内容：

　　整体布局

　　导航菜单

　　定价页面

　　文章索引

　　内容提要

　　我们进行的设计越简单，用户做出我们希望他们做出的决定的速度就越容易。这就是为什么登陆页面只应号召采取行动的原因。

　　专家提示：有时候，您实际上确实希望用户放慢脚步并考虑他们的选择。这就是为什么Pinterest，Dribbble的平铺设计效果不错的原因。毕竟，您的选项越多，找到适合您的选项的可能性就越大。

　　10.聆听数据

　　我们都希望我们的设计纯粹是根据其艺术价值进行评估，但现实是，优化设计以实现其目标同样重要。尽管用户研究和测试在指导设计决策以实现站点目标方面非常有用，但启动后收集的数据仍然非常宝贵。

　　因此，请为您的网站定期进行分析。这里有很多不同的分析工具，但我们建议根据项目类型使用百度统计或友盟统计。

　　友盟专注于事件，因此它根据访问者在您的网站上执行的操作来收集数据，而百度统计具有更多的行为习惯，可以为您提供会话时间，流量来源等。尽管这两种工具都可以提供两种形式的数据，但它们的确注重不同方面，因此请选择最适合您的需求。