我们向我们敬佩的网页制作人提出了同一个问题...

人们可以做些什么让他们的网站变得更好?

感谢我们 2021 年的主要赞助商。他们是让这个网站成为可能的很大一部分。

用真实用户测试您的网站

几年前,有一家法国图书出版商。他们专门出版技术书籍,出版了一位作者写的一本关于 CSS3、HTML5 和 jQuery 的书。然而,最终版本在封面上的一个明显的拼写错误,将“HTML5”显示为“HTLM5”。请仔细阅读两次。是的。“HTLM5”。(注意,在一个版本中,jQuery 中的大写字母“Q”也丢失了。)

Image of the book containing the typo. It has three cartoonish figures on it dressed as superheroes, then a product description of the book to the right of the cover.

我不知道有多少人参与了书籍的出版和印刷。我敢肯定不少。然而,看起来没有一个人注意到这个拼写错误。毕竟,它被送到了印刷厂。

这种事情在项目中经常发生。我最喜欢的法语表达之一是 avoir la tête dans le guidon。字面翻译是“把头放在车把上”。(英语官方版本是 having your nose in the grindstone。)它来自骑自行车。当骑自行车的人试图赢得比赛时,在某个时候,他们的鼻子会离车把很近,以至于周围的任何东西都不重要。他们**高度专注于前方道路**。他们再也看不到周围的任何东西了。

Photo of a cyclist in a black helmet and red jacket on a black and blue racing bike riding through a busy intersection with a blurry backdrop indicating a fast speed.
来源:Max Bender 通过 Unsplash

而这正是我们在项目中经常发生的事情。我们和我们的团队在某个时候如此专注于发布网站(或印刷书籍),以至于我们**蒙上了眼睛**,再也看不到一些小细节(或大细节)了。这就是你如何发布一本关于“HTLM5”的书以及一个具有导航问题和用户流程死胡同的网站,或者发布没有人需要的功能。

通过用户测试获得外部视角

如果您想避免这些事情,您需要从**外部视角**查看您的网站、产品或服务。获得这种视角的最佳方法是使用不在团队中的人员对其进行测试。我们称之为**可用性**或**用户测试**。我不得不承认,我在这里有偏见,因为我的部分工作是对网站进行用户测试。因此,我必须说,理想情况下,您想要**使用目标受众进行测试**——那些真正使用您的网站、产品或服务的人。但是,如果(这是一个很大的如果)您找不到任何用户,至少让那些没有直接参与项目的人进行第一轮测试。

您还希望使用有**不同障碍**的人员进行测试,以确保最终结果尽可能地易于访问。

我应该什么时候开始测试我的项目?

在理想情况下,您应该**尽快、尽可能频繁地进行测试**。在开始开发之前测试在设计工具中构建的原型更便宜。如果概念行不通,至少您没有将三个月的开发时间投入到一个无效的功能上。

您还可以使用为测试构建的假数据测试 HTML/CSS/JavaScript 原型——或者在功能或网站开发完成后进行测试。但这确实意味着任何更改都更加复杂和昂贵。

定义您想要测试的内容

第一步是定义您想要测试的**特定任务**或**活动**。通常,您需要一组不同的操作,并在最后实现用户目标。例如

  • 帐户创建流程
  • 整个结账流程
  • 从主页到最终博客文章的搜索流程等。

列出用户需要完成的任务和活动,以问题的形式。我们称之为创建**测试脚本**。您可以在 这里找到 18F 的示例

小心不要对用户产生偏见。这是棘手的部分。例如,如果您想要测试帐户创建流程,并且按钮上写着“注册”,那么请避免让您的测试用户“注册”,因为他们会做的第一件事就是搜索屏幕上具有相同动词的按钮。您也可以让他们“创建帐户”,并获得更好的见解。

Screenshots of Axure and Word side by side.
Axure 中构建的原型的示例以及测试脚本

然后准备您想要测试的原型。如前所述,它可以从带有点击式原型的模型到带有真实数据的完全开发的原型。这完全取决于您以及您在项目中的进度。只需确保它有效(我是说技术上的)。

招募参与者

您知道在大多数项目中您的用户是谁。问题是:如何与他们联系?有很多方法。您可能通过支持或销售人员获得可能的参与者名单。如果目标受众很广泛,您可以在他们所在的地方招募测试人员。您正在开发一个出售植物的电子商务网站吗?为什么不尝试访问实际的实体店、园丁的在线社区、社区花园、Facebook 群组等。

