В последнее время различные конструкторы сайтов набирают бешеную популярность. Tilda Publishing – один из таких ресурсов, причем который используют как новички без каких-либо навыков программирования, так и профессионалы. Сегодня мы поможем вам разобраться с тем, как создавать сайт на Тильде.
Почему вам стоит создать сайт на Tilda?
Этот конструктор стал популярным у дизайнеров, фрилансеров, программистов не просто так – у него есть определенные преимущества, которые в некоторых случаев позволяют даже конкурировать с полноценной CMS.
Как любой конструктор – работа с ним не требует специальных навыков программирования. Система сама подскажет вам, что можно сделать на каждом этапе создания сайта. Ресурс предоставляет готовые шаблоны и решения, комбинируя или изменяя которые можно получить очень достойные результаты.
Основным отличием Tilda от других конструкторов – большая ориентация на визуальную составляющую, а такжее читабельность контента. Над платформой хорошо потрудились в плане интеграции визуального и текстового контента, а также типографикой. Именно поэтому многие крупные контентные ресурсы делают на этом конструкторе лонгриды.
Кроме них, Tilda подойдет для быстрого запуска конверсионных landing page, контент-проектов, корпоративного сайта, интернет-магазина, сайта-визитки с портфолио и т.д.
Стоимость разработки сайта на Тильде
У конструктора есть три тарифных плана (цены указаны при условии оплаты на год):
Тариф Цена в месяц Возможности Free Бесплатно 1 сайт, до 50 страниц, 50 мб дискового пространства, возможность зарегистрировать ресурс только на поддомене Tilda Personal 500 рублей Сайт на платном домене (.ru или .com), до 500 страниц, 1 Гб на диске, полный доступ к библиотеке модулей Bussines 1000 рублей Тоже что и тариф Personal + опция экспорта кода на сервер, до пяти
Выбор тарифа зависит от формата сайта, который вы хотите создать, а также потребностей владельца.
Начинаем разработку на Tilda
После того как вы определились с тарифным планом пора приступать к созданию сайта.
Распланируйте будущий ресурс
Прежде чем приступать к работе непосредственно в конструкторе, отложите мышку с клавиатурой и возьмите карандаш с листом бумаги. Распишите подробно то, какие задачи должен решать ваш сайт, как он будет выглядеть, что и как будет опубликовано на страницах. Посмотрите на уже готовые шаблоны в Tilda: есть ли среди них те, что подходят вам. Если вам ничего не понравилось, то придется создавать с чистого листа с помощью готовых блоков.
На отдельном листе нарисуйте то, как должны располагаться блоки на странице, что в них будет находиться. Для того чтобы сайт в целом хорошо выглядел, необходимо хотя бы минимальное знание основ дизайна, а также понимание того, как посетитель будет взаимодействовать с ресурсом.
Если вы совсем не доверяете своему вкусу или не хотите разбираться в дизайне и юзабилити, то просто выберите наиболее близкий в вашей задаче шаблон. Все они удобно разделены по тематическим категориям:
- бизнес;
- магазин;
- событие;
- блог;
- контакты;
- анкета;
и другие…
При этом не стоит бояться, если что-то в шаблоне вам не совсем подходит – все блоки и элементы можно перемещать, изменять или удалять.
Подобное планирование даст вам четкое представление того, каким будет ваш будущий ресурс.
Небольшое резюме по этому разделу.
Перед началом разработки необходимо записать минимум такую информацию:
- цель и задачи проекта;
- структура сайта: список и иерархия;
- функционал и дизайн всех страниц.
Работа над блоками
После того как прототип готов и вы зарегистрировались, то пора приступать к разработке. Сразу после создания необходимо подключить ресурс к различным метрикам. Также можно добавить контейнер Google Tag Manager и подключить домен (если у вас тариф Personal). Далее, произведите остальные технические настройки.
Теперь, когда все готово, начинайте настраивать сами страницы. Чтобы создать ее, нажмите соответствующую кнопку в панели управления сайтом. Выберите шаблон и отредактируйте модули, добавьте контент. Чтобы не запутаться просто следуйте инструкциям платформы – все блоки максимально визуализируются, позволяя сразу понять, как будет выглядеть страница.
В «Настройках» блоках доступны возможность настраивать его внешний вид, размеры, диапазон видимости на разных экранах, типографики (на некоторых блоках). Можно прописать заголовки Н1, Н2 и Н3.
В меню «Контент» вы добавляете текстовую и визуальную информацию в блоки. Загрузите на сайт необходимую информацию. Также возможно добавлять контент не открывая меню – прямо в визуальном редакторе. Оценить общий масштаб и функциональность страницы поможет инструмент «Карта модулей».
SEO-оптимизация
Конструктор позволяет произвести вам базовую SEO оптимизацию. Вам доступно:
- сниппет страницы в социальных сетях и поисковой выдачи;
- meta-данные (title, description, keywords);
- канонический URL;
- запрет на индексирование поисковыми системами;
- действия со ссылками на странице;
- привязка ID приложения Facebook и аккаунта Twitter;
- настройка параметра «экспорт»;
- возможность внедрения вставки кодов отслеживания или микроразметки Schema.org.
Публикация страницы
После того как вы закончили с настройками внешнего вида, контента и SEO, публикуйте получившуюся страницу.
Не забывайте, что Tilda позволяет использовать разные шаблоны для каждой страницы и вам необязательно делать «Услуги», «Портфолио», «Блог» одинаковыми. Более того, в библиотеке шаблонов уже есть адаптированные под конкретные варианты макеты. Главное в этом деле, не переборщить и не ухудшить пользовательский опыт.
Пример главного экрана нашего лендинга. Весь сайт можете посмотреть по ссылке: b2b.olprime.ru
Что еще может Tilda?
Кроме очевидного создания страницы, конструктор также предоставляет ряд дополнительных возможностей для решения специальных задач:
- Интеграция с Bitrix. Если у вас уже есть основной сайт на битрикс и вам срочно потребовался лендинг или лонгрид, то Tilda может интегрироваться с ним.
- Подготовка писем для рассылки. В системе можно найти конструктор писем для дальнейшей отправки через различные сервисы.
- Возможность самому создавать блоки.
- Интеграция с различными внешними службами: CRM, платежные системы, формы получения контактов и т.д.
- Создавать промокоды.
- Возможность вести e-commerce.
- Пользовательская страница 404.