bts防弹少年团演唱会

bts防弹少年团演唱会

数字营销人员的视觉提示指南

《数字营销人员的视觉提示指南》

着陆页优化的很大一部分是将访问者的注意力集中在重要的事情上。

关于如何做到这一点有很多%E8%AE%BE%E8%AE%A1%E7%90%86%E8%AE%BA“>

视觉线索在经验心理学研究和实际案例研究中有很强的根源。 此时,有大量关于它们工作原理,工作方式以及如何根据具体用例使用它们的数据。

什么是Visual Cue?

广义上,视觉线索是一种由眼睛处理的感觉提示。 它们提供有关如何感知世界或特定体验的信息和见解。

当你在现实世界中与销售人员交谈时,有许多视觉线索 – 比如微小的面部表情,肢体语言和微妙的抽搐 – 告诉你他们是真的,还是只是试图为你的钱包做一个冲刺。

%E9%A9%AC%E5%B0%94%E7%A7%91%E5%A7%86%C2%B7%E6%A0%BC%E6%8B%89%E5%BE%B7%E5%A8%81%E5%B0%94%E7%A7%B0%E4%B9%8B%E4%B8%BA“>

《数字营销人员的视觉提示指南》

在数字营销的背景下,视觉提示是用于引导注意力或使用可视通信方法巧妙地描绘消息的元素。

这些定义听起来颇具学术性,但如果你要看一个,你肯定知道一个视觉提示。 这是一个例子:

《数字营销人员的视觉提示指南》
%E5%9B%BE%E5%83%8F%E6%9D%A5%E6%BA%90“>

视觉提示是一个广义的术语,但如果您是UI / UX设计师,您可能熟悉术语“方向提示” .Unbounce%E5%B0%86%E6%96%B9%E5%90%91%E6%8F%90%E7%A4%BA%E5%AE%9A%E4%B9%89%E4%B8%BA“>

通常有两种类型的方向线索:

  • 明确的
  • 隐含(或暗示)

“明确的线索采用箭头或线条的形式,而暗示线索使用图像巧妙地指导你的潜在客户的目光,”Unbounce解释道。

为什么视觉提示有效?

当有人登陆你的页面时,他们会做出非常快速的初步判断,无论他们是否有意识地意识到这一点。

人们做出快速判断。 %E5%8F%AA%E9%9C%80%E5%8D%81%E5%88%86%E4%B9%8B%E4%B8%80%E7%A7%92%E5%B0%B1%E5%8F%AF%E4%BB%A5%E5%BD%A2%E6%88%90%E5%85%B3%E4%BA%8E%E4%B8%80%E4%B8%AA%E4%BA%BA%E7%9A%84%E7%AC%AC%E4%B8%80%E5%8D%B0%E8%B1%A1%EF%BC%8C%E7%BD%91%E7%AB%99%E4%B9%9F%E4%B8%8D%E4%BE%8B%E5%A4%96%E3%80%82″>

第一印象取决于许多因素:结构,颜色,间距,对称性,文本数量,字体等。

设计是无意识感知的关键

第一印象是94%的设计相关。 无论如何,在分析不同的设计和信息内容因素如何影响在线健康网站的信任时,这就是%E8%8B%B1%E5%9B%BD%E7%A0%94%E7%A9%B6%E4%BA%BA%E5%91%98%E6%89%80%E5%8F%91%E7%8E%B0%E7%9A%84“>

该研究清楚地表明,网站的外观和感觉是第一印象的主要驱动力。 到目前为止,视觉吸引力和网站导航对人们对网站的第一印象影响最大。

在斯坦福大学可信度专家进行的Consumer” webwatch>中发现了类似的结果。 他们发现,人们他们是如何评价一个网站的信任,以及他们如何真正做到这一点是不同的。

数据显示,普通消费者更关注网站的表面方面,如视觉线索,而非内容。 例如,该研究中近一半的消费者(或46.1%)评估了网站的可信度,部分原因在于网站整体视觉设计的吸引力,包括布局,排版,字体大小和配色方案。

%E8%87%AA%E4%B8%8A%E8%80%8C%E4%B8%8B%E7%9A%84

我们是%E4%BF%A1%E6%81%AF%E6%90%9C%E7%B4%A2

《数字营销人员的视觉提示指南》

从本质上讲,我们使用过去的经验和启发式方法处理视觉刺激,以形成我们的感知。 正如%E7%AE%80%E5%8D%95%E5%BF%83%E7%90%86%E5%AD%A6%E6%80%BB%E7%BB%93%E4%BA%86%E8%BF%99%E4%B8%80%E5%8E%9F%E5%88%99“>

《数字营销人员的视觉提示指南》
%E5%9B%BE%E5%83%8F%E6%9D%A5%E6%BA%90“>

