Возможно, ваш сайт не работает ― 3 критерия, чтобы это понять

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

Возможно, ваш сайт не работает ― 3 критерия, чтобы это понять

Всем привет, мы — студия Молния. Более 6 лет разрабатываем сайты на Тильде и помогаем бизнесу приносить лиды. В нашем портфолио 1180+, поэтому нам всегда есть что сказать о дизайне лендингов и многостраничников : )

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

На аудитах сайтов для наших клиентов мы ищем ошибки в трех составляющих ― копирайтинг, UI и UX.

А теперь давайте разберем их вместе ↓

Копирайтинг

Пользователи тратят в среднем 5,59 секунды на просмотр текстов на сайте. Решат ли эти тексты задачу бизнеса или просто заполнят пустое пространство ― зависит от мастерства копирайтера.

Мы неоднократно сталкивались с сайтами, которые заполнены полотнами текстов без конкретики и призыва к действию. Порой по тексту вообще непонятно, что предлагает компания. Разберем примеры, как делать не надо.

Водяные формулировки

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

О педагогах международного уровня сайт рассказывает только в последнем абзаце, хотя это одна из главных фишек!

Возможно, ваш сайт не работает ― 3 критерия, чтобы это понять

Обилие текста и смыслов на одном экране

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

Раздел про безопасность смотрится неуместно и просится в отдельный блок
Раздел про безопасность смотрится неуместно и просится в отдельный блок

Вчитываемся в текст и снова замечаем воду — «дети раскрывают таланты, находят друзей», «постоянно ведется видеонаблюдение».

Важный недостаток сайта: никто не будет читать так много статичного текста на одном экране. Нужно визуальное подкрепление.

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

На другом слайде слева много места, а справа экран перегружен. 
На другом слайде слева много места, а справа экран перегружен. 

Нет призыва к действию

Это главная ошибка в копирайтинге сайтов!

На уже упомянутом сайте нет возможности совершить целевое действие ― отсутствует форма заявки или заказа обратного звонка. Вместо нее лишь «Есть офис в Москве» и всё.

Сайт не дает пользователю возможность совершить целевое действие
Сайт не дает пользователю возможность совершить целевое действие

Мало полезной информации

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

Текст не структурирован, его сложно воспринимать из-за отсутствия визуальной иерархии
Текст не структурирован, его сложно воспринимать из-за отсутствия визуальной иерархии

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

Текста много, но он не отвечает на важнейший вопрос: какие условия, ограничения по количеству участников, сколько это стоит, сколько длится вечеринка? 
Текста много, но он не отвечает на важнейший вопрос: какие условия, ограничения по количеству участников, сколько это стоит, сколько длится вечеринка? 

Текст не разбит на смыслы

Рассмотрим блок «Где проходят праздники».

Полотно текста можно заменить простыми и понятными тезисами
Полотно текста можно заменить простыми и понятными тезисами

Весь текст можно было разбить на три пункта:

  1. Студия в центре Москвы
  2. Площадку выделяют только под ваш праздник
  3. Уборка после вечеринки включена

Пункты можно было сделать иконками для более простого восприятия.

Повторы блоков

Финальный блок в том же сайте не воспринимается как финальный. Предыдущий за ним экран полностью дублирует расположение элементов и передает схожие мысли, например, также упоминает менеджера. Кнопки с призывом к действию тоже повторяются на двух разделах подряд. Все содержание блоков можно сократить, а сами разделы — объединить в один.

Возможно, ваш сайт не работает ― 3 критерия, чтобы это понять
Два аналогичных по смыслу и структуре экрана — это грубая ошибка
Два аналогичных по смыслу и структуре экрана — это грубая ошибка

Как не испортить сайт копирайтингом? Примеры от Молнии

Посмотрите наш сайт для Fill Camp — никакого лишнего текста, а тот, что есть, хорошо читается и доносит основные мысли.

По первому экрану сразу понятно, что предлагает компания
По первому экрану сразу понятно, что предлагает компания

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

С первого экрана сразу понятно предложение для посетителя
С первого экрана сразу понятно предложение для посетителя
Контрастные заголовки и небольшие подписи помогают передать всю суть
Контрастные заголовки и небольшие подписи помогают передать всю суть
В другой своей статье мы рассказали об этом кейсе подробнее.

UI-дизайн

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

Дизайн во многом субъективен. Но как тогда понять, какой сайт понравится аудитории? Наш совет — смотрите на исследования и работы лидеров рынка. По мнению Freelance.today, главными тенденциями веб-дизайна являются:

  • Яркие цвета;
  • Минимализм;
  • 3D-элементы;
  • Крупная типографика;
  • Интерактив;
  • Использование ИИ для навигации и системы рекомендаций.
