Как создать сайт на Tilda

Онлайн-конструктор сайтов Tilda – это не просто сервис для создания красивых страниц из готовых блоков, это серьёзная платформа, которая подойдёт для разных категорий клиентов: от интернет-маркетологов до профессиональных дизайнеров. Здесь можно быстро, а главное, качественно создать сложные и эффективные посадочные страницы, функциональные блоги, небольшие интернет-магазины и другие виды сайтов. Всё ограничивается только вашей фантазией и стоящими целями.

Разработка сервиса велась и ведётся в настоящий момент в России, поэтому проблем с отсутствующими переводами, недостатком обучающих материалов или с обращениями в техподдержку никогда не возникает. Tilda изначально ориентируется на популярные в нашей стране сервисы для создания комплексной инфраструктуры: e-commerce, включая веб-чаты, системы аналитики, CRM, платёжные шлюзы и многое другое, а также сервисы для дизайнеров, email-рассылок, работы команд и т.д.

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

Пошаговая инструкция

Первые шаги пользователя на платформе Tilda, в том числе по созданию собственного сайта, возможны без каких-либо денежных вложений. Стартовый тариф «Free» не ограничен по времени и предоставляется совершенно бесплатно. На нём можно создать один сайт с количеством страниц до 50 шт. Здесь есть ряд других технических ограничений, например, нельзя привязать свой домен, доступны не все блоки контента, интеграции и т.п., но этого точно будет достаточно для тестирования возможностей платформы. Платные тарифы обойдутся уже от 500 до 1250 рублей/месяц (в зависимости от срока оплаты и выбранного тарифного плана, для больших проектов есть специальные предложения).

Ниже подробно рассмотрим, как создать свой первый сайт на Tilda.

1. Регистрация

Если у вас ещё нет аккаунта на платформе, необходимо перейти на страницу его создания - https://tilda.cc/registration/

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

Ничего подтверждать в почте не нужно, но, если вы укажете неправильный email, восстановить доступ уже не получится.

Если аккаунт уже есть, просто авторизуйтесь в сервисе.

2. Добавление нового/первого сайта

В Tilda сайты – это своего рода проекты, внутри которых могут создаваться разноплановые (если это лендинги) или однотипные страницы (для многостраничных сайтов).

У каждого сайта есть внутреннее название, оно не будет отображаться где-либо на страницах или в заголовках. Это имя проекта.

Каждому новому сайту автоматически присваивается сгенерированный домен третьего уровня вида projectНОМЕР.tilda.ws, изменить префикс можно позже в настройках сайта.

В настройках сайта есть также опции для:

  • управления общими шрифтами и цветами,
  • подключения своего домена, форм, систем аналитики, платёжных систем и других сервисов,
  • выбора главной страницы, общего «подвала» и «шапки» (для этих целей создаются специальные страницы), фавиконки, экспорта и т.п.,
  • создания личного кабинета для пользователей сайта.

Отдельные опции доступны только в платных тарифах.

3. Создание страниц

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

Шаблоны разделены на несколько основных категорий: для бизнеса, для интернет торговли, для отдельных событий, блогов, визиток (страницы с контактами), страниц с формами и анкетами.

Деление это условное, так как задача – показать, как устроены типовые страницы. Эти идеи можно будет использовать в своих проектах.

Любую страницу можно отредактировать, копировать/дублировать, просмотреть в отдельном окне или настроить. В настройках можно изменить заголовок, описание, URL-адрес, задать специальные метаданные (например, для отображения в поисковых системах или в ленте Facebook и т.п.), выполнить экспорт, перенести на другой сайт или аккаунт, удалить.

4. Работа с дизайном

Страницы Тильды – это универсальные блоки такого типа как «картинки», «текст», «колонки», на данный момент самых разных их вариаций более 500. Из них, как из кубиков можно создавать необходимый облик страницы. Работа с визуальным редактором предельно простая, особенно удобно для новичков основы – сетка из 12 колонок, в которых блоки можно размещать на всю ширину или по колонкам.

