如何使用 Elementor 获得正确的英雄横幅

英雄横幅应该是您主页的关键部分。 视觉效果加上诱人的内容必须成为访客一生中最重要的 3 秒（不包括他们的猫站起来的时间）。 横幅可以包含强大的标题、令人敬畏的图像、诱人的片段和号召性用语，所有这些都旨在引导访问者继续前进。

或者你可以跳过横幅而不用打扰 CTA 按钮。 如果您想冒险让浏览者在 0.001 秒内离开您的网站，那就太好了。

正确使用横幅在奖励访问者的时间方面有很大的不同。 向他们保证他们做出了正确的访问决定。 想想商店里的产品包装； 如果它传达了内心不可抗拒的东西，那么你更有可能拿起它。 吸引兴趣是横幅的关键。

登陆域名 Unicorns.com 后，却发现一个充满熔岩 GIF 的页面将不可避免地导致失望和失去信任。

在创建有效的英雄横幅时，经验给我带来了 5 个很棒的技巧，这些技巧构成了我的清单。 我敢错过一步——我想不会！

提示 1：创建英雄横幅的理想时机

在标题（或 Elementor 模板）被锻造后，我将立即处理横幅。 在这上面花费过多的时间并不会打扰我，因为它有助于定义将在整个站点中继续进行的消息传递。

如果横幅通知查看者您是一位获奖建筑师，那么下一部分最好对其进行备份，而不是在页面上放置与您的内容无关的图像。 如果内容与包装不同，您会再次购买产品吗？ 当然不是。

横幅允许您设置接下来发生的事情的窗口，它将影响内容和其他页面的决策。 英雄旗吊着胡萝卜，现在服务就是饭！

此横幅展示了客户对数字技术的使用，而不会显得复杂或与标题对社交媒体营销的关注相冲突。 我们选择了使用移动设备来增加相关性的企业，而不是技术含量高的形象。

提示 2：图像大小和响应能力很重要

如果您关心用户体验，那么图像大小和响应能力至关重要。 根据您选择的图像工具，至少 1920 像素 x 1080 像素的横向布局应该是起点。 寻找最佳分辨率，将您的大脑锁定在网站的配色方案上。 如果网站的颜色主题是红色，那么除非您计划产生高对比度的效果，否则请避免使用蓝色暗示图像。 并且请不要回避图像压缩。 永远记住在需要时将 PNG 转换为 JPG 或最终的 WebP 格式。

在决定滚动还是固定时，在横幅内设置图像非常有趣。 谁没有花时间玩这些选项？ 尽管如此，请始终注意内部的措辞和图像应该相互补充。

崇高的形象与品牌产生共鸣，应该足以吸引游客想要深入挖掘。 无论屏幕有多大，巧克力都在头条新闻后面站稳脚跟，不会争取注意力。

仅仅因为它适用于桌面，当移动视图上的图像失去效果时，很容易耸耸肩。 别担心； Elementor 能够为移动版本添加备用图像，从而避免在移动设备上创建单独的部分。

在移动模式下，单击该部分的背景图像，然后添加适当大小的图像。 我的快速提示是添加原始图像的副本，然后使用 WordPress 的缩放和裁剪调整大小以获得纵向布局。

与 1920 像素 x 1080 像素的桌面图像相比，移动视图的背景图像的备用尺寸为 400 像素 x 700 像素，以便更好地展示标题。 响应性也应该始终包括字体大小，我建议使用 REM 而不是像素来调整大小，以使横幅的内容更易于访问。 以下是基于备用图像的最终结果。

提示 3：滑块和旋转木马应该在折叠下方而不是横幅上看到

[Drumroll] 尽管我坚信十年前突出的滑块时代不推荐用于英雄横幅，但这种争论仍在继续。

[Fights off the onslaught] 等等，滑块仍然可以应用于主页的其他地方，尤其是在折叠下方（在您向下滚动设备之前的页面底部）。 滑块会导致页面加载延迟，即使加载速度非常快，查看者也可能需要观看许多幻灯片才能获得完整的信息。 你可能会在他们到达谷仓风暴高潮之前失去他们的兴趣，更不用说你有足够强大的短语和图像来保持势头吗？

