лендинги на тильде что это
Понимание принципов Landing Page
В отличие от сайта, на лендинге пользователю предлагают сделать что-то одно. Например, на сайт компании приходят самые разные люди. Кто-то, чтобы просто узнать о компании, другие, чтобы почитать о продуктах. Но на страницу с вакансией перейдут те, кому она интересна. Если страница с вакансией будет создана по определенным правилам и содержать в себе предложение (например, откликнуться на вакансию), ее тоже можно считать лендингом.
Такие страницы создают для узкой аудитории. Их эффективно использовать в рекламе и тогда, когда нужно сосредоточиться на чем-то определенном — продаже, информации, приглашении подписаться на рассылку и пр.
Если у вас есть бизнес или ваша деятельность связана с людьми, вам пригодится лендинг.
В этом курсе вы научитесь анализировать свою аудиторию, писать для нее убедительный текст, подбирать правильные аргументы и собирать из этого последовательное повествование на сайте.
В первом уроке мы расскажем, как работает лендинг и когда его можно использовать.
Что такое лендинг пейдж
Ну ладно. Подписываетесь на рассылку. Может быть, билет купите позже. И возвращаетесь на фейсбук.
Вы только что побывали на лендинге и сделали то, что от него хотели.
Трафик. Лендинг делают, чтобы вести на него конкретных людей, которым интересно именно это предложение. От аудитории зависит, как именно вы будете рассказывать о продукте.
Банк запускает программу кредитования «Первый бизнес». Обычно он работает с крупными бизнесменами, но этим продуктом будут пользоваться новички. Специально для них банк переходит на несвойственный ему язык и меняет деловой тон на человеческое общение. Вместо топовых клиентов показывает истории обычных людей, которые открыли магазин.
Кнопка. Лендинг последовательно подводит вас к конкретному действию. На обычном сайте достаточно, что вы что-то прочитали и запомнили. Для лендинга такой сценарий не работает. Нет кнопки — нет лендинга.
Все тот же банк и программа «Первый бизнес». На странице он несколько раз просит оставить номер телефона. Потом консультант банка позвонит и расскажет, как собрать документы. Это простое действие, и человек ничем не рискует. Оставить номер проще, чем сразу заполнять заявку.
Обзор конструктора сайтов Tilda: возможности, ограничения, советы
Руководитель и стратег в студии веб-дизайна и контент-маркетинга Svoemedia Александра Иващенко рассказала блогу Нетологии, как её команда использует Tilda в работе.
Сайты на конструкторе сайтов Tilda я начала делать ещё в 2014 году. Тогда это был настоящий прорыв по визуальной части: было ощущение, что прикоснулся к искусству, и до конца не верилось, что оно станет таким доступным. В маленькой группе на 400 человек (сейчас подписчиков 18 тысяч) мы обсуждали возможности Тильды, поддерживали команду платформы и давали советы.
Сейчас, в рамках Svoemedia, создание сайтов на Tilda стало полноценным направлением нашего бизнеса и предпочитаемой CMS. О её возможностях, функциях и об опыте нашей команды хочу рассказать в этом обзоре Тильды.
Дизайн: что можно сделать на Тильде и как это будет выглядеть
Начать дизайн сайта можно с чистого листа, используя Zero-блоки, или с готовых шаблонов и блоков, которые можно группировать по типу конструктора.
Готовые шаблоны
Шаблоны разделены на группы по тематике и назначению: Бизнес, Магазин, Событие, Контакты, Анкета.
Готовые блоки
Из библиотеки блоков можно выбрать самостоятельные дизайн-элементы: меню, текстовые блоки, изображения, видео, формы и кнопки, этапы, команда, отзывы, карты Гугл и Яндекс и так далее.
Готовые блоки автоматически подстраиваются под разные устройства — компьютер, смартфон, планшет. Для корректировки отступов или размера текста задайте режим отображения внизу настроек блока, двигая ползунок:
Подробнее о корректировке мобильной версии читайте в справочнике Тильды.
Текст и изображения
Для редактирования текста нужно кликнуть по нему. То же можно сделать из меню «Контент» (в стандартных блоках) и через «Редактировать блок» в Zero. Встроенный в редактор типограф для текстов убирает висячие предлоги, ставит правильные тире и кавычки.
Изображения можно загрузить с диска, перетащить, вставить ссылку на изображение в интернете. В стандартных блоках можно менять цвета, шрифты, иконки.
Zero-блоки
Для реализации сложных идей, мы используем Zero-блоки. В Zero-блоках все элементы создаются самостоятельно. Адаптировать сайт для разных устройств тоже нужно вручную.
Работа в Zero-блоке похожа на работу в графическом редакторе, только созданный индивидуальный дизайн можно сразу посмотреть в Тильде
Елена Сартасова, шеф-дизайнер Svoemedia
«Zero-тренды и минимализм в дизайне сайтов диктуют дизайнерам задачу больше акцентировать внимание на колористике и типографике. Главное – это контент, а дизайнер лишь создаёт атмосферу, помогающую считать его суть. Чем чище и однообразнее фоны и проще графика на сайте, тем интуитивнее и интеллектуальнее воспринимается сайт пользователем: когда ничто не мешает, сайт действительно хочется читать, а не просто рассматривать его дизайн. Простая блочная структура Тильды позволяет довольно легко создавать такой дизайн за счёт простоты компонентов: фон, текст, форма и картинка, которые есть в Zero-блоке и стандартных блоках».
С помощью Zero-блоков можно делать анимацию, но если сайт предполагает постоянную редактуру (особенно это актуально для сайтов мероприятий), нужно будет вносить правки во все разрешения.
Елена Сартасова, шеф-дизайнер Svoemedia
«Микроанимации — это возможность сделать сайт живым и говорящим. Тильда дает возможность настройки такой анимации. Сайт, дающий обратную тактильную связь, создает игру с пользователем, продлевая этим его время пребывания на сайте и упрощает знакомство с контентом».
Проанализировав задачи клиентов, мы создали библиотеку шаблонов на Тильде для типовых решений. Мы хотим, чтобы заказчики клиентов быстрее находили на сайтах то, что им нужно. А клиенты экономили деньги для развития бизнеса: такое решение позволило нам сократить стоимость разработки сайта для клиента в 12–15 раз.
Тильда позволяет делать эффектные сайты и, если овладеть её инструментами, сложно наткнуться на ограничения: немного изменив взгляд на элемент, можно адаптировать его без потерь.
Сценарии использования: для каких типов проектов подходит Тильда
Тильда — комфортная среда для создания, публикации, хранения и модификации проектов. В агентстве мы работаем преимущественно с большими проектами по классической схеме веб-разработки: схема, прототипирование, контент, дизайн, техническая оптимизация.
Тильда позволяет исключить полностью дорогостоящие этапы HTML-верстки и программирования и сократить стоимость разработки для нашей команды и клиента.
Александра Назмеева, менеджер проектов Svoemedia
«Тильда позволяет вовсе не привлекать полноценного разработчика даже для многостраничных сайтов (исключение — сложные калькуляторы и иные нетиповые задачи). По сравнению с разработкой сайтов полного цикла, сайты на Тильде сокращают время создания крупных проектов до 1,5–2 месяцев, включая этапы от прототипирования и написания контента до запуска работоспособной версии».
Сайт компании и лендинги
Если нужен сайт-презентация продукта или услуги, посадочная страница с формами обратной связи — Тильда подойдёт идеально.
Функции личного кабинета пользователя в Тильде на данный момент нет. В проекте компании UNIUP все презентационные страницы и блог сделаны на Тильде, а личный кабинет — внешняя ссылка на другой сайт:
Личный сайт или портфолио
На Тильде можно собирать сайты-портфолио, личные сайты специалистов.
Контент-проекты
На Тильде мы сделали и ведём самое большое медиа по химической промышленности в России: проект Инжинирингового химико-технологического центра в Томске.
Для этой ниши цифры очень приятные — 10 000 посетителей в месяц. По словам Ильи Мазова, директора по развитию ИХТЦ, контент-проект приносит от 15% годового оборота компании.
Максим Колташов, главный редактор SVOEMEDIA
«Я рад, что команда чаще всего использует для вёрстки статей именно Тильду: это позволяет разместить нужные блоки (подписка, ссылка на соцсети, перелинковка на другие материалы) быстро и именно там, где мне это необходимо. Результат всегда эстетически приятен, что улучшает поведенческие характеристики и в итоге положительно сказывается на ранжировании сайтов».
Полезные функции Тильды для контент-проектов:
В Тильде есть возможность дополнить текстовый контент фото- или видеоматериалами, что делает её удобным решением для публикации книг и лонгридов.
Как создать лендинг
на Тильде?
Лендинг пейдж — не только модный термин, это эффективный инструмент для получения лидов.
Сегодня поделюсь секретами разработки лендинга на платформе Tilda.
Для разработки landing page Тильда отлично подходит.
С помощью нескольких сотен блоков, имеющих функцию индивидуальной настройки, вы без проблем и лишних затрат сможете запустить собственный уникальный лендинг.
Он может быть самостоятельным ресурсом или дополнять основной сайт компании.
Построение лендинг пейдж не занимает много времени: при наличии даже небольшого опыта этот процесс займёт всего пару часов.
Если опыта нет совсем — не беда, просто вам потребуется чуть больше времени и советы мастеров.
Landing page дословно — «целевая страница».
Часто люди ошибаются, считая лендинг рекламной площадкой. Это не так или не совсем так.
Лендинг создаётся для достижения конкретной цели, стоящей перед разработчиком. Не пытайтесь решать глобальные задачи компании с помощью такой страницы. Для реализации различных групп товаров существуют интернет-магазины.
Если же цель — пригласить как можно больше гостей на ближайшее мероприятие, распродать коллекцию солнцезащитных очков до завершения сезона или организовать акцию в поддержку участника международного конкурса — создание лендинг страницы будет оптимальным решением.
Структура лендинг пейдж
Подписался на рассылку, заполнил анкету, зарегистрировался на мероприятие, купил билет, скачал презентацию, заказал обратный звонок…
Конечное действие посетителя лендинг пейдж — то самое целевое действие, ради которого он был создан.
Рассказываем о том, что предлагаем.
Здесь важно не переборщить, но и не упустить главные моменты и аргументы, которые, во-первых, заставят посетителя дочитать до конца, во-вторых, мотивируют его на действие.
Даём посетителю возможность стать вашим лидом, то есть совершить действие, ради которого всё затевалось.
Рассказываем, почему важно купить этот продукт/присоединиться ко встрече/заказать услугу.
Купить, подписаться к рассылке, зарегистрироваться на курс, принять участие в опросе.
Чётко и ёмко сформулируйте, что должен сделать посетитель и разместите призыв на интерактивную кнопку.
Заголовок должен полностью соответствовать тематике сайта, в нём заключается основной посыл лендинга. Это отправная точка, которая логически завершается действием пользователя.
Заголовок имеем ещё одну важную функцию — он помогает не только привлечь публику, но и отсечь всех тех, к кому данная целевая страница не имеет никакого отношения.
Краткость —
сестра таланта
Всё. Ваш клиент уже жмёт на кнопку «Регистрация».
На самом деле объём текста напрямую зависит от характера продукта и целевой аудитории. Если ваши клиенты — люди научного склада ума с классическим образованием, которые ценят информацию, любят анализировать и размышлять, подарите им такую возможность, максимально раскрыв суть предложения и характеристики предлагаемой продукции или решения.
Обращаясь к молодым энергичным людям, которые превыше всего ценят время, оградите их от лишних данных и просто подведите к результату. В таком случае вместо текста уместнее разместить впечатляющие иллюстраций, демонстрирующие продукцию, её качества и счастливых обладателей.
Точно в цель!
Для получения максимальной отдачи требуется знать собственную целевую аудиторию, только в этом случае «стрелы Амура», пущенные с лендинг пейдж, достигнут сердец пользователей.
Распространённая ошибка многих разработчиков (и не только новичков) — попытка охватить каждого без исключения пользователя Рунета. Такое рассеивание внимания ни к чему не приведёт.
От портрета и характера посетителя зависит не только то, что и где вы будете предлагать, но и как это лучше сделать.
Возрастных характеристик и данных об образовании здесь будет недостаточно. Определите, что объединяет вашу аудиторию и потребителя предлагаемого продукта. Только так можно достучаться до клиента.
Предлагая приобрести автомобиль по специальной цене до конца месяца, нет смысла охотиться за туристами, в первый и последний раз посетивших страну, и составлять текст на трёх языках.
Правила хорошего тона
Вспоминаем, чему нас учили родители и пророки.
Обманывать плохо.
Это правило работает и в отношении лендинга.
Не пытайтесь хитрить и прятать продажи под аттракцион невиданной щедрости и раздачу подарков «просто так». Переходы на заманивающие обещания с попаданием на продажу стандартной продукции по стандартной же цене воспринимается как развод.
К сожалению, из-за обманных или ошибочных действий сеошников о лендингах сложилось нелестное мнение. Тысячи пользователей воспринимают такие целевые страницы как «замануху» и надувательство. Бороться с таким положением вещей можно только создавая «честный» лендинг для заинтересованных людей.
Лучше один раз увидеть
Лендинг, как и любой сайт, должен максимально отражать реализуемую идею. Чтобы донести свою мысль до пользователей без потерь, сайт должен «говорить» на вашем языке. Дизайн в этом вопросе — не последний по важности элемент.
Оформление страницы должно отвечать всем требованиям, которые предъявляются качественному лендингу: привлекать, отражать главную мысль, мотивировать сделать правильный выбор. В остальном внешний вид сайта может отличаться от подобных, это будет скорее плюсом.
Главная задача дизайна — помочь максимально подробно рассказать о продукте, а не просто удивить или поразить. Наихудший варианта — когда дизайн отвлекает от главной идеи и товара.
Тильда позволяет реализовать любые дизайнерские решения.
Если библиотечных блоков недостаточно, чтобы донести вашу мысль, воспользуйтесь безграничными возможностями, которые даёт функция построения уникального блока — зеро блок.
Используйте видеоролики, рисуйте, загружайте и сочетайте графику по собственному вкусу. Никаких ограничений. Только так можно выделиться на 100 % и завладеть аудиторией.
Здесь и сейчас
Лендинг размещают на одной странице. И это не признак экономии пространства или бедности идей. Каждый переход на другую страницу рассеивает внимание и отвлекает от главного, уводят от цели, ради которой был создан сайт. Попытки опутать пользователя в итоге приведут лишь к его запутыванию и уходу.
Структура лендинга должна подчиняться его задачам. И пусть страница будет бесконечно длинной. Если созданный вами контент соответствовать всем требованиям эффективного лендинга, он будет с интересом изучен. Но только вы должны вести пользователя по странице, располагая информацию в том порядке, в котором она лучше отвечает поставленной цели.
Чёткой единой схемы размещения и подачи материла для эффективности лендинга не существует. Информация должна быть логичной, данные следовать в определённой последовательности.
Во время изучения посетитель не должен потерять нить повествования и запутаться в цепи событий. В остальном — создайте оптимальную схему для страницы, которая будет удобна пользователям и понятна вам.
Инструкция: как сделать лендинг для онлайн-школы без дизайнера и программиста
Лендинг (или landing page) — одностраничный сайт. Его цель — продать товар или услугу посетителям. Сегодня расскажем, как сделать такую продающую страницу с помощью конструктора Tilda: быстро, просто, можно бесплатно.
Что такое Tilda
Tilda или «Тильда» — конструктор сайтов: лендингов, визиток, корпоративных порталов и так далее. В нём можно создать любой веб-ресурс без знаний, кода буквально за полчаса. Всё настраивается мышкой и клавиатурой, а результат впечатляет — конструктор используют даже крупные компании.
Лендинг банка «Точка» тоже сделан на Tilda
Создание сайтов на «Тильде» проще, чем разработка на обычных CMS. Чтобы получить стандартный веб-ресурс, нужно заказать его разработку у программиста, привлечь дизайнера, SEO-оптимизатора и других диджитал-специалистов. А в конструкторе можно сделать всё самому.
Основные преимущества Tilda:
У Tilda есть больше 480 шаблонов для разных сайтов, готовая интеграция с 12 сервисами для лендингов, интеграция с другими веб-ресурсами через API и многое другое.
Предусмотрено несколько тарифов: один бесплатный, два платных. На бесплатном функции ограничены, можно создать 1 сайт до 50 страниц. На платном Personal доступны 1 сайт, более 50 страниц, подключение своего домена, полная коллекция блоков. На платном Business всё то же самое, но можно создавать до 5 сайтов и экспортировать исходный код. Цена начинается от 500 рублей.
Для дизайнеров есть «нулевой блок», чтобы верстать страницы без шаблонов. Полный список возможностей смотрите на сайте «Тильды».
Как создать лендинг на Tilda
Сначала определитесь, какой тариф вам нужен. Если готовы мириться с некрасивым URL лендинга, не платите. Адрес сайта будет выглядеть примерно так: project89098219.tilda.ws.
А если хотите потом перенести лендинг на свой домен, получить максимум возможностей редактирования или создать несколько продающих страниц, заплатите за расширенный тариф.
Зарегистрироваться на сайте просто — достаточно придумать пароль, указать адрес электронной почты и имя. После регистрации создайте проект: его название ни на что не влияет, оно нужно, чтобы вы сами поняли, какой сайт соответствует проекту. Когда зайдёте в проект, нажмите «создать новую страницу».
В новом проекте нет ничего — нажмите сюда, чтобы создать лендинг
Перед вами откроется список шаблонов. Лендинги расположены в первом разделе «Бизнес». Посмотрите список и выберите подходящий шаблон — в базе уже есть готовые решения для разных типов бизнеса. Если хотите сделать что-то уникальное, выберите пустую страницу — она первая в списке. Работать с шаблонами проще, поэтому в примере мы будем использовать шаблон «универсальный лендинг».
Лайфхак: если хотите посмотреть, как выглядит шаблон полностью, наведите на него курсор. Изображение будет прокручиваться.
В шаблоне уже есть подсказки: что и где писать, какую информацию нужно разместить, куда добавить логотип.
В Tilda есть готовые решения для разных типов бизнеса
Когда выберете шаблон, попадёте в меню редактирования. Чтобы поменять текст, достаточно кликнуть на него мышкой. А чтобы изменить цвет заголовков, подзаголовков, фона, нажмите на «Настройки» нужного блока.
На одном экране можно полностью изменить весь блок: и содержание, и оформление
Доступны стандартные средства форматирования. Например, можно написать текст, выделить его и сделать жирным, подчёркнутым, изменить размер, выравнивание, межстрочное расстояние.
Выделите текст, и вверху появится панель для визуального редактирования
Даже без фона вы можете сделать нормальное форматирование и расставить цветовые акценты — например, выделить оффер или контакты.
Лайфхак: если случайно удалите весь текст, не сможете потом просто кликнуть по тому же месту и написать новый. Текст можно снова добавить через «Контент».
В «Настройках» можно менять всё что угодно. Например, убрать из шапки сайта пункты меню или оставить их, чтобы пользователь сразу мог перейти к контактам, преимуществам, другому экрану. А ещё можно поставить свои ссылки на кнопки социальных сетей, добавить нужный URL в конверсионные кнопки, поменять там текст, описания преимуществ и так далее.
Изображения можно заменить, просто кликнув по ним. Только будьте внимательны с размерами файлов: лучше, чтобы они были такие же, как в шаблоне. Иначе оформление может «полететь».
Нажмите на изображение и загрузите своё в открывшемся окне: по ссылке или с компьютера
Если нужно быстро поменять всё оформление блока, можно сделать это за пару нажатий мышкой. Нажмите на цифры в левом верхнем углу и выберите подходящее. Эта функция есть не на всех блоках — иногда чтобы полностью изменить оформление, надо добавить новый модуль.
Нажмите сюда, а потом наведите курсор на какую-нибудь строку — сбоку покажут, как выглядит это оформление
Чтобы полностью поменять структуру лендинга, можно добавлять новые и удалять старые блоки. Например, убрать экран с рассказом о компании и добавить модуль, в котором опишете программу обучения на вашем курсе. Сделать это просто.
Так можно удалять и добавлять новые блоки
Через функцию добавления новых блоков можно добавить якорные ссылки. Потом их нужно разместить в шапке сайта. Например, если добавили якорную ссылку перед блоком с формой обратной связи и контактами, разместите в шапке сайта ссылку «Контакты» — пользователь сразу сможет перейти к ним. Такие ссылки доступны только на платных тарифах.
После того как всё настроили, можете посмотреть, как будет выглядеть сайт, заполнить метаданные для него, задать общие настройки.
У Tilda очень много возможностей — например, в «Настройках» можно установить, как сайт будет выглядеть в поисковой выдаче и на Facebook
Если выберете платный тариф, получите больше возможностей — например, сможете выбирать больше типов оформления, перенести сайт на свой домен или хостинг.
Создать лендинг на Tilda легко. Но недостаточно просто разобраться в конструкторе и сделать пару блоков. Чтобы лендинг работал, нужно грамотно подойти к его оформлению.
Что сделать, чтобы лендинг работал
На самом деле сделать надо не так уж и много. Можно начать с малого — выбрать структуру, соответствующую вашему бизнесу. В шаблонах Tilda уже есть подсказки, можно просто следовать им.
Изучите свою целевую аудиторию перед тем, как создавать лендинг. Узнайте, сколько им лет, чем занимаются, какие цвета любят, какие термины не хотят видеть. И пишите понятный текст для конкретных людей: тогда он «выстрелит».
Чтобы повысить конверсию стандартного, шаблонного лендинга, заранее проработайте структуру. Важно составить её так, чтобы потенциальный покупатель понял свою выгоду от покупки. Чаще всего в структуре используют:
Можете вдохновиться примерами сайтов на Tilda— посмотрите, как делают лендинги и другие веб-ресурсы разные компании, чтобы подобрать оптимальную структуру для своей ниши.
Правильная структура — ещё не всё. Лендинг должен внушать доверие. Поэтому пишите правду — не стоит приукрашивать реальность, особенно если всё перечисленное вами можно легко проверить. А ещё не усложняйте восприятие — пишите коротко, понятно и ёмко.
Ваш лендинг должен быть простым, понятным и серьёзным. Тогда он будет работать хорошо.
На Tilda можно быстро создать конверсионный лендинг, если разобраться с настройками конструктора и писать просто, понятно для целевой аудитории. Чтобы получить максимальную отдачу, тестируйте разные изменения на лендинге: смотрите, как влияют на конверсию цвета кнопок, заголовки, расположение модулей. Тогда сможете найти самый удачный вариант.