Чтобы работать с блоком и настраивать его под себя, необходимо выделить интересующий это вызовет меню с 3 пунктами:

  • Первый пункт – это такой себе адрес, который помогает сориентироваться и понять, из какой категории взят конкретный блок, его номер. Это удобно, если в дальнейшем потребуется найти аналогичный или похожий в списке.
  • Второй пункт дает возможность настройки цвета фона, кнопок, центрации. Также можно подправить расстояние между элементами, понять размер картинок, переделать блок в зеро, о котором детальнее расскажем дальше. Обратите внимание, объем доступных настроек зависит от типа блока, поэтому в разных вариациях они отличаются. На первых порах, пока только знакомитесь с функционалом, в этом пункте не следует вносить много изменений. Дело в том, что блоки разрабатываются профессионалами, поэтому в них уже оптимально подобрано сочетание шрифтов, типографика, расстояния между строками и прочее. Если все же внесли изменения и они, мягко говоря, не очень нравятся, всегда есть кнопка «отменить».
  • Третий пункт – изменение текстов, надписей на кнопках, заголовков, картинок. Вместо шаблонного вставляйте собственный контент.

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

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

На Тильде можно создавать кнопки, которые также удастся настраивать по своему усмотрению. Выберите блок «Кнопка». Для ее настройки нужно заполнить поле «текст кнопки», то есть указать, как она будет называться, а по сути, какую задачу выполнять. Оптимальным решением будет использовать глагол, побуждающий к действию. Далее настройка того, куда кнопка будет вести в поле «ссылка» прописывайте URL страницы.

Практически в каждом блоке есть текст. Он может размещаться поверх картинки, иметь формат цитаты или отзыва. Есть и чисто текстовые блоки. Любой текст можно редактировать, при этом не нужно заходить в настройки контента. Для изменения кликните на строку текста. Удастся изменить шрифт, размер, начертание. Для изменения внесенных корректировок нужно кликнуть «сохранить и закрыть.

Особенно интересный инструмент в Tilda – это Zero Block. Они – это чистый лист, внутри конструктора. За счет использования такой опции удается создать собственное оформление сайта или существенно, практически до узнаваемого состояния, откорректировать существующие блоки. С Зеро блоками можно:

  • Добавлять на сайт видео, при этом получится редактировать его пропорции и положение на странице.
  • Вставлять HTML-код и настраивать позиционирование таких элементов на каждом экране.
  • Использовать интерактивный инструмент tooltip для добавления всплывающих подсказок. При этом удастся настроить цвет, тень, размер, выбрать или загрузить иконку, загрузить всплывающее изображение.
  • Добавление полей для ввода всплывающей форме обратной связи.
  • Внедрять анимацию при появлении элементов. А именно, работать с прозрачностью, размером, появление сверху, снизу, справа или слева экрана.
  • Пошаговая анимация. Она делает страницу динамичней, интересней.

Zero блоки удобны тем, что удается контролировать каждую деталь нового элемента и сделать его именно таким, как себе представляете. Также они удобны для создания глубины на странице. Удастся накладывать элементы друг на друга и создавать тени. Доступна привязка к краям экрана/сетки. Именно за счет зеро-блоков удается создавать сложную типографику.

Варианты применения Зеро-блока достаточно обширны, с их помощью можно:

  • Создать нестандартную композицию. Это обеспечивает возможность изменить подход к чтению сайта, повести посетителя другим путем.
  • Разработка сложных форм. Например, они буту отличным решением для элементов со сложным краем, при этом компоновка единую композицию не будет проблемой.
  • Работать со слоями. Варианты безграничны: «заезд» одним изображением на другие, текстом на плашки, кнопками на фотографии. Наложение нескольких элементов друг на друга с доступом к их позиционированию по множеству параметров дает возможность достичь очень интересных эффектов.
  • Собирать много элементов вместе. Создание сложных композиций с текста, картинок, линий, плашек, кнопок – это не проблема.
  • Применять ховер – изменение внешнего вида элемента при наведении на него. Этот эффект может быть частью оформления или функциональным элементом статьи, инфографики.
  • Изменить стандартный блок. Особенно это полезно, если необходимых настроек в нем нет.

