Как заставить свой сайт продавать?
10 важнейших элементов сайта. Исправь это и получай больше клиентов с сайта.
Привет
Меня зовут Николай Макуха, основатель Pulls Design. Не буду много рассказывать о нашей команде, чем мы занимаемся и что создаем, ведь ты тут не за этим. Поэтому, сразу к делу.

Этот небольшой гайд поможет тебе сделать свой сайт более конверсионным, а тебя немного богаче и счастливее. Простые и понятные вещи, зачастую, дают больший результат, чем сложные системы. Просто внедри эти 10 простых рекомендаций и твоим пользователям станет легче отдать тебе деньги.
01. CTA
/Что мне делать?/
Первое, и наверное самое важное, что тебе надо проверить на сайте, это есть ли у тебя CTA (Call To Action) - призыв к действию. Это распространенная ошибка, когда на сайте рассказывается о продукте или услуге во всех красках, но при этом не говорится, что нужно сделать. Думать о своих клиентах как об интеллектуальном
меньшинстве - это похвально, но губительно. Дело не в том, насколько эрудирован твой потенциальный клиент. Пользователь, находясь на твоем сайте, не думает о том, что ему нужно что-то купить или заказать. Как правило он просто сёрфил инстаграм или перешел к тебе на сайт по какой-то ссылке из блога. У него не стоит задачи что-то купить прямо здесь и сейчас. Черт возьми, он вообще не знает, что на этом сайте можно что-то купить. И очень важно зародить эту мысль в его голове. Нет ничего проще чем просто предложить ему это сделать:
• Забронировать
• Купить сейчас
• Подписаться
• Позвонить
Не стоит усложнять и выдумывать “интересные” названия для CTA. Призыв к действию должен быть простым и однозначным.
02. Cкорость загрузки
/Долго там еще?/
Важнейший показатель, который влияет на конверсию сайта - это скорость загрузки. Несмотря на быстрый мобильный интернет, многие сайты продолжают вызывать старость у пользователей в ожидании загрузки страницы.
Есть множество способов, как оптимизировать код сайта для быстрой загрузки, однако, для этого нужны навыки программирования и знание языков. Простое решение, благодаря которому вы сможете ускорить свой сайт на 60-70% это оптимизация фотографий. Одна фотография может весить больше чем весь код сайта, поэтому, очень важно их оптимизировать.
Сделать это можно на сайте TinyPNG без потери качества.
03. Формы
/Не заставляйте меня много писать/
Формы, формы, формы. Как много их в нашей жизни. Из каждого сайта на нас смотрят формы и просят их заполнить. Пользователь устал от них, поэтому, чтоб помочь нашему клиенту, надо их максимально упростить и сделать удобными. Ниже приведен чек-лист как проверить свои формы на удобство заполнения:

• Не просите больше чем надо.
Если для связи вам достаточно телефона и имени, не надо просить email, день рождения, прописку и имя кота. Чем меньше пунктов, тем вероятнее, что их заполнят. Рекомендуемое количество 2-3 пункта.

• Подсказки в полях.
Подскажи пользователю как надо указать данные. Например, в случае с телефоном, ты можешь автоматически указать начало номера “+38” и пользователь поймет, что он должен его продолжить именно с “0”.

• Ширина полей.
Если в поле нужно указать номер телефона, то ширина поля должна быть ровно в ширину номера, не больше не меньше. Если пользователь увидит длинное поле в 40-50 символов, то начнет сомневаться: точно ли тут нужно указать номер телефона, который имеет всего 10
символов.

• Последовательность клавиатур.
Если избежать коротких форм тебе не удалось, то нужно хотя бы упростить их заполнение. При вводе тех или иных данных с телефона, нужно переключаться между разными клавиатурами “Русская”, “Английская”, “Цифирная”. Расположив поля, с учетом этого критерия, ты снизишь к минимуму переключения между клавиатурами. Важно при этом не терять логическую последовательность.

• Контраст полей
Хороший дизайн - это понятный дизайн. Поэтому убедись, что твои поля в формах достаточно контрастны и хорошо видны как на тусклых, так и на пересвеченных мониторах.

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

• Название кнопки
Обязательно убедись, что текст на кнопке формы однозначен и понятен. Она должна описывать именно то действие, которое совершает пользователь в момент нажатия.
Если он бронирует номер то кнопка не может называться <Отправить>, она должна быть <Забронировать>.
04. Кнопки
/Покажи куда мне тыкать/
Кнопки и ссылки на сайте это наши двери в лабиринте. Нужно максимально помочь пользователю не заблудиться и понять: какая кнопка какой функционал несет. Интерфейс должен быть предсказуемым и не вызывать у пользователя недоумение. Глобально все кнопки разделяются на два видов:
• Целевые CTA - Это кнопки действия. Что должен сделать пользователь в конечном итоге? К этой категории относят кнопки “Купить”, “Забронировать” или “Подписаться”.
• Направляющие - Это кнопки перенаправляющие на другую страницу, на другой ресурс или на определенный блок на странице.
Соблюдай иерархию и соответствие кнопок категории:
Целевые - доминирующие кнопки, максимально яркие и заметные.
Направляющие - Визуально легче и менее заметные.
05. Длина страницы
/Размер имеет значение/
Все статистики и исследования сводятся к одному. Сайты не скролят как Инстаграм. Нужно это осознать и принять. У пользователя просто нет времени на детальное изучение информации на сайте, его котики ждут в Инстаграм. У тебя есть около 5-15 секунд, чтоб заинтересовать, пока ему (ей) не придет очередное уведомление и не отвлечет от твоего сайта. Поэтому размещай всю важную информацию в первых 3-5 блоках на сайте. Если за эти 5 блоков тебе удастся заинтересовать пользователя, он с готовностью пойдет дальше.
06. Адаптивность
/Мне неудобно/
Мобильная эра настала. В 2020 году мобильный трафик превысил все остальные виды трафика. Тенденция на отказ от компьютеров в пользу мобильных устройств - налицо. Именно поэтому, важно адаптировать сайт под мобильные устройства. Сайт без адаптации практически не имеет шансов на просмотр с мобильных устройств. Ниже приведен чек-лист важных составляющих мобильной верстки:

