如何使用英雄形象?
当人们访问你的网站时，他们看到的第一件事是一个英雄形象。
人们会受到意象带给他们的感觉的影响。事实上，你可能已经注意到你最喜欢的网站和品牌使用图像来吸引和激励他们的用户。毕竟，一张图片胜过千言万语，对吧?所以正确的英雄形象可能价值数百万美元!
这对现代企业来说非常正确，他们利用这些形象将潜在的客户转化为客户。但这是怎么回事呢?
一个形象，无论是单一的形象还是一系列的英雄形象，都可以帮助你传达你的信息和整体的品牌概念。但是为什么通过图像传达信息很重要呢?嗯，它只是帮助影响人们对你的品牌的感觉。它可以帮助他们感到兴奋、信任、愤怒、快乐等等。
这就是为什么我们要谈论英雄形象。我们将了解一些值得了解的英雄图像事实，一些图像转换相关知识，甚至还会看到一些例子。让我们来看看如何用一张图片说服用户。
什么是英雄形象?
在我们深入讨论好东西之前，让我们回到最基本的，并解释什么是真正的英雄形象。
简单地说，英雄形象就是一些网站在其网站顶部使用的大照片或图形。更正式的说法是，它是一个位于折叠上方(网站的上半部分)的大型宣传图片，用于吸引某人的注意力。
好消息是，它们很容易在您的网站设计．你可以加一点HTML和CSS到你的网页生成响应图像．你也可以尝试英雄图像引导，即创建一个大框、页面标题或“jumbotron”来显示特殊内容。
很多时候这些英雄图像将包含文本，CTA，或由一系列图像组成。但是，这些增加的内容通常会给响应式网页设计带来问题。188bet官网备用域名幸运的是，有办法解决这个问题，这意味着创建一个响应式的英雄形象对所有规模的企业都是可能的。
什么是反应迅速的英雄形象?
一个响应的图像是可以在不同平台的各种屏幕上适当显示的图像。这是否意味着将不同大小的图像替换为不同大小的设备，或者更改文本或覆盖以适合每个用例的格式。
所以一个反应迅速的英雄形象，就是网站的主站点优化后的图像以适应各种环境条件。
9个最佳实践英雄形象
现在你已经理解了什么是英雄形象，让我们来谈谈一些英雄形象的最佳实践和需求．尽管这看起来相对简单，但英雄形象的塑造方式必须有利于你，而不是让潜在客户感到不安或困惑。
把它想象成着陆页它是用来工作的。传达你的信息，吸引新的线索。这也可以增加你的品牌知名度当人们提到你的品牌时，他们可能会谈论什么。
所以这里有一些最好的建议，在设置你的英雄形象时考虑:
1.描述情感
当涉及到情感时，人们对事物的反应和记忆会更有意义。这并不意味着你需要过分夸张。但如果你能巧妙地融入一些让人们感觉良好的东西，或者让人们对某些东西产生强烈的感觉，你的英雄形象就会产生影响。
你的英雄形象可以强化你想要表达的任何情感或感觉。
帮宝适，一个流行的纸尿裤品牌，用著名歌手约翰传奇，捕捉了一个真正的父母时刻(你换脏纸尿裤时的表情)。这增加了品牌的信任度。知道某位名人选择帮宝适并更换尿布会让这个品牌更有吸引力。
此外，你可以真切地感受到他们捕捉到的瞬间，这对大多数父母来说是一种轻松的联系。
2.显示的相关性
你知道什么让人困惑吗?到达网站，看到一个图像，与他们出售的没有任何关系。这有点让你怀疑你是否输入了正确的网址，不是吗?
你的英雄形象需要与你所做的事情相联系。例如，如果你卖的是美味的狗粮，你不需要展示你的食物，但你可能想展示一些与狗有关的东西。这可能意味着一只狗在海滩上跳，或者大吃一大碗食物，甚至只是一只狗坐着。你的形象需要直接与你的业务联系起来。
Barkbox展示他们最喜欢的客户类型和他们的产品。他们还通过使用生动的色彩使它非常有趣。
3.高质量的
你曾经访问过使用像素化图像的网站吗?你有什么感觉?大多数人会对他们可能得到的产品或服务的质量失去信任，如果他们看到的第一件潜在客户是一个贴着大英雄形象的劣质网站。
如果你用的是高质量的照片，分辨率能经受住使用的设备，你就能给别人留下很好的第一印象。
想象一下，如果你登陆了一个出售海滩装备的网站。如果他们试图拉伸图像来适应，你会得到一个模糊和像素化的外观。如果他们使用一个适当大小的图像，就像右边的，它看起来会更好。
且不说用户可能会对他们购买的产品质量感觉更好，如果你的网站做得不好，人们可能会把它与你愿意推出的产品质量联系起来。下载我们的免费的电子书看看我们如何使用高质量的视觉效果。(也可以完全免费使用!)
4.明显的CTA
如果你要使用号召行动，它需要突出。与此同时，它不应该占据节目。所以在两者之间找到一个平衡点。
需要考虑的是颜色和位置。你不希望颜色被周围的图像所掩盖。您也不希望将CTA按钮放置在其他按钮附近(如菜单项或下拉菜单)。
你可以做一个快速测试模糊图像看看这个按钮是否足够显眼。如果你的眼睛抓住了按钮的位置，你就对了!
取Sock Fancy的推荐登陆英雄形象。图像的颜色很醒目，他们将CTA放置在离菜单栏足够远的地方，并使用了一个漂亮的黑色按钮使其从图像的其他部分中脱颖而出。
当我们做模糊测试时，图像突出，你的眼睛被它吸引。你最注意的是图像和按钮。但是，这个按钮似乎并不太强大。
5.使用的人
你可以在你的英雄形象中使用任何你想要的东西。但如果你使用人，客户可能会在视觉上看到他们自己在相同的位置。
当你使用一个人时，用户可能会感受到一种联系，从而更好地与你的品牌联系在一起。你应该避免太笼统。一张过度摆拍的照片并不能真正达到同样的效果。相反，你可以选择使用与你的目标受众相匹配的人或顾客的照片。
等网站Pikwizard提供一系列出色的库存图片，避开过去的舞台图像，而是提供与人相关的图片。
宏碁选择展示不同情况下的各种用户，这表明他们是一款适合任何人的产品。
但如果你的预算中没有这样的照片，那么就选择中性的库存图片，描绘用户可以联系到的日常人物。
6.加载速度
等待并不有趣，人们的注意力持续时间也很短，所以加载速度是保持用户粘性的必要条件。最近的研究表明，你确实如此7秒来吸引别人的注意力．我们都有过这样的经历，等待页面加载，然后在眨眼之前继续前进。
做一些测试以确保您的页面以快速的方式加载。你最不希望的就是有人因为你网站上的图片无法加载而弃船。
觉得你的搜索引擎优化策略图像大小和加载速度是其中的一部分!
7.屏幕大小
拥有一个反应迅速的英雄图像的部分原因是要确保你能够考虑到所有可能用于看到它的不同屏幕尺寸。
针对所有设备进行优化是必要的，这将有助于保持你的形象在所有用户面前的一致性。有大量的工具你可以用响应图像断点生成器．这将检查您的图像的各种屏幕尺寸，以便您可以选择最理想的尺寸。
或者你可以用a平面设计软件这可以帮助您为多个设备设计内容。你可能会剪掉或使用不同版本的主英雄图像，以适应智能手机等小型设备的尺寸。
以《Gold’s Gym》为例，他们有一个巨大的英雄形象，展示了4个不同的人以及他们的品牌承诺。但这不适用于更小的设备，文字也不容易辨认。
所以，他们做了一个手机版本来解决这个问题。如你所见，信息仍然清晰，他们将其与现有图像的裁剪版配对。你会看到同样的人，同样的承诺，略微不同的形象。但是，它还是得到了相同的点。
8.季节变化
有时，根据季节或特定的节日来改变你的英雄形象可以为用户创造兴趣和刺激。这也可能激发一些想法，鼓励他们购买你可能在这个例子中展示的物品。
Build A Bear经常更换他们的英雄形象。每次他们这么做的时候，他们都会为这个场合或节日展示完美的毛绒玩具。
在这种情况下，他们用一只穿着t恤礼服的泰迪熊和一些花来象征即将到来的节日——情人节。他们还会在措辞上做文章，让你知道还有足够的时间为自己的情人节买一只这样的熊。
使用主题或节日也是增加你的口碑营销！
9.添加文本
这个选项是可选的，但有一定的方法可以做到。图像本身不应该有文字。相反，您应该使用HTML和CSS在图像上覆盖文本。
许多网站只是简单地换掉图片，而保留文本代码不变。这样做的诀窍是，你必须不断使用与文本位置保持一致的图像。但如果你不经常更换英雄形象，这可能对你很有用。
通过这种方式定位你的文本，你可以得到一个反应更快的图像。这是理想的，特别是当用户通过不同的渠道访问您的站点时。
丝芙兰目前的英雄形象使用各种新的和刚刚到达的产品。如果你注意到他们也使用了各种各样的文字。为了达到这个目的，你猜对了，他们对文本进行了覆盖!
典型的英雄图像尺寸
有将军吗?英雄图像大小你应该和谁一起工作?如果你想要一个优化的网站，是的。
您希望图像足够大，适合任何尺寸的屏幕，但又要足够小，以免降低页面加载速度。因此，您需要使用正确的尺寸，并在分辨率和大小之间找到一个最佳点。
有几个维度可以作为一般指南(我们已经提到了两个)。它们是文件大小、分辨率，当然还有图像大小。
许多计算机的最低分辨率为1024 x 768像素。你会希望你的英雄图像稍微大一点，大约1600 x 500像素。如果你使用的是小屏幕(如手机或平板电脑)，你可以选择更小的屏幕。
WordPress的英雄图像大小
的WordPress的英雄图像大小将更改为不同的设备，就像任何其他网站一样。对于移动设备，应该使用较小的文件，而应该使用2880像素的大图像。使用正确的CSS，您可以为不同的设备使用不同的图像大小。你可以选择在每个设备上调整浏览器的大小，许多公司都这样做。问题是你可能会失去清晰度和加载速度。但是，考虑到互联网一直在变快，这可能不是一个大问题。
Shopify的英雄图像大小
你想要一个相对较大的高分辨率图像(超过2000像素)，诀窍是将它们压缩到大约70%。您可以减少文件大小，但保持完整和质量的图像完好无损。
Limecube的英雄图像大小
最好从2000px宽的图片开始。除此之外,Limecube网站的制造商不需要你优化图像，因为平台会为你做，将横幅图像转换为webP，以加快页面加载速度。图像还可以根据不同的设备自动调整大小。
幸运的是，市面上有很多免费的图像压缩器，所以抓取较大的图像并进行压缩以获得最大的优化。
确切地说，你需要检查你的Shopify主题关于图片大小的信息。
这里有一些英雄形象的灵感
现在你已经有了英雄形象的概念，让我们回顾一些英雄形象的灵感。以下是我们最喜欢的一些!
该产品只关注英雄形象-只展示产品。
情感英雄形象-描绘了强烈的情感。
一个说明性的英雄形象-用插图来传达信息。
手机上的英雄形象例子
让我们回顾一些手机英雄图像。这些都具有相同的冲击力，但规模较小。
CTA集中-这一形象的主要驱动因素是CTA本身。
居中产品形象-英雄图像在菜单和文本之间间隔。
使用视频一些英雄形象被宣传片取代。
英雄形象图片库
我们看到的是大量单一的图像被使用。然而，有时一个品牌会使用拼贴或相片画廊作为他们的英雄形象。
例如，Overtone使用一些图片来展示他们的新产品和真实用户。
也有一些企业使用图像滑块或图库旋转图像，为用户提供更多的视觉效果。你可以通过位于图像两边的箭头和图像底部的点看到。
哪里可以找到免费的英雄图像
你从哪里得到要使用的图像?在许多情况下，您可能会提出自己的内容。有时甚至可以使用用户生成的内容。但如果你想试试运气，获得免费的库存照片，你有很多选择。
英雄影像库存摄影
许多免费图片网站提供免版税的图片，你可以在你的网站上使用。188bet娱乐平台在很多情况下，你可以找到一些非常好的照片，你可以使你的企业独特。
一些深受欢迎的网站包括……
Pikwizard-这个是免费的，有40多万张照片。你甚至可以获得免费的矢量和插图．
设计向导-有一个免费的选项，但你可以升级更多的内容。这个工具有大量的免费图片和编辑选项，值得188bet娱乐平台一看。
去创造你自己的美丽的英雄形象
这并不难，因为你可以看到你有很多选择，为你的网站创建最好的英雄形象。只要确保你了解屏幕大小，加载时间，剩下的就会很容易。
