Разбор дизайна сайта на Тильда

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

Видео - https://youtu.be/i1pZiwz9fYc?si=R6ZCe1vNTd4pqj2t 

Шапка сайта

Надпись под логотипом не совсем читаемая.

Совет 1. Лучше вынести ее справа, увеличить и исправить “размашистый” шрифт.

Момент со соцсетями. Они выделены черным цветом. Это вызывает ассоциации с чем-то серьезным, а не с детским. Это не совсем совпадает с фирменным стилем, так как на сайте присутствуют синий, красный цвета.

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

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

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

В основном нам нужны два поля: ФИО родителей и телефон, чтобы можно было связаться и узнать остальную информацию. Убрав лишние поля для заполнения, мы сможем увеличить конверсию.

Первый блок

Здесь странное исполнение истории. Эта штука хорошая, но, когда человек заходит на сайт, его сперва надо поприветствовать и рассказать, о чем этот сайт.

Совет 1. На первом блоке желательно поставить какую-нибудь фотографию, написать небольшой текст о школе (в логотипе маленькая надпись). Можно написать маленький приветственный текст и дополнить его текстом о том, что это за школа. Далее добавить кнопку, фотографию, а ниже сделать “Истории” (желательно их уменьшить”

Кнопка и заливка фона практически сливаются на последней истории. Совет 2. Лучше сделать карточку темной или красного цвета.

Второй блок - Направления обучения

Замечательный блок, есть практически все направления, краткое описание. Здесь вопросов вообще нет.

Третий блок - Видеоролик о языковой школе

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

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

А этот ролик можно оставить, но перенести его вниз.

Четвертый блок - Государственная образовательная лицензия

Как я понял, это уже преимущества. 

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

Пятый блок - Личный кабинет

Личный кабинет - тоже важная информация, но и ее можно перенести ниже.

Шестой блок - Наши достижения

Достижения классные, но их тяжело прочитать.

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

Шестой блок - Отзывы

Это хороший блок. Здесь можно прочитать отзыв и посмотреть его на ютубе. Это просто супер!

Седьмой блок - Фотогалерея

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

Текст идет в две строчки. Можно сделать переключение на 12 колонок в тильде и тогда он влезет в одну строчку.

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

Дальше идут достаточно информативные видео. Но они больше похожи на кейсы. Поэтому лучше сделать отдельно блок с кейсами.

Восьмой блок - Как хорошо ты знаешь английский?

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

Совет. Лучше добавить предложение “Оставьте заявку, а мы вам вышлем ссылку для тестирования вашего уровня английского языка”.

Девятый блок - Чем мы занимаемся?

Еще один блок, который уводит с сайта. Человек может уйти и вообще забыть, что он тут хотел найти. Этот блок тоже лучше убрать.

Дальше идет карта. К ней вопросов нет. Причем, тут соцсети сделаны так, как надо (это к вопросу соцсетей в шапке).

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

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

Подвал

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

Кнопку можно убрать. Когда мы нажимаем “Оплатить”, нас переносит в личный кабинет, от которого нет логина и пароля.

Совет. Лучше сделать кнопку “Оставить заявку”, либо небольшую форму и переместить ее куда-нибудь. Здесь она не к месту.

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

Структура

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

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

Направление и обучение оставляем.

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

После этого можно добавить блок с достижениями и немного его отредактировать (добавить возможность открытия фото на полный экран)

Далее — отзывы. А после них — форма обратной связи. Желательно к ней добавить какой-нибудь магнит. Например, “Записывайтесь и получите бесплатное пробное занятие” и тд. Таким образом можно собрать больше заявок.

После этой формы можно добавить галерею с фотографиями, а ниже — блок “О нас”, где кратко рассказать о достижениях.. Сюда же можно добавить видеоролик и совместить его с еще двумя, которые также есть на этом сайте.

Далее завершающая лид-форма, перед контактами, чтобы человек точно оставил заявку. Например, добавить акцию, что, при заполнении заявки на сайте, он получит бесплатное первое занятие. Таким образом еще уменьшится количество полей, которые надо будет вводить пользователям.

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

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

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

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