如何引导用户关注网站

平面设计 网站设计 设计原则
2022-01-20 08:02:08

摄影中有一个共同的原则,即照片应该引导观众的眼睛。这通常通过穿过照片的线来完成。认识到观察者将如何扫描您的照片通常有助于构图,并且观察者的眼睛扫描照片的方式有时甚至可以改变照片的含义。

在网页设计中可以做些什么来引导用户的视线沿着您想要的方向浏览网站,而无需用户寻找页面的正确部分?

例如,您可能希望用户看到徽标,然后是网站的简短描述,然后是文章。除了将这些项目放在一个垂直列中,一个在下一个下方并从页面中删除所有其他元素之外,您如何引导用户的眼睛从一个到下一个?

4个回答

这完全取决于尺寸、颜色和对齐方式之间的平衡问题。有了经验,您就会知道什么时候使用这些技巧来吸引注意力。幸运的是,在网站上我们可以追踪到这种关注,并且有很多关于这个问题的科学研究,例如Jakob Nielsen 网站上有很好的数据。

关于眼动追踪我想说的是,出于预算的考虑,实际上没有人会为眼动追踪设备付费,甚至不会使用它。(说服办公室的老板在项目的任何阶段进行几个小时的可用性测试已经很困难了……)我个人更喜欢与真人一起进行可用性测试来判断我的网页设计构成。即使这意味着带上我家人的一个朋友,让他们在屏幕前提问或观察他们的行为。

眼动追踪不会告诉您用户在看什么,他们是否了解它是什么。如果他们感到沮丧犹豫或只是欣赏图形构图。

一本可以帮助你的好书是史蒂夫克鲁格的火箭手术

正如 koiyu 在评论中提到的那样,眼动追踪是您应该追求的。您可以创建旨在引导用户沿着一条路径进行的设计,但真正了解您是否实现目标的唯一方法是进行眼动追踪研究。

也就是说,您可能会发现我的回答对“如何引起对设计的特定区域的关注? ”这个问题很有用。这不是完全相同的问题,但很接近。

更多眼动追踪资源:

眼动追踪服务:

这是一个快速提示:包括一个人看着或指向您的目标对象的图像(例如产品、订阅按钮)。这是广告中的一个示例,但我在网页上看到了相同的策略: 防晒霜示例

(来源:http ://www.grokdotcom.com/2007/10/04/how-a-pretty-face-can-push-visitors-away/ )

我可以想到两种简单的方法来引导用户关注网站:

  1. 在页面元素上使用明显的编号。你可以在很多网站主页上看到这一点,或者你可以参考金融网站上的这个 PDF 文件(虽然我认为这不是一个很好的例子)。
  2. 使用箭头来引导用户的注意力。这可能类似于流程图。不过,我现在想不出任何在线示例。