Образ героя

  1. Что такое образ героя? Изображение героя - это термин дизайна веб-сайта, используемый для описания...
  2. 2 вещи, на которые стоит обратить внимание при использовании изображений героев
  3. Примеры изображений героев
  4. Как проверить изображения различных героев с помощью A / B-тестирования
  5. Идеи для тестирования образа героя

Что такое образ героя?

Изображение героя - это термин дизайна веб-сайта, используемый для описания изображения большого баннера в верхней части сайта. Иногда его называют «заголовком героя», он служит первым знакомством пользователя с вашей компанией и предложением из-за его заметного размещения в верхней части веб-страницы, которая обычно расширяется на всю ширину.

Источник: Balsamiq

В дополнение к графике высокого разрешения, изображение героя может содержать вашу компанию уникальный пункт продажи (USP) и цель конверсии, такая как форма регистрации или кнопка, чтобы начать делать покупки. Недавняя тенденция заключалась в использовании видео и анимации для изображения героя, а не статических фотографий.

Зачем использовать образ героя?

Изображение героя, обычно высококачественное фото или видео, может стать хорошим способом добавить индивидуальный подход, который сразу же укрепит доверие к вашему бренду. Поскольку люди очень наглядны, наличие высококачественных изображений в верхней части вашей страницы может помочь создать положительное первое впечатление.

Изображение героя также может указывать пользователям на нужную ссылку или призыв к действию или представьте свой бизнес ценностное предложение в верхней части веб-страницы. Изображения героев на медиа-сайтах и ​​в блогах также могут быть использованы для привлечения внимания посетителей и привлечения их к чтению статьи на странице.

2 вещи, на которые стоит обратить внимание при использовании изображений героев

Есть несколько вещей, на которые стоит обратить внимание при рассмотрении вопроса о том, хотите ли вы использовать изображения героев на своем веб-сайте.

  • Будьте осторожны с использованием больших изображений для изображений вашего героя, поскольку они могут повлиять на время загрузки, особенно на мобильных устройствах. На основе исследований, проведенных в Google, было показано, что увеличение скорости загрузки страницы с 0,4 до 0,9 секунды может снизить трафик на 20%. Эффективность изображений героев теряется, если они загружаются пользователем слишком долго. Убедитесь, что размер изображения и видео вашего большого баннера оптимизирован и они размещены на быстром CDN, чтобы они не замедляли время загрузки вашей страницы.
  • Спросите себя, действительно ли выбранное вами изображение добавляет ценности. Хотя использование стоковых изображений в качестве рекомендуемого изображения изначально может быть дешевым и быстрым решением, много раз стоковые фотографии являются клише и неоригинальными. Идеальный образ героя должен дополнять образы вашего продукта и основные предложения - это очень сложно получить с помощью стандартных изображений.

Примеры изображений героев

Ниже приведены примеры изображений героев из разных компаний и отраслей.

Как вы можете видеть, компании используют ряд различных способов для направления клиентов к целям конверсии: вставка формы или заметный призыв к действию и кнопке. Стоит отметить, что иногда панель навигации накладывается поверх изображения героя.

Стоит отметить, что иногда панель навигации накладывается поверх изображения героя

Desk (компания B2B) имеет изображение героя на своей домашней странице, которое включает в себя уникальное торговое предложение и форму с информацией о клиенте, наложенную сверху. Изображение стола подчеркивает название продукта и является чистым и приятным для глаз.

Изображение стола подчеркивает название продукта и является чистым и приятным для глаз

Рубашка (принт по запросу футболка company) четко описывает ценностное предложение компании в образе героя и включает в себя два CTA, ориентирующих пользователей на их основные функциональные возможности.

Рубашка (принт   по запросу футболка   company) четко описывает ценностное предложение компании в образе героя и включает в себя два CTA, ориентирующих пользователей на их основные функциональные возможности

TaskRabbit (компания, предоставляющая помощь по требованию) показывает образ героя с матерью с новорожденным, который визуально отображает ценность услуги. Изображение героя также накладывается на слоган компании и CTA для поиска по сайту помощи в вашем регионе.

Изображение героя также накладывается на слоган компании и CTA для поиска по сайту помощи в вашем регионе

Trunk Club четко передает свои ценностные предложения в образе своего героя, а также включает в себя CTA. Само изображение также передает услуги, которые предлагает Trunk Club.

Само изображение также передает услуги, которые предлагает Trunk Club

Discovery имеет анимированное изображение героя, которое направляет пользователя к видео при нажатии на него. На всех страницах и статьях Discovery также представлены сочные изображения героев, которые демонстрируют высококачественные фотографии компании.

На всех страницах и статьях Discovery также представлены сочные изображения героев, которые демонстрируют высококачественные фотографии компании

Secret Escapes (компания, специализирующаяся на туристических услугах) показывает CTA-фронт и центр в образе своего героя, а также в их ценностном предложении Образ, который они используют, также вызывает чувства туристических направлений, которые они предлагают.

Как проверить изображения различных героев с помощью A / B-тестирования

Поскольку изображения героев занимают видное место на вашем веб-сайте, важно протестировать различные изображения, чтобы определить, какие из них определяют ваши цели конверсии, будь то чтение статьи или нажатие CTA для совершения покупки на вашем сайте.

A / B тестирование это метод тестирования веб-сайтов, при котором 50% вашего трафика отображается в исходной версии вашей страницы, а 50% - в новом варианте. Показывая случайную выборку ваших посетителей разных версий вашей страницы, вы можете использовать данные, чтобы определить, какая версия вашей страницы лучше конвертируется.

Если страница претендента не превосходит оригинальную страницу, вы всегда можете проверить новые гипотезы с различными изображениями, копированием и призывом к действию. Вы также можете персонализировать свой опыт, показывая разные сегменты ваших посетителей разных изображений героев.

Постоянно тестируя различные изображения, вы можете улучшить свои показатели конверсии и опыт веб-сайта с течением времени.

Идеи для тестирования образа героя

Вот некоторые идеи по оптимизации изображений героев:

  • Тестирование воздействия неподвижного изображения на движущееся изображение. Может быть полезно выяснить, находят ли пользователи ваши визуальные эффекты привлекательными, эстетически привлекательными или информативными, или они находят их отвлекающими. Тестирование неподвижного изображения на движущемся изображении, таком как .gif или HTML5, может дать представление о предпочтениях вашего пользователя.
  • Тестирование воздействия интерактивного воспроизведения видео или видео с автоматическим воспроизведением. В Интернете все чаще можно услышать воспроизведение встроенного звука без его активации. Это полезно для сайтов, использующих видеосообщения, чтобы измерить важность видеоконтента, проверяя, нажимают ли пользователи, чтобы активировать контент, или стоит ли воспроизводить видео автоматически.
  • Проверка ценности Предложение героя: Разные изображения создают разные эмоции у ваших пользователей и заставляют их вести себя по-разному на вашем сайте?
  • Проверка предметной направленности героя: создает ли основной субъект вашего имиджа положительное чувство для пользователей, которое генерирует действия, которые способствуют достижению конечной цели конверсии бизнеса? Или это отталкивает?

Есть много вопросов, связанных с изображениями героев, которые стоит изучить. Поскольку изображения героев - это первое, что видят пользователи, это важная область для тестирования.

Что такое образ героя?
Зачем использовать образ героя?
Проверка ценности Предложение героя: Разные изображения создают разные эмоции у ваших пользователей и заставляют их вести себя по-разному на вашем сайте?
Или это отталкивает?