Просматривая несколько интернет-магазинов, вы можете заметить один общий для всех них компонент: крупное изображение (или серия изображений), размещенное на главной странице. Эти изображения могут называться героическими, баннерными или карусельными. Независимо от того, как вы их называете, изображения-герои сайта играют очень важную роль для предприятий электронной коммерции. В этой статье мы рассмотрим важность изображений-героев, познакомим вас с некоторыми передовыми методами их использования, а также предоставим несколько невероятных инструментов и графических ресурсов, которые помогут вам создать красивые и убедительные изображения-герои для вашего интернет-магазина. Давайте разберемся в этом.
Что такое образ героя?
Геройское изображение – это большое изображение, которое появляется в самом верху веб-страницы. Изображения-герои могут появляться на разных страницах сайта, но чаще всего они используются на главной странице сайта, под заголовком и навигационной панелью. Изображение-герой занимает наибольшее пространство на главной странице. В некотором смысле оно выполняет ту же функцию, что и целевая страница. Изображение героя действует как первое впечатление о вашем бренде, а значит, при правильном использовании оно может стать очень ценным активом для вашего бизнеса.
Что должно включать в себя изображение героя хорошего сайта?
Отличные образы героев, как правило, состоят из трех элементов:
- Привлекательное изображение
- Привлекательная копия
- Сильный призыв к действию (CTA)
Продуманное сочетание каждого из этих элементов может привести к созданию убедительного изображения героя, которое заставит посетителя совершить нужное вам действие, что поможет повысить конверсию. Вы увидите, как эти элементы работают вместе в приведенных ниже примерах изображений героев. Давайте рассмотрим три основных элемента более подробно:
Привлекательное изображение
Человеческий глаз любит большие, смелые и яркие изображения. Используете ли вы графику, фотографии или иллюстрации, зависит от вашего бренда, но всегда важно, чтобы ваши изображения были высокого разрешения и привлекали внимание. Героические изображения должны быть самыми заметными элементами на вашей домашней странице, о чем следует помнить при рассмотрении дизайна домашней страницы. Все темы Shopify включают большой раздел для изображений героев вместе с предлагаемым разрешением, чтобы вы точно знали, какой размер изображений героев вам нужен. Некоторые темы даже включают дополнительные функциональные опции для слайд-шоу героев, баннерных видео и анимации на странице.
Ресурсы стоковых фотоизображений
Если вы планируете самостоятельно заниматься фотографированием продукции, вам необходимо убедиться, что вы провели достаточно исследований, чтобы знать, как делать профессиональные высококачественные снимки. Если вы хотите сэкономить время, возможно, вы захотите воспользоваться стоковыми фотографиями. В Интернете есть масса мест, где можно найти профессиональные высококачественные изображения для вашего сайта. Чтобы помочь вам в поиске, мы перечислили некоторые из лучших источников для поиска следующего изображения: Если вы ищете бесплатные стоковые фотографии и графику, вот несколько вариантов, которые стоит рассмотреть:
- Burst от Shopify: Burst – это сайт стоковых фотографий, созданный предпринимателями и для предпринимателей. На Burst вы можете найти фотографии продукции высокого разрешения и изображения образа жизни, которые идеально подходят для маркетинговых кампаний и социальных сетей. Если у вас есть магазин Shopify, вы сможете добавлять фотографии с Burst прямо из редактора вашей темы.
- Pexels: Pexels содержит тысячи бесплатных стоковых изображений, загруженных пользователями или источниками с сайтов бесплатных изображений.
- Unsplash: Unsplash предлагает более 2 миллионов бесплатных изображений высокого разрешения от сообщества фотографов.
- Pixabay: Pixabay предлагает изображения, которые можно свободно использовать в коммерческих и некоммерческих целях, хотя важно отметить, что некоторые изображения все еще защищены торговыми марками, правами на публичность или конфиденциальность.
- Stockvault: Stockvault предлагает бесплатные стоковые фотографии, а также макеты веб-дизайна и шаблоны логотипов.
- Canva: Canva – это универсальный инструмент для создания сайтов, который также включает коллекцию бесплатных и платных стоковых фотографий для коммерческого использования.
- Stocksnap: Stocksnap предлагает широкий выбор бесплатных стоковых фотографий для использования в коммерческих и некоммерческих проектах.
Платные имиджевые ресурсы. Если у вас есть бюджет для работы с изображениями героев, рассмотрите некоторые из более платных ресурсов для получения изображений и фотографий более высокого качества.
- Shutterstock: Shutterstock располагает обширной библиотекой из более чем 300 миллионов изображений от фотографов со всего мира, что делает его идеальным ресурсом для фотографии путешествий.
- Adobe Stock: Разработанный для работы с набором инструментов дизайна Adobe, Adobe Stock содержит тысячи стоковых фотографий, шаблонов дизайна изображений героев, стоковых видео, векторного искусства и иллюстраций.
- Getty Images: Несмотря на более высокую цену, Getty Images содержит обширный архив современных и исторических фотографий, которые можно приобрести.
- iStock: iStock принадлежит Getty Images, поэтому вы можете увидеть некоторое дублирование в том, что касается доступных фотографий. Тем не менее, iStock позволяет фотографам продавать свои фотографии на других платформах, поэтому вы найдете более широкую и современную коллекцию, чем на Getty.
- Dreamstime: Dreamstime предлагает множество стоковых фотографий, видео, векторов и иллюстраций – как бесплатных, так и платных, с различными вариантами лицензирования.
Нанять внештатного фотографа. Конечно, стоковые фотографии всегда останутся стоковыми фотографиями. Если у вас есть время и, возможно, немного больше бюджета, вы можете рассмотреть возможность найма профессионального фотографа и съемки собственных фотографий. Вот еще несколько вариантов поиска фотографов-фрилансеров:
- Нанять эксперта Shopify: Используйте Shopify Experts для поиска фрилансеров и агентств, специализирующихся на конкретных дисциплинах, таких как редактирование фотографий и фотосъемка товаров. Вы даже можете нанимать фрилансеров, основываясь на отраслевом опыте – так, если вам нужен фуд-фотограф, вы можете найти фуд-фотографов.
- Fiverr: Fiverr предлагает широкий выбор фрилансеров, которые специализируются на всем – от фотографии товаров до веб-дизайна.
- Фрилансер: База данных Freelancer включает специалистов в самых разных творческих областях, таких как фотография и иллюстрация.
- Upwork: Upwork позволяет предпринимателям размещать вакансии и связываться с фрилансерами, обладающими опытом и навыками, чтобы помочь им.
- Гуру: Guru предлагает услуги фотографов-фрилансеров с опытом работы во всех видах фотографии, таких как модная фотография, уличная фотография, пейзажная фотография и многое другое.
Привлекательная копия
В рекламе и маркетинге копирайтинг описывает письменный материал средства массовой информации. Для предпринимателей копирайтинг – полезный навык, который необходимо иметь в своем арсенале. Пользователи лишь на мгновение бросают взгляд на изображение вашего героя, прежде чем перейти к нему, поэтому у вас есть всего несколько секунд (максимум), чтобы привлечь внимание пользователя. Хорошая копия должна отвечать потребностям клиентов в доступной для понимания форме. Вот несколько кратких советов по написанию убедительных текстов:
- Будьте лаконичны: Длинные тексты имеют свое место, но баннерное изображение – это не то. Копия баннера должна быть емкой и точной.
- Избегайте трудночитаемых шрифтов: Редко используемые шрифты требуют больше времени для прочтения. Хотя дополнительное время может быть минимальным, каждая миллисекунда имеет значение, когда речь идет о копировании изображения баннера.
- Повторяйте тон своих клиентов: Пользователи обычно более восприимчивы к языку, который кажется им знакомым. Учитывайте язык, который ваша целевая аудитория использует в социальных сетях, и используйте его для формирования стиля вашего письма.
- Сосредоточьтесь на преимуществах, а не на особенностях: Вместо того чтобы говорить: “Наша служба поддержки клиентов работает круглосуточно и готова ответить на любые вопросы”, скажите: “Получайте ответы быстро благодаря круглосуточной поддержке клиентов”.
- Не бойтесь тестировать различные тексты: Изображения героев – это лучшие кандидаты для A/B-тестирования, поскольку различные варианты слов могут кардинально изменить то, как ваши посетители взаимодействуют с дизайном изображения героя.
- Избегайте маркетинговых словечек и клише: Глаза пользователей обычно не замечают часто используемых рекламных слоганов, таких как “действуйте быстро”, “огромная экономия” и “гарантия удовлетворения”.
Сильный призыв к действию
Наконец, все изображения героев должны содержать заметный призыв к действию (CTA). CTA – это текст, который сообщает читателю о действии, которое вы хотите, чтобы он совершил, и обычно сопровождается кнопкой, которая выполняет это действие. Примеры: “Совершить покупку сейчас”, “Подписать петицию” или “Узнать больше”. Способ написания призыва к действию зависит от того, к какому сегменту маркетинговой воронки вы обращаетесь. Если вы обращаетесь к пользователям верхней части воронки, вы можете попросить их “Узнать больше”, в то время как для пользователей нижней части воронки CTA может быть более прямым “Купить здесь”.
Поймите цель изображения вашего героя
Вы можете использовать этот ценный объект недвижимости для различных целей в зависимости от вашего бизнеса и целей. Давайте рассмотрим некоторые из наиболее распространенных подходов к использованию изображений героев:
Чтобы помочь создать ваш бренд и рассказать вашу историю
Одним из возможных вариантов использования изображения героя вашего сайта может быть рассказ о бренде. Рассказ о бренде – это использование повествования для передачи уникального торгового предложения вашего бренда. Рассказывание историй – очень эффективный метод создания бренда, потому что хорошая история запоминается.
Отвечать на вопросы клиентов
Другим распространенным подходом является размещение ответов на часто задаваемые вопросы. Вы можете обратиться к распространенной болевой точке клиента или использовать это пространство для ответов на вопросы, которые могут возникнуть у ваших посетителей в ближайшее время.
Чтобы подчеркнуть ваше ценностное предложение
Рассказ о бренде – не единственный способ представить свое уникальное торговое предложение. Ваш бренд будет лучше запоминаться посетителям, если они поймут, чем он отличается от конкурентов. Что может быть лучше, чем рассказать клиентам о своем ценностном предложении прямо на главной странице, куда попадает большинство посетителей.
Сделать объявление
Баннер вашей домашней страницы является ключевым объектом недвижимости для продвижения продаж, событий, запуска продуктов и других важных объявлений. Баннерные изображения привлекают внимание большинства посетителей сайта, поэтому любое объявление, которое вы хотите, чтобы было широко замечено, является хорошим кандидатом на содержание баннерного изображения.
Оптимизируйте свой сайт с помощью потрясающего изображения героя
Вот и все, причины, цели и способы использования изображения героя на вашей домашней странице. Частая смена этих изображений помогает вашему магазину оставаться свежим для повторных посетителей, делает его живым и побуждает посетителей совершать действия, наиболее соответствующие вашим целям конверсии.
Как создать изображение героя для вашего интернет-магазина
Создание хорошо продуманного и привлекающего внимание изображения героя поможет привлечь новых посетителей сайта и заставить их изучить еще больше ваших товаров. Ознакомьтесь с этим пошаговым руководством по созданию изображения героя для вашего интернет-магазина.
Используйте высококачественные изображения продукции
Привлекайте новых клиентов потрясающими фотографиями ваших товаров или магазина. Вы всегда можете использовать профессиональные стоковые фотографии, но лучше всего, если вы сможете нанять фотографа, который сделает высококачественные снимки ваших конкретных товаров. Вот отличный пример из интернет-магазина растений. Любой посетитель этого сайта, скорее всего, интересуется растениями, и его легко привлечет потрясающая зелень на главной фотографии.
Создайте графику с помощью онлайн-инструмента для дизайна
Вы можете придать пикантность фотографиям товаров или создать образ героя, используя вместо этого графические элементы. Найдите в Интернете инструмент для дизайна, например, Canva, Visme или Adobe Cloud, и создайте привлекательную графику. Вот отличный пример того, как это может выглядеть – компания Detour Coffee создала вырезку своего продукта и поместила ее на графику со смелыми цветами и формами, чтобы привлечь внимание.
Добавьте наиболее релевантный призыв к действию
Ни одно изображение героя не будет полным без призыва к действию (CTA), поэтому добавьте кнопку, соответствующую изображению или графике, которую вы включили. Вы также должны убедиться, что ваша кнопка соответствует общему дизайну, чтобы она выделялась, но не казалась неуместной. Вот отличный пример того, как это может выглядеть:
Используйте видео как часть образа вашего героя
Еще один отличный способ привлечь внимание – создать зацикленное, беззвучное видео или GIF для изображения героя. Например, на сайте Nomz есть несколько видеоклипов, которые появляются, затягивая посетителя сайта и заставляя его остаться на странице дольше, пока он смотрит полную сцену.
Регулярно обновляйте изображение своего героя
Ваш образ героя – это не одноразовый процесс. Хотя вам может нравиться имеющееся изображение, вам нужно будет обновлять его время от времени, чтобы знакомить возвращающихся клиентов с новыми продуктами и предложениями. Вы можете даже рассмотреть возможность создания слайдера с изображением героя, чтобы можно было одновременно разместить несколько призывов к действию. Это отличная идея, когда вы хотите прорекламировать предстоящий праздник, как в примере ниже, и при этом продвинуть другие линейки товаров.
Как добавить изображение героя на мой сайт? Если вы используете тему Shopify, вы можете добавить изображение героя в редакторе темы. Войдите в свой магазин Shopify, перейдите в раздел “Интернет-магазин” > “Темы” и выберите “Настроить” рядом с текущей темой. В большинстве тем по умолчанию есть место для баннера, но если вам нужно добавить его, выберите “Добавить раздел” в нижней части правого меню, а затем выберите элемент раздела hero. Этот элемент может быть обозначен как изображение героя, изображение баннера или слайд-шоу – в зависимости от используемой темы. Также обратите внимание, что изображения героев сайта не переносятся из одной темы в другую, как изображения товаров или изображения в блоге. Изображения героев должны быть добавлены непосредственно в каждую тему отдельно, и появятся на странице только в том случае, если вы добавите их в текущую тему.
Какого размера должно быть изображение героя на сайте? Вы можете добавлять файлы PNG и JPEG размером до 20 МБ, но для обеспечения приемлемого времени загрузки страницы желательно, чтобы размер файла был небольшим. Точные размеры изображений зависят от используемой темы, но обычно изображения героев должны быть не менее 2048 пикселей в ширину, чтобы при просмотре в полноэкранном режиме они отображались в четком разрешении. Помните, что темы являются отзывчивыми, то есть пространство, отведенное для изображений героев, меняется в зависимости от размера экрана, на котором просматривается сайт. Обязательно оставьте место вокруг рамки изображения, чтобы учесть части, которые могут быть отрезаны. Также следует избегать размещения копий и CTA непосредственно на изображении. Вместо этого используйте редактор тем для наложения копий и CTA-кнопок, которые будут плавать перед изображением и регулироваться независимо от него.
Какова цель изображения героя сайта? Изображения-герои сайта служат для самых разных целей, но в целом они отлично подходят для любого объявления, которое вы хотите сделать для наибольшего числа посетителей. Обычно это объявление о продажах, подчеркивание ценностей вашего бренда или анонсирование новых продуктов.
Что должно содержать изображение героя? Изображение-герой сайта должно содержать большое, привлекающее внимание изображение, а также краткую, убедительную копию и сильный призыв к действию.