因此,当您感知到标记页面元素(如箭头,强调文本框,对比元素或指向或查看CTA的人)时,您可以通过过去的体验处理这些元素。 箭头指向通常是将注意力引向某事物的提示,因此它也可以在线翻译。

如何使用Visual Cues来改善用户体验

视觉提示通过优化注意力来改善用户体验。 而已。

他们巧妙地或不巧妙地将用户带到期望的行动。 你怎么知道在哪里实现视觉线索? 值得信赖的旧转换研究。 也就是说,这是%E7%83%AD%E5%9B%BE%E5%8F%AF%E4%BB%A5%E6%B4%BE%E4%B8%8A%E7%94%A8%E5%9C%BA%E7%9A%84%E5%9C%B0%E6%96%B9%E3%80%82″>

《数字营销人员的视觉提示指南》

视觉提示对于所谓的“虚假底部”也是一个有用的解决方案。

%E8%99%9A%E5%81%87%E5%BA%95%E9%83%A8%E9%80%9A%E5%B8%B8%E4%B9%9F%E8%A2%AB%E7%A7%B0%E4%B8%BA%E9%80%BB%E8%BE%91%E7%BB%88%E7%BB%93%E5%92%8C%E5%AE%8C%E6%95%B4%E6%80%A7%E7%9A%84%E5%B9%BB%E8%A7%89%E3%80%82″>

在折叠处通常会有一个自然的下降点,但应该调查任何其他硬停止点。 您还可以过滤用户,这样您就不会分析立即反弹的垃圾流量。

另一种方式,更昂贵和时间密集,是运行%E7%9C%BC%E5%8A%A8%E8%BF%BD%E8%B8%AA%E6%B5%8B%E8%AF%95“>

《数字营销人员的视觉提示指南》

一旦找到需要改进的区域,您仍然需要选择要实施哪种类型的视觉提示以及如何实施。 以下是流行视觉提示策略的一些例子……

视觉提示的例子

以下大多数都是方向提示,例如箭头显示某个方向上有更多内容。 有些会更加微妙,比如封装表单以引起注意。

但是所有这些都有效地引起了对某些所需用户行为的注意。

箭头

箭头是一种流行且引人注目的视觉提示(对于看起来像垃圾邮件的例子而言很抱歉):

《数字营销人员的视觉提示指南》

它们倾向于用于指向CTA或表单,或者将您推向目标网页。 这是前者的一个例子:

《数字营销人员的视觉提示指南》

在后一种情况下,强大的方向线索是上下文的,并为您的访问者回答以下问题……

  • 这一点下方或旁边是否有内容?
  • 这些内容对我来说是否有趣/有价值?
  • 我可以期待滚动多长时间?

Shanelle Mullin在%E8%BF%87%E5%8E%BB%E7%9A%84%E4%B8%80%E7%AF%87CXL%E6%96%87%E7%AB%A0%E4%B8%AD%E7%BB%99%E5%87%BA%E4%BA%86%E4%B8%80%E4%B8%AA%E5%BE%88%E5%A5%BD%E7%9A%84%E4%BE%8B%E5%AD%90%EF%BC%9A”>

《数字营销人员的视觉提示指南》

屏幕底部有一个箭头的开头。 当你开始滚动时,这是你看到的:

《数字营销人员的视觉提示指南》

非常强大的方向线索,可以将您拉向页面的线性方向。

另一个例子来自Instapage登陆页面。 没有箭头,如果没有标题的上下文,很难看到下面有更多的内容:

《数字营销人员的视觉提示指南》

直接指向

与箭头类似的是人类指向方向提示。 同样,这通常用于强调消息,表单或CTA。 这是我们的旧主页:

《数字营销人员的视觉提示指南》