Кстати, в недавней статье рассказали о трендах в дизайне сайтов на 2025 год.

Хотите увидеть пример худшего UI? Посмотрите на The Big Ugly Website. На этом сайте дизайнеры продемонстрировали все недостатки устаревшего дизайна и запутанного юзабилити.

Делимся скрином  The Big Ugly Website, его заголовки и верстка экрана говорят за себя :)
Делимся скрином The Big Ugly Website, его заголовки и верстка экрана говорят за себя :)

UX-дизайн

UX — это пользовательский опыт, то как сайт будет работать.

Если UI отвечает за внешний вид площадки, то UX — за ее функционал и логику.

Проверьте, чтобы на сайте были:

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

Практикуйте «взгляд новичка» — попробуйте воспользоваться сайтом, как будто видите его впервые. За что сразу цепляется взгляд, что непонятно?

Возьмем конкретный элемент интерфейса — форма заявки.

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

Такую форму предлагает наша студия. Довольно лаконично :) 
Такую форму предлагает наша студия. Довольно лаконично :) 

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

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

Другая наша форма на сайте как раз имеет больше полей — и помогает определиться с услугой и запросом
Другая наша форма на сайте как раз имеет больше полей — и помогает определиться с услугой и запросом

Теперь переходим к ошибкам UX:

Кнопка не ведет к целевому действию

Рассмотрим сайт доставки цветов. По клику на кнопку «Купить» открывается карточка товара, в которой непонятно, что делать дальше — кнопки нет, формы заказа или корзины тоже. Нажимаешь «купить» — а там окошко с подробностями о товаре.

Только при пролистывании вниз появляются две кнопки «Заказать» и «В корзину» — пользователь вынужден выполнять одно и то же действие два раза подряд и снова нажимать на кнопку

Жмем кнопку «Купить», а сразу купить не получается 
Жмем кнопку «Купить», а сразу купить не получается 
Чтобы заказать цветы на этом сайте, придется быть внимательным юзером ;)
Чтобы заказать цветы на этом сайте, придется быть внимательным юзером ;)

И-и-и вишенка на торте, даже долистав до «Заказать», нельзя просто так взять и заказать цветы. Эта кнопка ведет на форму регистрации данных. Увлекательный аттракцион, не правда ли?

Не все сценарии целевого действия работают

На главной странице сайта грузинского ресторана нет, как минимум основных целевых действий «Забронировать столик», «Посмотреть меню», «Узнать адрес», «Посмотреть интерьер». И к этим запросам всегда нужен быстрый доступ.

Возможно, ваш сайт не работает ― 3 критерия, чтобы это понять

Еще кнопка брони стола находится в подвале сайта. А чтобы найти адрес ресторана, нужно полистать его вкладки. Может быть, вам повезет и вы найдете его быстро! Это лотерея, не иначе.

Возможно, ваш сайт не работает ― 3 критерия, чтобы это понять

Как отразить ключевые элементы интерфейса? Пример Молнии

Демонстрируем нормальное юзабилити — сайт пивного ресторана «Дубинин». На первом экране сразу видим адрес, номер телефона и кнопки для бронирования. Самая важная информация, которая ведет к продаже.

Все важнейшие элементы интерфейса заметны
Все важнейшие элементы интерфейса заметны

На нашем сайте для цветочного магазина Nezab кнопка «Купить» сразу ведет на форму заказа

Для заказа достаточно нажать кнопку и заполнить форму
Для заказа достаточно нажать кнопку и заполнить форму

Хотите разобраться, что не так с вашим сайтом? Приходите на бесплатный аудит. Мы разберем его с точки зрения копирайтинга, дизайна UI и UX и подскажем, как сделать лучше.

Закажите бесплатный аудит сайта бизнеса прямо сейчас 🔥

А еще заглядывайте в наше портфолио с кейсами!

Кстати, подписывайтесь на наш Молниеносный Телеграм-канал! Там мы делимся бизнес-хаками по дизайну сайтов и последними трендами рынка. Всем рады :)

1212
88
реклама
разместить
13 комментариев

Даже хороший дизайн не спасёт, если кнопки не ведут к целевому действию — это как пустая упаковка без содержания

5

Да и об этом должен знать каждый

1

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

1

Мой диз обожает кнопку "ПОЗНАКОМИМСЯ", которую впихнул на оба моих сайта справа вверху. Ваши комментарии о целевом действии данной кнопки?

1

Пришлите ссылку на разбор:
flashfamily.ru/consultation