Кроме того, любой блок можно дублировать, удалить, спрятать (то есть не показывать на странице, но сохранить в редакторе), вырезать, копировать, вставить, выделить. Используя стрелки «вверх» и «вниз», можно менять положение блока.

Потенциально, Тильда – это решение для верстки страниц отменного качества. Они получаются красивыми, информативными, разнообразными. Конечно, будьте готовы к тому, что на все это придется потратить достаточно много времени, даже после того, как научитесь работать со всеми предложенными элементами.

5. Наполнение

После того, как вы сформировали нужные наборы блоков на всех страницах сайта, необходимо их наполнить осмысленным текстом и тематическим медиаконтентом.

Хороший, качественный сайт – это не просто набор красивых элементов, это полезная информация для посетителей.

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

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

Не забывайте указывать свои контактные данные, чтобы клиенты могли с вами связаться.

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

Чтобы сайт не выглядел шаблонно («как у других»), сделайте наброски своего варианта, но не забудьте о наличии ключевых элементов (набор будет зависеть от вида деятельности, типа страницы и других факторов). Вдохновение можно подчерпнуть в примерах тематических работ.

6. Настройка SEO-параметров

Обязательным элементом настройки перед запуском сайта на конструкторе Tilda есть его оптимизация. Представлены достаточно удобные для этого инструменты. В базовом наборе это:

  • добавление названия сайта и формирование сниппета, отображение на вкладке браузера;
  • настройка HTTPS для зашифрованного соединения;
  • подключение Google Search Console и Яндекс.Вебмастер;
  • управление редиректами страниц и перенаправление между www и https;
  • работа с параметрами индексации: запрет или разрешение сбора данных с определенных страниц;
  • включение и отключение nofollow-ссылок;
  • автоматическая генерация robots.txt и sitemap.xml, никаких дополнительных действий совершать в этом плане не нужно;
  • установка основного адреса в мета-файле.

Также необходимо поработать с параметрами отдельных страниц, тут функционал более ограничен, однако базовые элементы все же есть. Так, доступна загрузка заголовка, описания ЧПУ URL, установка изображения для бейджа (они будут отображаться при формировании сниппета). Также удастся проверить отображения ссылок в Facebook и при необходимости провести настройку в ручном режиме.

В конструкторе Тильда предусмотрено автоматическое преобразование загружаемого изображения, оно сжимается в 3-7 раз, при этом практически не теряется качество. Эта технология дает возможность существенно ускорить загрузку, даже если сайт содержит много изображений.

Кроме того доступна генерация бесплатного SSL-сертификата. Присутствует инструмент для проверки страницы и сайта на предмет соответствия SEO-рекомендациям. Удастся обнаружить проблемы в техническом плане.

7. Работа с посетителями/клиентами сайта

Основной инструмент для работы с посетителями сайта в Tilda – это CRM. Первое, что следует учесть – встроенная система работы с заявками уже есть в конструкторе, а также присутствует возможность интеграции сторонней. Функционал встроенной CRM:

  • первичная информация о полях, которые задаете в настройках;
  • детальная информация о покупателе и его заказе;
  • детальная статистика о поведении пользователя: какие страницы посещал, сколько визитов сделал, откуда пришел и другое;
  • добавление заявки вручную – это актуально, если клиент сам позвонил или написал, не заполняя форму, представленную на сайте;
  • во вкладке «контакты», данные о клиентах, которые уже совершили покупку или конверсионные действия. К последним относятся покупка, заявка на обратный звонок, заполнение формы, отправка лид-магнитов.

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

Выводы

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

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

Но, следует понимать, что Tilda – это лишь инструмент для достижения целей. Инструмент может быть простым и понятным в работе, может быть эффективным или функциональным и т.д. Но чтобы он работал, его нужно правильно применять. Создание сайта – это большой комплекс работ, который не ограничивается одним только созданием страниц в конструкторе.

Чтобы сайт работал и выполнял стоящие перед ним задачи, им нужно заниматься – и делать это регулярно и правильно.

2023-03-13 Евгений Куликов Рейтинг: 5.0 959 0
Оставить отзыв
avatar

ЛУЧШИЕ СЕРВИСЫ