Разбор ошибок в дизайне сайта на Тильда 2024

Всем привет! На связи студия маркетинга IMpro.pro и практикующий веб-дизайнер Никита. В рамках нашей программы я разберу сайт - инструктора по горным лыжам и сноуборду в Красной поляне. Затягивать не буду, сразу перейду к делу.

Видео разбора — https://youtu.be/jv3eYZILiqA?si=5GW8KEo_J_U0enIT 

На первом экране мы сразу видим призыв к действию — «Запишитесь на занятие прямо сейчас» и кнопки «Записаться» разными способами. 

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

А теперь давайте пройдемся по каждому блоку более детально.

Первый экран

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

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

В нашем случае можно сделать что-то похожее. 

Совет. Разделить кнопки, чтобы хотелось кликнуть (обратить внимание) на акцентную. 

Что именно можно сделать? Например, добавить иконки к этим кнопкам, тогда они будут смотреться интереснее.

В глаза бросается разное расстояние между кнопками: 30 и 40 пикселей. Это лучше исправить 

Еще один момент по первому экрану. Так как это сайт инструктора, то нужно поместить его на главный экран, например, справа (большой картинкой), а текст с кнопками переместить влево.

Второй блок

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

Совет. Увеличить фотографию, сделав ее на весь экран, как пример. Увеличить кегль текста, а кегль заголовка сделать по типу других заголовков на сайте.

Третий блок

К этому блоку вопросов нет. А сами «Услуги» разберем чуть позже.

Четвертый блок — Стоимость услуг

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

Пятый блок — Выберите место для катания

Здесь все понятно. Только логотипы упираются в края своих рамок. Им надо дать «подышать». Как это сделать? Уменьшить логотип, поставить на белую подложку.

Шестой блок — Часто задаваемые вопросы

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

Смотрится небрежно, из-за чего выбивается из общего фона сайта. 

Совет. Увеличить отступ, нижний блок «Довольные ученики» залить серым. 

Седьмой блок — Довольные ученики

Одни фотографии — хорошо, но фото + текст — вообще отлично!

Совет. Добавить текстовые отзывы, чтобы у клиентов было более лояльное, доверительное отношение к вам. Желательно, чтобы их можно было проверить: перейти на страницу человека, либо на место, где эти отзывы находятся (2гис, Яндекс.Карты и тд)

Восьмой блок — Может быть интересно

Здесь вопросов нет

Девятый блок — Наши контакты

Выполнено аккуратно, ничего лишнего

Общее мнение по странице

Такое чувство, что страница не хочет продавать. Она просто рассказывает про Павла и его услуги.

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

То есть, мы должны надавить на боль этого человека, сконцентрировать его на ней.

1. Человек зашел на сайт и увидел, что попал на страницу инструктора по горным лыжам. Это то, что ему нужно.
2. Дальше вы рассказываете, почему плохо кататься без инструктора, и, чем это черевато. Допустим: «Если у вас нет опыта, то можете получить травмы»
3. Рассказываете, что только вы сможете решить эту проблему. Приводите аргументы, почему стоит обратиться именно к вам.
4. Входите в доверие, рассказывая о себе, услугах, показываете, что у вас есть то, чего хотят клиенты, показываете тарифы.
5. В конце ставите отзывы, чтобы человек уже понял, что хочет кататься именно с вами. 

Так я вижу примерную структуру этой страницы. Таким способом можно ее улучшить со стороны маркетинга. 

Детальный разбор страниц

 «Услуги»

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

Совет. Разбить текст на абзацы. Еще лучше — добавить блок с иконками. Здесь я бы сделал заголовок побольше, текст поменьше и разместил их в ряд. Так смотрелось бы более организованнее и привлекательнее.

«Детская школа по сноуборду»

Здесь такая же история. Такой большой текст никто читать не будет + в нем даже не выделены заголовки, как это было в «Услугах», просто полотно текста. Сейчас стандарт в интернете — клиент читает только заголовки. 

То есть надо подходить к верстке блоков так, чтобы все читалось на одном дыхании. Но это не значит, что надо избавляться от текста.

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

Совет. Разнообразить верстку, чтобы клиента привлекали новые, интересные блоки. 

«Галерея»

Галерея сделана хорошо. Классно, что она есть. Можно посмотреть на счастливых людей, которые катаются на лыжах и сноубордах. 

Совет. Добавить страницу «Отзывы», где была бы собрана обратная связь от клиентов, желательно с фотографиями.

Вот мы и прошлись по всем остальным страницам. Подведу итог.

На некоторых страницах кнопки разного размера. Например, на странице «Фрирайд» кнопка «Записаться» меньше остальных + разные отступы. Это тоже влияет на то, как клиент будет воспринимать контент сайта. 

Общее впечатление

Видно, что над сайтом старались. Сделали много страничек. Я понимаю, что от каждой услуги блок сделан вручную. 

Стоит доработать маркетинговую составляющую сайта, поработать над акцентом и подачей информации и все будет отлично!

Советую добавить больше «живых» фотографий, которые у вас в «Галерее». Лучше использовать свои фото (пусть они будут не очень хорошие), нежели брать их из фотостоков.

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

Если вы хотите научиться работать на Тильде, открыть для себя новые фишки или отправить свой сайт на разбор, то подписывайтесь на наш канал “О Тильда” 

Всем пока! До новых видео!