您可以使用社交媒体招募参与者,只要您**招募到合适的人**,这些人是该网站的潜在用户。这就是 UX 专业人士使用筛选器的目的。筛选器是您在招募时(以及开始测试时)会问的一组问题,以确保您正在与目标受众中的人合作。

请注意,参与者通常会**因他们的时间获得报酬**。它可以是礼品卡,也许是您的产品,一些非常好的巧克力——一些鼓励人们以感谢他们的方式花时间与您在一起的东西。

如果您在招募方面遇到困难并且有预算,您可以使用专业的用户研究招募网站,例如 userinterviews.comtestingtime.com

安排、设置、准备

一旦您成功地招募了参与测试的参与者,请**安排与他们会面**,包括测试日期、时间和地点。测试可以是远程的,也可以是面对面的。我在这里不会详细介绍物流,但在某个时候,您将需要帮助来设置一个实际的房间或一个虚拟空间进行测试。如果是一个物理房间,请确保它安静且方便您的用户使用。如果是远程的,请确保工具是可访问的,并且人们可以在需要时将其安装在他们的计算机上。

提前安排一些电子邮件,以防万一,在测试前一天提醒参与者。

最后但同样重要的是:**使用团队中的人员进行测试的试运行**。这有助于避免脚本和原型中的拼写错误。您需要确保原型正常工作,没有技术问题等等。您需要避免任何可能影响测试的事情。

主持测试

您需要两名测试人员才能进行可用性测试。一个人主持。另一个人负责物流和笔记。

欢迎参与者。您可以在 usability.gov 上找到许多可用性测试模板,包括同意书、电子邮件模板示例等等。

开始录制,但前提是他们允许您这样做。解释说**您正在测试网站,而不是他们**,并且没有正确或错误的答案。鼓励他们大声说出自己的想法,并告诉您他们做了什么、看到了什么和想到了什么。

通过提出一些轻松的问题来让他们放松,让他们开始说话。然后按照您的脚本进行操作。

最重要的是:**不要帮助用户完成任务**。我知道,这很难。我们不喜欢看到人们挣扎。但是,如果您帮助他们,您将影响结果。当然,如果他们挣扎了五分钟,而您需要他们完成任务才能进行下一步,您可以解锁他们。将该特定任务标记为“失败”。

测试结束后,感谢测试用户抽出时间,并向他们提供报酬(或告诉他们如何获得报酬,如果这是一项远程测试)。

获取录音,将其上传到云端,以便备份。笔记也是一样。相信我,没有什么比因为电脑崩溃而丢失数据更糟糕的了。

分析并记录结果

测试结束后,我通常喜欢为每个参与者整理一份简短的“初稿”分析,因为测试的记忆仍然很新鲜。

有些人会使用共享文档或 Excel 表格来完成。我最喜欢的方法是使用**Miro 板上的实际测试屏幕**。我会在上面贴上数字便签,写上测试的主要发现。我用不同的颜色代表不同类型的反馈,例如用户评论、功能请求、可用性问题等。

当多个用户给出相同的反馈或遇到相同的问题时,我会在便签上添加一个小点。这样,我就能直观地概括所有测试过程中的所有情况。

Screenshot of mockup screens in Miro with notes attached to various areas of the screens. There are 13 total screens, each with different layouts and content.

然后呢?学习、迭代、改进

我们进行测试并非为了测试的乐趣,而是为了改进。因此,下一步就是从这些测试中学习。哪些方面做得很好?哪些方面可以改进?我们可以如何改进?当然,你可能没有时间和预算一次性改进所有内容。我的建议是优先排序并迭代。首先解决最主要的问题。“大”是一个相对的概念,这取决于你的项目或KPIs。这可能意味着“大多数用户都遇到这个问题”。或者可能意味着,“如果这个问题得不到解决,我们将失去用户和收入”。这时,它再次成为一项团队合作。

总结

我希望我已经说服你尽快并且经常测试你的网站。这只是一个使用真实用户进行测试的小小介绍。为了让你了解用户测试的流程,我在这里做了很多简化。专业的可用性测试更为复杂,尤其是在大型项目中。虽然我始终偏爱聘用专门负责用户研究和测试的人员,但我理解对于小型项目来说这可能很复杂。

如果你想更深入地了解,我建议你查看以下资源