然后这是Basecamp的一个例子( %E7%94%B1Pagewiz%E5%85%B1%E4%BA%AB“>

《数字营销人员的视觉提示指南》
%E5%9B%BE%E5%83%8F%E6%9D%A5%E6%BA%90“>

三角形

三角形与箭头几乎相同,但更微妙:

《数字营销人员的视觉提示指南》

返回顶部按钮是博客和长篇内容的流行迭代。

您想什么时候回到顶部? 通常当你触及页面底部时。 使用与访问者滚动的返回顶部按钮可能会有所帮助,但如果您不小心,它可以轻松地指示页面的末尾。 过渡线索变得更加重要。

如果您是常规的CXL阅读器,那么您熟悉我们的返回顶部按钮,在您阅读时会跟随您。

《数字营销人员的视觉提示指南》

由于我们的大多数文章长度在1,500-3,500字之间,因此返回顶部按钮是有意义的。

此外,鉴于我们网站的性质,假设您没有到达页面的末尾是相对困难的。 如果您正在扫描,则可以使用滚动条查看剩余的内容。 如果你正在阅读,你不会认为文章的结尾是“网站在所有浏览器中看起来都不错吗? 在所有设备上?“由于它是一个博客,当你到达作者简介和评论时,你会期望页面即将结束。

三角形通常用于可用性目的非常微妙。 WordPress使用它作为缩进,让您知道您当前所处的标签:

《数字营销人员的视觉提示指南》

水平导航提示

%E6%A0%B9%E6%8D%AENN” g> ,在水平滚动的情况下,即使是强烈的箭头线索也常常被忽视。 人们期望垂直滚动,而不是横向滚动。 横向滚动违背了他们公认的网站内容和行为范例。

《数字营销人员的视觉提示指南》
%E5%9B%BE%E5%83%8F%E6%9D%A5%E6%BA%90“>

这可能随着移动设备和平板电脑的使用增加而不断发展,但无论如何,都可以通过强大的视觉提示来帮助它。

Instapage%E7%BB%99%E4%BA%86%E5%85%B6%E4%B8%AD%E4%B8%80%E4%B8%AA%E5%BE%88%E5%A5%BD%E7%9A%84%E4%BE%8B%E5%AD%90

《数字营销人员的视觉提示指南》
%E5%9B%BE%E5%83%8F%E6%9D%A5%E6%BA%90“>

人类视觉线索

营销人员知道在广告中使用%E4%BA%BA%E7%89%A9%E5%9B%BE%E5%83%8F%E6%9C%89%E5%8A%A9%E4%BA%8E%E5%A2%9E%E5%8A%A0%E5%8F%82%E4%B8%8E%E5%BA%A6%EF%BC%8C%E5%B9%B6%E4%B8%94%E9%80%9A%E5%B8%B8%E4%BC%9A%E5%AF%B9%E5%B9%BF%E5%91%8A%E4%BA%A7%E7%94%9F%E6%83%85%E7%BB%AA%E5%8F%8D%E5%BA%94%E3%80%82″>

《数字营销人员的视觉提示指南》

这也被称为deictic%E5%87%9D%E8%A7%86%EF%BC%8C%E5%AE%83%E7%9A%84%E4%BD%9C%E7%94%A8%E6%98%AF%E5%9B%A0%E4%B8%BA%EF%BC%8C%E6%AD%A3%E5%A6%82

Neville” medhora> ,在他的网站上,他使用自己的图像作为英雄镜头,这也是一个方向线索的一个很好的例子(他正在看电子邮件选择加入)…

《数字营销人员的视觉提示指南》

%E5%87%A1%E5%A6%AE%E8%8E%8E%E8%8C%83%E7%88%B1%E5%BE%B7%E5%8D%8E%E5%85%B9%E5%BE%88%E5%A5%BD%E5%9C%B0%E8%BF%90%E7%94%A8%E4%BA%86%E5%A5%B9%E7%9A%84

《数字营销人员的视觉提示指南》

这是来自ACLU%E7%9A%84%E5%8F%A6%E4%B8%80%E4%B8%AA%E6%9C%80%E8%BF%91%E7%9A%84%E4%BE%8B%E5%AD%90%EF%BC%8C%E5%B0%BD%E7%AE%A1%E4%BD%BF%E7%94%A8%E7%89%B9%E6%9C%97%E6%99%AE%E4%BD%9C%E4%B8%BA%E5%AF%B9%E6%8A%97%E4%BB%96%E7%9A%84%E4%B8%80%E7%A7%8D%E8%A1%8C%E5%8A%A8%E7%9A%84%E5%8F%B7%E5%8F%AC%E8%A1%8C%E5%8A%A8%EF%BC%8C%E4%BD%86%E4%BB%96%E4%BD%BF%E7%94%A8%E4%BA%86%E7%89%B9%E6%9C%97%E6%99%AE%E5%87%9D%E8%A7%86%E6%8D%90%E8%B5%A0%E6%8C%89%E9%92%AE%E7%9A%84%E5%BD%A2%E8%B1%A1%EF%BC%9A”>

《数字营销人员的视觉提示指南》

然后是来自BarkBox%E7%9A%84%E8%BF%99%E4%B8%AA%E4%BE%8B%E5%AD%90%EF%BC%8C%E5%AE%83%E4%B8%8D%E6%98%AF%E7%9C%9F%E6%AD%A3%E7%9A%84%E4%BA%BA%E7%B1%BB%EF%BC%8C%E4%BD%86%E5%81%9A%E5%90%8C%E6%A0%B7%E7%9A%84%E4%BC%8E%E4%BF%A9%EF%BC%9A”>

《数字营销人员的视觉提示指南》
%E5%9B%BE%E5%83%8F%E6%9D%A5%E6%BA%90“>

封装/重点

%E6%AD%A3%E5%A6%82Elisa” silverman> ,“将重要的副本封装在一个独立的区域内也会突出该区域以获得特别关注。”

Instacart的这个例子非常清楚地描绘了相关的英雄镜头以及开始购买过程的中心表格字段。

《数字营销人员的视觉提示指南》

封装是更微妙的视觉提示的另一个例子。 它并不像手绘箭头那样引人注目,但是如果执行得当,可以非常有效地提高对形式和驾驶转换的注意力。

哪个视觉提示效果最好?

你有它:视觉提示,以正确的方式完成,可以改善用户体验,反过来增加转换。 但是当你考虑到可用的大量不同类型的视觉线索时,事情就变得复杂了。

你可以使用箭头,线条,人物照片,边框,指点,明亮的横幅,感叹号,复选标记……列表还在继续。 哪种视觉线索效果最好?

我们很好奇,所以我们通过CXL%E7%A0%94%E7%A9%B6%E6%89%80%E8%BF%9B%E8%A1%8C%E4%BA%86%E4%B8%80%E9%A1%B9%E7%A0%94%E7%A9%B6%E3%80%82″>

为了进行这项研究,我们对六幅改变的图像进行了眼动追踪测试

《数字营销人员的视觉提示指南》 《数字营销人员的视觉提示指南》 《数字营销人员的视觉提示指南》 《数字营销人员的视觉提示指南》 《数字营销人员的视觉提示指南》 《数字营销人员的视觉提示指南》

我们查看了固定在表单上的平均时间和首次固定表单的平均时间。 我们还做了一个测试后的问题,问道:“考虑到你刚看到的网页,你下一步要与这家律师事务所取得联系的是什么?”

如果参与者回答说他们会填写表格以与公司联系,那么视觉提示被认为有效地引导注意形式,从而增加了召回的可能性。

所以发生了什么事?

  • 视觉提示确实影响了用户关注表单的程度。
    • 手绘箭头导致表格上的时间最长。 《数字营销人员的视觉提示指南》
    • 远离形态的人看起来最短。 《数字营销人员的视觉提示指南》

因此,虽然每个站点都不同,但这里有一些经验数据表明您应该测试手绘方向对象(例如箭头)以引导用户注意。

此外,如果您使用人的图像作为视觉提示,请让此人朝CTA或关键特征的方向看。 在注视时间方面,人类视线是最差的。

何时最佳实践失败(或避免什么)

实际上只有一种启发式方法可以遵循,虽然这是一种困难的,也许是主观的:视觉提示不会帮助用户进行所需的操作,只会分散注意力。

它类似于旧的格言,“完美是在没有更多的东西可以实现的时候实现的,但是当没有什么可以带走的时候。”

在实施视觉提示时,不要发疯:让你的目标引领你的设计。 并不总是遵循%E2%80%9C%E6%9C%80%E4%BD%B3%E5%AE%9E%E8%B7%B5%E2%80%9D%E3%80%82“>

虽然图像或视觉线索本身可能会引起更多关注,但如果它们与页面的主要目的无关或分散注意力,则可能会造成损害。

研究表明, %E4%BA%BA%E4%BB%AC%E7%A1%AE%E5%AE%9E%E7%9C%8B%E5%88%B0%E4%BA%86%E5%85%B6%E4%BB%96%E4%BA%BA%E6%AD%A3%E5%9C%A8%E5%AF%BB%E6%89%BE%E7%9A%84%E5%9C%B0%E6%96%B9“>

在这个来自Felix + Iris的例子中,观察CTA /值道具的人类图像表现比产品图像差:

《数字营销人员的视觉提示指南》
%E5%9B%BE%E5%83%8F%E6%9D%A5%E6%BA%90“>

视觉处理很复杂,必须进行测试。 没有银弹(甚至没有银色的手绘箭头)。

由于我们处理图像的速度比文本快得多,因此您可以通过照片传达大量信息,但需要谨慎小心地使用它们,因为错误使用的照片的磁性最终可能会分散注意力。

在选择照片时,请考虑图像如何强化或分散您独特的价值主张。 如果你的价值主张是围绕情感,那么面孔就可以很好地运作。 如果没有,请考虑产品拍摄或信息图形。

结论

视觉线索是有效设计的关键部分。 它们可以用于引导某个方向的注意力,强调关键元素,并激发行动。

与UX或CRO相关的许多东西一样,它是艺术的一部分和科学的一部分。 有效的目标网页设计有很多创意,但我们有大量的数据来建议最佳实践(如上面的研究)。

当然,你必须为自己测试一切(没有人的观众是完全一样的,他们也不会以同样的方式回应)。

相关文章

点赞

发表评论

电子邮件地址不会被公开。 必填项已用*标注