设计出品
扫描关注网站建设微信号

扫一扫微信二维码

网站建设如何正确使用图像轮播?

新乡云优化2020-10-29Feed流
网站建设如何正确使用图像轮播?
我忘记了试图抓住网站上正在运行的幻灯片的次数。试图匆匆阅读另一张幻灯片接管之前写的内容真是太烦人了。现在,除了图像轮播的第一张幻灯片,我什至不必再扫描任何东西。
我以为我是唯一无法忍受这些自动滑块的人。但是感谢上帝,还有其他像我一样的人!这些幻灯片只会以负面的方式影响网站上的转化和整体用户体验。
NielsenNorman小组进行的可用性研究[1]证实,自动转发轮播会激怒用户并降低可见度。
网站建设如何正确使用图像轮播?
这项研究强调了以下几个原因,这些被认为是“酷”的设计元素实际上不利于您网站的可用性或转换:
自动轮换使用户无法控制与站点的交互。对于有运动技能问题的用户而言,这尤其令人讨厌。
它们造成横幅盲目性,通常容易被用户忽略。下面来自另一个来源的眼睛跟踪示例也对此进行了验证。您可以看到图像滑块(图片中的黑色区域)几乎不会引起站点访问者的注意。
眼动追踪研究表明,图像轮播被访问者忽略
网站建设如何正确使用图像轮播?
低文化素养的用户和国际用户(其母语与您网站上的语言不同)通常读起来很慢。用户说“我没有时间阅读它”时,清楚地表达了他对研究的挫败感。它一直闪烁太快。”
我想知道这些滑块是否对许多其他用户如此迷惑和烦人,为什么它们几乎无处不在?打开一些电子商务网站,您就会知道。
事实证明,通常认为图像轮播或旋转横幅是一种简便的解决方案,可以为站点上的所有重要内容/要约提供更好的导航。数据表明并非如此。
圣母大学测试了他们的轮播。下表显示了他们找到的结果。总访问者中只有1%的人点击了该轮播,而这些访问者中的大多数(84%)仅与该轮播的第一张幻灯片进行了互动。
第一张幻灯片之后,流量急剧下降
网站建设如何正确使用图像轮播?
好吧,我明白了!每个部门都希望在主页上提供特殊优惠。
当然,旋转木马是使每个人都开心的简单方法。
但坦率地说,占据主要首页房地产的点击率只有1%,这显然是在浪费精力。您是否仍然认为图像滑块是个好主意?
除了带来可用性挑战之外,轮播还会将多个要约放在一个地方,这是一个巨大的转换杀手。就像经过验证的转换智慧所建议的那样,理想情况下,每页只应有一个报价或号召性用语。旋转木马肯定是这里的罪犯。
太多的报价只是说:“我们不知道什么是我们的头等大事,因此我们将它们全部丢到这里,看看哪一个效果最好。”大家起来,承担起一些责任!在继续操作之前,请确定报价的优先级。
做完了吗
网站建设如何正确使用图像轮播?
好吧,现在,如果您准备通过这种相当有害的“标准做法”,可以尝试以下几种图像轮播替代方案...
将首页集中在主要报价上
尽力而为。让您最相关的报价吸引您的访客的注意力。并添加一些全年都能为您带来良好效果的优惠。您可以在他们的主页上看到BenSherman的实现方式:
本·谢尔曼(BenSherman)只关注一个报价
在上图中,只有开拓者的报价才是参观者在折页上方看到的。
网站建设如何正确使用图像轮播?
不要让您的网站看起来像是ho积的促销活动。您不必保留先前促销的所有优惠。就像保罗·菲利普斯(PaulPhillips)在他的一篇文章中提到的那样,每个报价都有有效期。
将每个幻灯片转换为针对特定访问者细分的目标主页
假设您有一家在线服装店。现在,各国的服装趋势往往不同。因此,您可以借助A/B测试软件根据访问者的地理位置对访问者进行细分。
向他们显示主页,以宣传有关其国家最受欢迎的服装趋势的信息。这是“一刀切”的图像滑块解决方案的绝佳替代品,该解决方案可显示4张幻灯片,其中3张更适合美国的趋势(因为80%的流量来自美国),并且1张幻灯片适用于英国。
但猜猜怎么了?可能您正在传播其他国家/地区的访问者的偏好。因此,即使您已尽力将所有产品运送到这些国家/地区,您为这些国家/地区进行的转换仍然很差。
网站建设如何正确使用图像轮播?
与其向您的访客展示一个不断旋转的图像滑块,而不是为您获得流量最多的5个主要国家/地区列出每幅幻灯片甚至一个报价,为什么不删除那该死的滑块,而只向访客展示它,而不是他们的特定位置报价?只需单击几下,您就可以轻松地在VWO中使用预设的细分进行设置。
正如电子商务和数字专家DepeshMandalia在此eConsultancy文章中正确引用的:
一条重点突出的横幅广告将带来比少数未重点突出的横幅更高的点击率。在不了解他们的情况下,几乎不可能为100%的访客提供服务,但是内容管理者似乎会自我劝说,选择多才是好=更多的点击=更多的销售。那样行不通。
不够?太固执,不是吗?
因此,即使您在听完所有这些原因后仍要继续进行此操作,请按照丝芙兰的方式进行:
请参见丝芙兰主页上的以下图片:
丝芙兰的超棒图像滑块执行
网站建设如何正确使用图像轮播?
现在这是不言而喻的,这是我在互联网上看到的图像滑块的最佳执行方式之一。如此出色的一些原因:
他们将轮播仅限于2张幻灯片
加载速度超快
滑块是手动的,不会自动旋转
小心地将侧面清楚的导航按钮放在白色覆盖层上,以便于查看
幻灯片中显示的两个优惠与其完整的目标市场相关,而不仅仅是特定的访客角色(例如十几岁的女孩或40岁以上的女性)
如果您认为可以像丝芙兰一样完成此任务,那么一定要继续尝试一下。
尽管所有的转换专家,包括PeepLaja[2],TimAish[3]和ChrisGoward[4]都严格建议您摆脱图像滑块,但我认为该规则有一个小例外。那就是摄影网站,可以在其中使用滑块来显示图片组合。
但这并没有改变这样一个事实,即移动的UI元素以其声誉而臭名昭著,只是分散注意力。因此,即使您打算在摄影网站上使用图像轮播,也请确保幻灯片频率不太快。每张幻灯片大约4-5秒应该没问题。当然,可以增强访问者的能力。给他们控制权。以下来自皇家邮政的回旋就是一个很好的例子:
网站建设如何正确使用图像轮播?
皇家邮政轮播上的暂停和播放按钮
查看如何在转盘上突出显示暂停和播放按钮,以适合用户的偏好。为了使主要号召性用语永久停留在滑块上而不是旋转图像的一部分,需要多花一个钱。
重要要点
不要使用图像滑块
但是,让我们承认–这些旋转的横幅很快就不会出现在任何地方。多亏牛群的心态[5]!因此,如果确实需要,这里是您应牢记的简要概述:
快速加载时间
保持滑动频率慢
让用户控制放映(提供暂停和播放按钮,或者保持图像旋转手动而非自动)
网站建设如何正确使用图像轮播?
您的幻灯片导航选项必须非常醒目且明显(在白色叠加层上的两边的巨大箭头都可以正常工作。埋在图像滑块角中的小点不起作用)
幻灯片上的优惠必须与您的整个目标受众相关(而不仅仅是特定的访问者角色)
幻灯片数量越少越好。
无论您尝试使用哪种图像滑块替代方法,都不要忘记对其进行A/B测试。即使您100%确信治疗页面会增加转化次数,也请对其进行测试,以查看它比“控制”页面意味着多少百分比的提高。而且,请务必回到这里与我分享您的经验。
文章关键词