我们是否需要三张幻灯片来简单地说明“我们将向您展示如何通过 3 个简单的步骤跳舞”？ 并想象观众在幻灯片 1 之前看到幻灯片 2； 好吧，那样的话，顺序就全乱了。

我们在一个网站上工作，该网站的图像颜色和质量千差万别，以至于指定的 12 张幻灯片让我发疯。 仅仅因为其他 20 个站点这样做并不意味着您需要遵循该路径。 如果证据确凿，那么继续，但要注意它会增加速度的滞后。

我挑战你用折叠上方和下方的滑块检查分数，差异会很明显。 这同样适用于视频背景或动画 GIF，其中延迟加载已应用于所有图像； 你会看到 % 分数下降。

提示 4：页面速度和 3 秒转换的重要性

不优化图像会损害主页的加载，从而导致页面速度得分下降，并最终导致访问者留在网站上。 带有重型横幅、大量滑块和多种字体系列的主页会增加违反 3 秒规则的可能性。

模棱两可的评论也会影响转化。 当横幅不符合将查看者引导至您网站的原因时，信任等式就会消失。 仔细选择你的措辞。 保持重点。 吸引他们的兴趣走得更远。

谷歌了解人类的不耐烦，因此 Core Web Vitals 的兴起。 当我构建部分时，我不禁定期测试页面分数。 优化图像、确保预加载字体以及不抛出大量文本可能会阻止访问者在到达时跳船。

一次又一次，我会看到一些悬而未决的事情，因为网站的桌面得分达到了 98+%，尽管您想尽一切努力使移动设备得分达到 90+%，因为 70% 的观众来自这样的网站设备。

折叠上方发生的事情会显着影响分数，这就是为什么我建议将滑块/传送带部署在折叠下方。 如果横幅的完整标题需要查看者向下滚动，那么您的要求就很高了。

为了完成转换，号召性用语按钮经常被混淆为简单的“联系我”或“查看更多”链接，而实际上它可以提供一条消息来转换查看者。 与其说“看到更多”，不如把它变成一个更积极的邀请，比如“找到最适合你的设计”。

技巧 5：实施 SEO 关键字并制作强大的标题

使横幅的标题与搜索引擎相关并链接到网站的基础非常重要。 关键字构成了 SEO 的主要部分。 没有关键字的标题与没有轮子的汽车相当（如果你把它改造成一个独特的花园工作室，那就太好了）。

在至关重要的前 3 秒内，访问者到达您的网站后，会注意到标题。 展示解决方案或同情问题的有力和情绪化的词可以吸引观众。 根据域或 Google 代码段中的承诺，标题会更好地回报访问者点击访问您的网站。

当强行输入关键字时，标题会被稀释并失去影响力。 因此，请注意在交付时听起来不自然的文本。 如果这些话没有打动您，请大声说出来并重新审视。

一个常见的技巧是添加与数字相结合的强力词，从而产生只有继续阅读才能实现的承诺。 少于 10 个单词的单句比长段落强。 很好的例子是转化率很高的新闻网站。

尽管关键字“建筑师”仅出现在子标题中，但“在 3 个负担得起的阶段 – 我们将设计您的完美家园”的标题文本旨在为继续进行的预期提供有吸引力的保证。

尝试定义是什么让您与竞争对手不同。 抵制花哨的词，因为没有人愿意打开字典来了解上下文并避免过度使用陈词滥调。

“获取蓝图”的号召性用语应该促使观众在他们被“负担得起的”和“完美的家”这两个词吸引之后去做。 拉动心弦，但听起来不像是一张过度播放的唱片。

保持你的英雄部分新鲜和吸引人

当英雄横幅拥有足够的想象力和周到的措辞来阻止观众关闭窗口时，那么您就走上了正确的道路。 始终保持简单，并确保消息明确指示进一步的行动。 永远不要害怕定期更换它们，至少每两个月更换一次。 否则，回头客将失去最初的吸引力。 当然，随着网站基础的改变，横幅也应该改变。