15+ 种有效的弹出式设计策略来获得灵感
已发表: 2021-10-28弹出式设计的重要性
关于弹出窗口的有用性有多种想法。 一些人认为,由于不需要的消息,弹出窗口会在您的网站上造成糟糕的用户体验。 但是,其他人认为弹出窗口是吸引访问者注意力并鼓励他们在您的网站上行为的最佳营销工具之一。 事实上,两者都是对的。 弹出窗口是一把双刃剑。 它们既可以提高您的转化率,又可以破坏您网站的客户体验。 这就是为什么在使用弹出窗口时有一个好的策略很重要。 一个好的策略是有好的弹出窗口设计,使用有吸引力的内容,并在正确的时间显示弹出窗口。
弹出窗口设计的最佳实践是什么?
以下是为您的网站创建弹出窗口时要遵循的最佳弹出窗口设计实践的综述。 为了更好地理解,我提供了每种做法的示例。
1.根据用户细分个性化您的弹出窗口
进行用户细分和个性化将帮助您的访问者更好地参与您的内容。 毫无疑问,如果您显示一个弹出窗口,其中包含访问者最近看到的产品并且没有以优惠的价格购买,那么它的性能将比提供任何随机产品的弹出窗口好得多。 您还可以通过访问者的名字来称呼他们,以吸引他们的注意力。 地理位置个性化也是吸引游客的好方法。

2. 明确你的目标
每个弹出窗口都有一个目的。 您可能想要获取访问者的电子邮件并收集潜在客户,提供特定产品或折扣券,显示用户可能感兴趣的特定内容等等。 最好只考虑一个弹出窗口的目标,并根据弹出窗口的目标确定显示的副本、设计和时间。

3.考虑整个网站设计
弹出窗口应与网站其余部分的设计相匹配。 您不应该让访问者觉得弹出窗口有些突兀。 因此,您应该将样式、颜色、版式与网站的其余部分相匹配。

4. 使用有针对性和吸引力的 CTA
如上所述,弹出窗口应该有一个明确的目标,即您希望用户在与弹出窗口交互后会采取什么行动。 对于大多数弹出窗口,您应该只有一个带有吸引人的文本和设计的 CTA 按钮,以吸引访问者进行您想要的操作。 尝试发挥创意以制作诱人的 CTA。

5.尝试各种弹出窗口
我鼓励您使用不同类型的弹出窗口来测试哪些弹出窗口真正适用于您的情况。 每种类型都有自己的优点和缺点。
弹出窗口
这种弹出窗口出现在页面内容顶部的页面中间,通常会阻止您执行任何操作,直到您关闭弹出窗口。 虽然这种弹出窗口非常流行且引人注目,但它可能会给用户带来不好的体验并导致他们离开网站。

滑入式
此弹出窗口通常从屏幕底部滑入,并且由于它不会阻止内容,因此更加用户友好。 但是,用户错过弹出内容的可能性更大。

酒吧
此弹出窗口也称为公告栏,位于页面底部或顶部,通常在您想要宣传销售活动或向访问者传递重要信息时使用。 条形弹出窗口的用户体验更积极,因为它们只占用屏幕的一小部分区域。 如果您使用与您的网站形成鲜明对比的颜色,栏弹出窗口也可以引人注目。

6. 使用图片来吸引访客
在设计弹出窗口时,没有什么比高质量和相关的照片更能吸引用户的注意力了。 用户通常无法阅读文本和观看视频。 然而,几分之一秒内令人印象深刻的图像可以引起他们的注意。 因此,在弹出式设计中保持所有图形和图像质量尽可能高。

7.通过诱人的报价产生潜在客户
产生潜在客户是使用弹出窗口的最常见原因之一。 如果您不提供好的报价,您将不会收到很多提交。 因此,尝试提供一些诱人的东西以换取提交用户的电子邮件地址。


8.使用定时弹出窗口来增加转化
FOMO(害怕错过)方法是一种很好的做法,可以增加访客转化的机会。 当您无限期地提供某物时,访问者不会采取行动。 因此,请尝试在您的弹出窗口中提供限时优惠,以使访问者快点采取行动。

9. 消除访客对 CTA 的恐惧
在弹出式设计的这一部分中,您必须让应用程序用户相信您不会打扰他们。 用户害怕促销邮件太多,可能不会与您合作。
但是,如果您向他们保证您每个月只发送一定数量的电子邮件,就会减轻他们的担忧。 最好将此注释直接放在 CTA 按钮下方。

10.考虑移动用户
不要忽视这样一个事实,即您的弹出窗口不仅仅针对计算机用户显示。 如今,移动用户多于桌面用户。 您的设计与智能手机环境不兼容会导致您失去大量潜在受众,并导致糟糕的用户体验。 您可以在设计弹出窗口时检查移动兼容性。

11.使用退出弹出窗口让访问者留在您的网站上
通过使用退出弹出显示操作,您将使用户在您的网站上花费更多时间。 这将进一步提高您网站的生产力。 退出意图弹出窗口是您将访问者留在网站上并在您的网站上执行您想要的操作的最后努力。

12.使用几何元素来吸引注意力
几何形状的使用吸引了用户的视觉注意力。请记住,过度使用图形会使您的设计变得拥挤和烦人。 一定要保持平衡。

13.使用对比度好的颜色
颜色也是用户在访问网站时获得的第一视觉印象之一。 使用具有良好对比度的和谐调色板更有效。 考虑到这些小技巧,最终的结果令人惊叹。

14. 要求更少的信息来提高转化率
您应该只收集订阅表格等表格中的必要信息。 您拥有的输入字段越多,愿意填写并提交表单的访问者就越少。

15.为您的弹出窗口选择正确的字体
如果您对在您的网站中使用哪种字体有疑问,最好使用您网站上最常用的字体。 尝试在标题中使用创意字体来吸引访问者,并在复制内容中使用您在网站中使用的普通字体。

Growmatik 如何提供帮助
Growmatik 是一种营销自动化工具,可以帮助您在 WordPress 中创建有效的弹出窗口。 Growmatik 中包含一个带有现成模板的可视化弹出窗口构建器。 要访问弹出窗口构建器,只需导航到仪表板中的工作室,选择弹出窗口,然后单击创建弹出窗口按钮。 它会打开一个窗口,您可以在其中找到预先设计的弹出窗口。 您可以选择编辑或创建一个新的。

只需点击几下,Growmatik 弹出窗口就可以根据许多不同的条件实现自动化。 最后,任何弹出窗口的性能分析和数据都可用,这使您可以根据最佳性能优化和调整弹出窗口。

包起来
使用上面提到的做法并将它们组合在一起,在您的网站上形成一个可靠的弹出式设计策略。 不要忘记使您的弹出窗口个性化并使您的弹出窗口设计多样化,以满足所有用户群。 为不同的用户群创建弹出窗口将帮助您提高转化率。 设身处地为访问者着想,并确保此弹出窗口是您希望在本网站上看到的内容。