Размер текста
Текст должен хорошо считываться и не напрягать зрение пользователя. Для мобильных устройств это размер не менее 16 px.

Размер кнопок
Убедись что они достаточного размера чтоб легко попасть в них пальцем. Как правило, этот размер от 42 до 72 px.

Воздух
Кнопки и ссылки должны находиться на достаточном отдалении друг от друга и от других кликабельных элементов, так как это может вызвать ложные срабатывания. Как правило, это не менее 28 px.

Кликабельность
Все телефоны и email адреса должны быть кликабельны, а так же соответствовать нормам набора номера в регионе. Это позволит легко сделать звонок или написать на почту в один клик.

Все на месте
Проверь, все ли элементы помещаются в размер экрана. Не появился ли горизонтальный скролл.

Мобильное меню
Используй мобильное меню, чтоб освободить место на главном экране.

Длина скрола
При наличии большой галереи или другого объемного блока, рекомендуется прятать часть контента под кнопку “Подробнее” или “Развернуть”. Также можно преобразовать блок в блок с горизонтальной прокруткой - это позволит пользователю добраться до блоков ниже.

Проверить визуальное отображение сайта на мобильных устройствах можно на сайте iloveadaptive.com
07. Сокращай
/Нет времени объяснять/
В современном быстром мире, внимание пользователя стоит очень дорого, поэтому, важно доносить информацию максимально сжато - без воды и украшательств речи. Только суть. Говори с пользователем на простом языке, убрав из речи “бюрократию”.
Проверить свой текст просто при помощи теста “Лифт”:
Представь, что ты с клиентом едешь в лифте и у тебя есть 45 секунд, чтоб рассказать ему о твоем продукте, пока не откроются двери и он не выйдет. Что ты скажешь?
Вся эта 45 секундная речь должна уместиться на сайте. Все остальное безжалостно выбрасывай.
08. Анимация
/Эй, стой, куда побежал?/
Анимация - это красиво? Нет. Правильно сказать Анимация - это удобно. Анимация на сайте должна служить именно для удобства пользователя. Она подсказывает и направляет. Об этой простой истине часто забывают как дизайнеры, так и клиенты. С этим инструментом нужно работать очень тонко и изящно, добавляя его только там, где это необходимо. Помни, что анимация всегда перетягивает на себя внимание. Располагая красивый анимированный объект рядом с текстом, будь уверен, что текст никто не прочитает.
Убедись, что на твоем сайте нет вредоносных анимацией. Проверить это достаточно просто. Глядя на анимацию ответь на вопросы:
• Анимация помогает продать эффективнее?
• Анимация направляет внимание пользователя в нужном направлении?
• Что-то изменится в худшую сторону, если ее не будет?
Если все три ответа “Да” тогда смело оставляй ее.
09. Терминалогия
/Не делай из меня дурака/
Я уверен, что ты хорошо знаешь свой продукт. Наверняка, ты не один год в своей нише и профессиональная терминология стала для тебя повседневными словами. Ты просто не понимаешь, как человек не может знать этого или другого слова. Но, правда в том, что большинство клиентов ничего не знают о продукте, который хотят. Возможно, они строят свой первый дом, или покупают свою первую машину. Они только разбираются в вопросе. В коммуникации с пользователями постарайся максимально убрать терминологию и специфические слова. Расскажи о продукте понятным языком.
Проверь текст на сайте с помощью теста “Baby”:
Представь (или сделай в реальности) что ты читаешь текст на сайте ребенку 6-7 лет. Поймет ли он то, что там написано? Если да - Отлично. Если нет - Упрости.
10. Будь на связи
/Абонент находится вне зоны действия сети/
Ничто так не влияет на конверсию сайта, как отключенный телефон. Проверь все средства связи которые указаны на сайте: номера телефонов, email, мессенджеры. Как не парадоксально, но часты случаи, когда рекламные кампании были провальными, только потому, что менеджер не оплатил мобильный телефон или разработчик допустил ошибку в номере на сайте. Отвечай на заявки не позже чем через 5 минут. Если это невозможно, сообщи пользователю, когда ты с ним свяжешься. Благо, при помощи ботов и автоответов, сейчас это доступно каждому.
Эти 10 улучшений позволят пользователям стать твоими покупателями. Путь клиента на сайте сегодня - это бег с препятствиями. Убери максимальное количество препятствий и помоги клиенту отдать тебе деньги. Спасибо, что дочитал до конца. Надеюсь этот небольшой гайд поможет тебе улучшить твой сайт или понять, что он идеален. Если у тебя возникли вопросы, буду рад ответить на них в телеграм.