Всё для рекламы
и про рекламу
Навигация по статье
Основные ошибки, которые снижают конверсиюКак сделать продающий первый экранСтруктура идеального лендингаСоветы по увеличению конверсии сайта
О сайтах

Рекомендации, повышающие конверсию сайта

4849

Основные ошибки, которые снижают конверсию

Отсутствие прототипа и анализа перед разработкой сайта

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

Что входит в создание прототипа (если коротко):

  • Брифинг, получение исходных данных о проекте, продукте, компании.
  • Углубленное исследование, проведение CustDev. 
  • Сегментирование аудитории, поиск смыслов, болей и страхов.
  • Написание продающего текста.
  • Создание прототипа, например, в Figma. 

Вообще прототип – это по сути черно-белый вариант сайта, который создается при помощи какого-нибудь инструмента. Он служит для того, чтобы просто обозначить на первых этапах, по какой структуре будет создаваться сайт. Там не будет каких-то изображений и видео, просто чертежный вариант элементов и текст, который пойдет на сайт. 

прототип сайта

Дизайн ради дизайна

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

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

ошибка в дизайне сайта

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

удобный и понятный дизайн сайта

Некорректная мобильная версия

По моим данным, мобильный трафик всех моих проектов составляет 69%. И с каждым годом он растет на 29-32% от предыдущего. 

мобильная версия сайта

Что из себя представляет мобильная версия:

  • Это не только уменьшенная копия дизайна, но и упрощенная.
  • Комфортная навигация и взаимодействие с элементами.
  • Не используйте мелкий шрифт и большие изображения.
  • Позаботьтесь о молниеносной загрузке страниц.
  • Не прячьте Call To Action, делайте большие поля формы и кнопки.
  • Тестируйте мобильную адаптацию на разных устройствах и разрешениях.
  • Размещайте конверсионные элементы по правилу «большого пальца».

Скорость загрузки сайта

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

Допустим, у вас есть дизайн, вы с него сохраняете изображения в формате .png или .jpg. И одна картинка среднего размера будет весить 890 кб. И если у вас на сайте 10 таких изображений, это уже 10 мб. 

Если нужно ускорить загрузку сайта, в первую очередь это изображение нужно прогнать через сервис TinyPng (есть и другие сервисы, я пользуюсь этим). И в итоговом варианте вы получаете размер, меньший на 75%, но качество от этого не портится.

сервис tinypng для сжатия изображений

Далее переходим на сервис WebP Converter и конвертируем там наш PNG файл в другой формат. Так сжимаем изображение еще больше, в итоге уменьшаем его еще на 90%. 

сервис WebP Converter для сжатия изображений

Если брать в расчете целого сайта, это на самом деле очень много. И сайт будет грузиться точно быстрее на 1-2 секунды. А для мобильных версий важна каждая секунда.

Как сделать продающий первый экран

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

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

логотип на первом продающем экране сайта

Далее идет тематическое фоновое изображение. В первую очередь вы сразу должны показать, о чем ваш сайт, компания и продукт или услуга. Здесь можно использовать и видео-формат. И это изображение тоже нужно обязательно сжимать так, как я рассказывал ранее. И видео тоже нужно сжать.

тематическое фоновое изображение на первом продающем экране сайта

3 элемент – правильная формулировка заголовка. Это изначально прописывается в прототипе, структуре, продающем тексте. Заголовок может быть посередине, слева. Не рекомендую его размещать справа, потому что мы читаем слева направо.

правильная формулировка заголовка на первом продающем экране сайта

Следующее – краткое описание продукта/услуги или главное УТП.

краткое описание продукта/услуги или главное УТП на первом продающем экране сайта

Следующий элемент – открытое меню с наиболее важными пунктами.

 открытое меню с наиболее важными пунктами на первом продающем экране сайта

Кнопка с призывом к основному действию. Можно использовать как кнопку, так и открытую форму с подпиской. 

Кнопка с призывом к основному действию на первом продающем экране сайта

И последний элемент – основная контактная информация. Указываем номер телефона и обязательно кнопку для заказа звонка, потому что не все пользователи хотят звонить сами.

основная контактная информация на первом продающем экране сайта

Структура идеального лендинга

Скажу сразу, что идеального варианта не существует, потому что для разных ниш, тематик и целевых аудиторий эта идеальность своя. Здесь нужно проводить тестирования и смотреть, что подойдет лучше. Но от этой структуры можно отталкиваться при разработке своих сайтов.

Так выглядит структура идеального лендинга.

структура идеального лендинга

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

  • Первый экран.
  • О продукте, выгоды и преимущества, для кого этот продукт.
  • О компании, блоки доверия (сертификаты, лицензии).
  • Результаты. Как это работает / как мы работаем.
  • Стоимость, призыв к действию. Есть ниши, где мы не пишем о стоимости открыто, а говорим о первоначальной цене, из чего складывается общая цена и т.д.
  • Социальное подтверждение. Кейсы и отзывы. О команде.
  • Ответы на вопросы. Контактная информация.
  • Призыв к действию. Внутри сайта может быть несколько кнопок с призывом к действию. Еще можно использовать призыв к действию в виде формы.

В зависимости от ниши размещение блоков может меняться. 

В эту структуру еще можно добавить квиз. 

структура идеального лендинга с интерактивным квизом

Туда, где у нас указывается стоимость, добавляем интерактивный квиз. Интерактивный квиз – я чаще использую квизы, где в зависимости от ответов пользователя будут показываться разные цены или разные подарки,бонусы, которые ему подойдут.

интерактивные квизы на сайте

Советы по увеличению конверсии сайта

  • Обязательно проводить анализ, сбор исходных данных и разработку прототипа.
  • Составление и проверка нескольких гипотез (если позволяет бюджет).
  • Проведение A/B-тестирований и внесение корректировок на каждом этапе.
  • Следите за скоростью загрузки сайта, особенно с мобильных устройств (максимум 2 сек).
  • Используйте маркетинговые инструменты: квиз, попап-окно на выходе, открытая форма, виджет для обратной связи.
  • Используйте «Принцип перевернутой пирамиды» – вся самая необходимая информация сверху вниз.
  • Продающий текст и визуал – это основа! Но не забывайте про юзабилити (удобство нахождения и перемещения по сайту).
  • Отправляйте на сайт только целевую аудиторию. 

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

Хотите тоже написать статью для читателей Yagla? Если вам есть что рассказать про маркетинг, аналитику, бизнес, управление, карьеру для новичков, маркетологов и предпринимателей. Тогда заведите себе блог на Yagla прямо сейчас и пишите статьи. Это бесплатно и просто
Константин Белан
4849
2
Написать комментарий