Made in tilda что это

Made in tilda что это

Интуитивный конструктор сайтов

Библиотека блоков

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Адаптивность

Редактор собственных блоков

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Фокус на типографике

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Все для лендингов

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

И предприниматели, и крупные компании превращают свои идеи в красивые проекты.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

И предприниматели, и крупные компании превращают свои идеи в красивые проекты.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

И предприниматели, и крупные компании превращают свои идеи в красивые проекты.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

И предприниматели, и крупные компании превращают свои идеи в красивые проекты.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

И предприниматели, и крупные компании превращают свои идеи в красивые проекты.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

И предприниматели, и крупные компании превращают свои идеи в красивые проекты.

Просто создайте свой сайт

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Мы отслеживаем тренды в дизайне

Мы отслеживаем тренды в дизайне, поэтому сайты, созданные на Tilda, выглядят актуально.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Техподдержка не понадобится

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Оптимизация для поисковых систем

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Большой выбор шрифтов

Загружайте собственные файлы шрифтов, используйте шрифты из Google Fonts и Adobe Fonts или выбирайте из списка установленных в Тильде.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Google Analytics и Яндекс.Метрика

Также вы можете подключить Google Analytics и Яндекс. Метрику и знать все о посещаемости вашего сайта.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Высокая скорость загрузки сайтов

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

Чем хорош сайт на Тильде? И почему не надо лезть в дорогостоящие решения

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

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

По факту в более чем 50% случаев от всех задач бизнеса в медиа пространстве, ваш сайт не нуждается в том, чтобы он был разработан кодом. Не обязательно ставить такие условия где необходимо будет привлекать верстальщика или программиста. В таких проектах обычно нуждается средний или крупный бизнес, так как к тому времени у компании сформировалось представление и сложные многоуровневые задачи, которые решаются только таким же сложными решениями.

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

Что чаще всего приходится слышать про Тильду?

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

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

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

Тогда скорее всего вы общаетесь с командой, которая работает только на этой платформе или же с непрофессионалом.

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

Рассмотрим параллельно 2 ситуации, которые могут показаться разными, но по факту объединены одним и тем же.
1. Заказчик не имеет серьезного бюджета, но ему срочно необходим небольшой сайт для мероприятия, которое стартует уже в конце недели.
2. Заказчик имеет серьезный бюджет, но у него отсутствуют амбициозные задачи и в целом планы на будущий сайт. Сроки не превышают 14 дней, но для простоты понимания давайте приведем также к 7 дням.

Задача

По факту перед нами стоит задача, как сделать симпатичный MVP-проект, в срок не превышающий 7 дней.

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

День 1. Подбор референсов и обсуждение проекта

Для экономии времени и ресурсов приступаем к аналитике, но акцентируем внимание только на самых важных моментах, а именно:

какова будет общая концепция продукта;

какие есть конкуренты и что они из себя представляют;

Что нравится целевой аудитории;

что из референсов может лучше всего подойти.

Конец дня ознаменовывается обсуждением выбранных решений с заказчиками. На каждый из этапов тратим примерно по 2 часа.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

День 2. Прототипирование

День 3-4. Дизайн

На данном этапе делаем акцент, выделяя под него 2 суток. Так как он является самым основным в рамках работы на Тильде. Определяемся с 3 наиболее интересными и продуманными работами в данной нише, предварительно все это согласовав с заказчиками. Первый день занимает подбор и поиск будущих элементов сайта, а именно:

иные визуальные элементы, которые нельзя отнести к чему-то конкретному, но от этого они не становятся менее важными

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

День 5. Верстка

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

День 6. Подключение домена

День 7. Видео инструкции и обучение заказчика

Для этого записываем видеоинструкции:

как добавлять контент;

Как редактировать текст и менять изображения;

Как пользоваться панелью администратора

Где они уже самостоятельно сможет все настроить, повторяя шаги из видео.

Вывод

самозанятые или у вас небольшой стартап, когда нет уверенности в бизнес-модели;

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

Как бесплатно создать сайт на Tilda – пошаговый гайд

Для этого не нужны специальные знания.

Обновили в 2022 году.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Этот сайт целиком построен на Tilda

Почему стоит выбрать Tilda

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

Tilda выделяется на фоне других конструкторов ориентацией на визуальную привлекательность и легкость восприятия контента.

Пользователям Tilda доступны модули и шаблоны, с помощью которых можно быстро создавать конверсионные лендинги и даже интернет-магазины. На «Тильде» можно сделать корпоративный сайт, виртуальную визитку с портфолио, контент-проект.

Примеры созданных с помощью конструктора ресурсов можно найти в разделе MadeOnTilda на официальном сайте проекта. Обратите внимание на пример интеграции «Тильды» и WordPress. «Лайфхакер» использует конструктор для создания лонгридов, а основной сайт проекта работает на WP.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Пример интеграции одного движка в Tilida

У Tilda есть недостатки, которые будут рассмотрены ниже. Но главный из них нужно обсудить сразу.

Стоимость

Пользователям доступны три тарифных плана: Free, Personal и Business.

Возможностей бесплатного тарифа хватит для создания сайта-визитки. Пользователь получает 50 Мб дискового пространства и один сайт до 50 страниц. Функциональность сайтов на бесплатном тарифе ограничена.

Важный момент: пользователи бесплатного тарифа могут зарегистрировать сайт только на поддомене. URL выглядит так: vash-site.tilda.ws. Это не влияет ни на пользовательский опыт, ни даже на доверие к сайту со стороны поисковых систем.

Доступ к конструктору стоит 6 000 рублей в год. Это неоправданно дорого. Полноценный сайт на любой CMS, например, WordPress, Joomla!, Drupal, OpenCart, обойдется гораздо дешевле.

Тариф Business включает все возможности Personal. Дополнительно пользователь может создавать до пяти сайтов. Главное отличие – возможность экспортировать код и установить Tilda на свой сервер.

За подключение по тарифу Business нужно платить 1 000 рублей в месяц. Обратите внимание, услуги хостинг-провайдера нужно оплачивать отдельно.

Выбор тарифа зависит от формата сайта и потребностей владельца.

Тариф & ХарактеристикиЦена в годВозможностиКому подходит
FreeБесплатноСайт на поддомене, до 50 страниц, до 50 Мб на дискеФрилансерам, которым нужен небольшой сайт-визитка
Personal6000 рублейСайт на платном домене, до 500 страниц, 1 Гб на диске, полный доступ к библиотеке модулейБлогерам, издателям, компаниям, E-коммерсантам
Business12 000 рублейВозможности тарифа Personal, опция экспорта кода, до 5 сайтов на одном аккаунтеНикому. На сервер лучше установить CMS с открытым кодом. Даже некоторые коммерческие CMS обойдутся дешевле

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

В Google и «Яндексе», соцсетях, рассылках, на видеоплатформах, у блогеров

Начните с планирования

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

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

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

Полезная информация есть в наших гайдах и статьях:

Если вы решили делать страницы с нуля с помощью библиотеки блоков, начните с создания прототипов. Используйте Axure RP или другие инструменты прототипирования. Эскизы страниц можно нарисовать и на бумаге. А в крайнем случае просто перечислите блоки, которые должны быть на каждой странице. Второй способ подойдет тем, кто не доверяет собственному вкусу и не имеет ни малейшего представления о дизайне, функциональности и юзабилити сайтов.

Воспользуйтесь готовыми шаблонами страниц из библиотеки. В каталоге они объединяются по тематическим категориям: «Бизнес», «Магазин», «Событие», «Блог», «Контакты» и «Анкета».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Окно создания новой страницы

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

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

Результатом планирования должно стать четкое представление о будущем сайте. Запишите как минимум следующую информацию:

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

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

Что такое семантическое ядро и как его составлять

Как настроить сайт на Tilda: базовые опции

После регистрации на платформе перейдите в раздел тарифы и подключите тариф Personal. Новым пользователям доступен бесплатный тестовый период.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Нажмите кнопку «Активировать»

Перейдите в раздел «Мои сайты», создайте новый ресурс и укажите его название.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Нажмите кнопку «Создать новый сайт»

В разделе «Настройки сайта» укажите описание и выберите субдомен.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Заполняем название, описание и выбираем домен

Перейдите в разделы «Аналитика» и «SEO» и подключите сайт к системам «Яндекс.Метрика» и Google Analytics. В этом же разделе можно добавить на сайт контейнер Google Tag Manager. Если вы впервые делаете сайт, подключайте «Метрику» и Analytics напрямую.

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Нам нужен номер счетчика

Вставьте номер в поле «Яндекс.Метрика» в разделе настроек сайта «Аналитика и SEO» в панели «Тильды».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Подключаем счетчик «Яндекс.Метрики»

Аналогичным образом подключите счетчик Google Analytics. Для этого нажмите кнопку «Подключить» в строке Google Analytics. Примите запрос от приложения tilde.cc на доступ к аккаунту Google Analytics. Выберите счетчик и сохраните изменения. Если на сайте уже есть страницы, опубликуйте их повторно.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Подключаем счетчик GA к Tilda

Перейдите в раздел «SEO», чтобы подключить сайт к службам Search Console и «Яндекс.Вебмастер».

Нажмите кнопку «Подключить» рядом с названием соответствующего сервиса, примите запрос от приложения tilda.cc на доступ к аккаунту. Нажмите кнопку «Зарегистрировать сайт».

После автоматической регистрации на панели появится статус «Домен подтвержден». Система предложит добавить в Search Console карту сайта. Воспользуйтесь этой возможностью.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Подключаем сайт к веб-аналитике Google

Таким же способом зарегистрируйте ресурс в «Яндекс.Вебмастер».

Указанных базовых настроек достаточно, чтобы приступить к созданию страниц. К дополнительным настройкам сайта вернетесь, когда будут готовы основные разделы.

Как подключить платный домен к сайту на Tilda

После регистрации домена в личном кабинете на сайте регистратора войдите в панель управления услугами. В DNS-записи укажите IP сервера Tilda 178.248.234.146.

Если вы зарегистрировали домен в Reg.ru, в личном кабинете перейдите в раздел «Управление доменом – DNS-серверы». А вот так можно отредактировать DNS у регистратора / хостинга Beget:

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Нажмите кнопку «Редактировать DNS»

Укажите DNS-серверы ns1.reg.ru и ns2.reg.ru. Это нужно, чтобы использовать зарегистрированный в Reg.ru домен на стороннем хостинге.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Вернитесь в раздел «Управление доменом» и выберите подраздел «Управление зоной».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Нам нужен раздел «Управление доменами»

Удалите существующие записи класса A и добавьте вместо них новую запись.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Редактируем ресурсные записи домена

Добавьте IP сервера «Тильды» и сохраните изменения.

В разделе «Добавить запись CNAME» укажите поддомен www. Это нужно, чтобы сайт был доступен по адресам вида vashsite.ru и www.vashsite.ru.

В поле Canonical name добавьте значение «tilda.ws.», а в поле Subdomain – значение «www».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Редактируем CNAME домена/p>

В панели управления Tilda укажите домен в соответствующем разделе настроек сайта. Сохраните изменения.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Добавляем настроенный домен

Изменения вступают в силу в течение нескольких часов. После настройки домена приступайте к созданию страниц сайта.

Как создавать страницы сайта на Tilda

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Нажмите кнопку «Создать новую страницу»

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

Шаблонные страницы Tilda состоят из модулей, которые можно настраивать, менять местами, удалять и добавлять.

Чтобы вызвать меню редактирования, достаточно навести курсор на модуль.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Обратите внимание на кнопки вверху рабочего пространства

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Выбираем вариант обложки

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

Обратите внимание на возможность выбора тега для заголовков блоков, которые расположены на странице первыми. Для основного заголовка важно указать тег H1. Для заголовков второго и третьего порядка доступны теги H2 и H3.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Настраиваем внешнее представление страницы

В меню «Контент» добавьте информацию, которую планируете опубликовать в модуле. Возможности редактирования зависят от типа блока, с которым вы работаете. Например, в модуле обложки страницы можно выбрать фоновое изображение и логотип, изменить заголовок и описание.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Указываем подзаголовок, заголовок и описание

Информацию в блоках можно редактировать, не открывая меню «Контент». Чтобы изменить данные, установите курсор на нужной строчке и добавьте запись. При необходимости воспользуйтесь визуальным редактором. Меню появляется в верхней части экрана.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Редактируем текст прямо в окне предпросмотра

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Дублируйте, удаляйте, прячьте любые элементы

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Работать с модулями очень удобно

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Открываем карту блоков

После редактирования модулей и контента уделите внимание настройкам страницы. Соответствующий раздел доступен в вертикальном меню в верхней части экрана или в выпадающем меню «Еще».

В основных настройках укажите заголовок и описание. При необходимости измените URL страницы. Это актуально для внутренних разделов сайта.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Заполняем все обязательные поля

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

В разделе Facebook и SEO отредактируйте сниппет страницы в социальных сетях и поисковой выдаче. По умолчанию данные для сниппета подтягиваются из заголовка и описания страницы.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Первая картинка (по умолчанию) и есть бейдж

В настройках Facebook и SEO есть дополнительные возможности. В разделе «Отображение в поисковой выдаче» нажмите кнопку «Задать специальные meta-данные». Здесь можно при необходимости изменить title и description. Не тратьте время на указание ключевых слов, так как поисковые системы не учитывают метатег keywords.

Отредактируйте каноническую ссылку на страницу: сделайте URL удобным для пользователей. Например, вместо автоматически сгенерированной ссылки на страницы контактов или портфолио vashsite.tilda.ws / page1554510.html укажите ЧПУ vashsite.tilda.ws / contact или trubnikoff.tilda.ws / portfolio соответственно.

При необходимости запретите поисковым системам индексировать страницу или предложите поисковикам не переходить по ссылкам на странице.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Настраиваем как будет выглядеть сниппет

В настройках отображения в «Фейсбуке» можно указать ID приложения и аккаунт в Twitter.

Вкладка «Экспорт» настроек страницы доступна только владельцам бизнес-аккаунтов. На вкладке «Действия» можно перенести, удалить или дублировать страницу.

Обратите внимание на вкладку «Дополнительно» в меню настроек страницы. Здесь пользователям доступна очень важная функция: вставка произвольного HTML-кода в хедер страницы. Ее можно использовать, чтобы добавить в конкретный раздел сайта коды отслеживания или микроразметки Schema.org.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Благодаря добавлению своего кода, вы сможете кастомизировать страницу

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Размечаем элементы страницы семантическими тегами

После публикации страницы проверьте корректность микроразметки с помощью инструмента Google.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Валидация пройдена успешно

Подробнее о внедрении структурированных данных через JSON-LD читайте в нашей статье о новой реальности в поиске.

После редактирования сайта и выбора настроек опубликуйте страницу. Для этого нажмите кнопку «Опубликовать» в верхней части экрана справа.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

После публикации страница станет доступна всем пользователям. Теперь создайте остальные страницы: «Услуги», «Портфолио», «О нас», «Контакты», «Блог».

Как работать с внутренними страницами сайта

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

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

Создайте страницу «Портфолио». Для поддержания единообразия сохраните обложку страницы. Добавьте в модуль нужную информацию.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Пример обложки для страницы с портфолио

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

В нашем случае мы решили отредактировать вводный текстовый блок и добавить в него презентационное видео

После вводного блока добавьте на страницу модуль портфолио. Подходящий инструмент ищите в разделе библиотеки «Список страниц».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Нас интересуют настройки списка страниц

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

После блока портфолио добавьте на страницу конверсионный модуль. Подходящий вариант найдется в разделе библиотеки «Форма и кнопка».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Выбираем подходящий формат виджета

Отредактируйте контент и укажите ссылку для кнопки. Это может быть страница с контактной информацией или подходящий блок с существующих страниц.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Редактируем параметры блока

Вы сделали страницу портфолио со ссылками на реализованные проекты и конверсионной кнопкой.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Пример созданной страницы

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

Как сделать страницу на Tilda с чистого листа

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Нажмите кнопку выбрать «Выбрать»

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Настраиваем вид страницы

После заголовка добавьте подходящий блок из раздела каталога «Список страниц». Внизу достаточно добавить еще один блок с контактными данными. Укажите общие настройки и опубликуйте страницу.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Созданная с чистого листа страница блога

Вы создали основные страницы сайта. Уделите внимание навигационному меню.

Как сделать меню сайта на «Тильде»

Чтобы сделать меню, создайте новую страницу сайта. Используйте чистый лист, а не шаблон. В библиотеке блоков выберите раздел меню. Здесь найдите подходящий модуль.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Настраиваем новое меню

Добавьте пункты меню и ссылки на страницы в настройках контента блока. Название пункта меню укажите в поле слева. С помощью кнопки «Выбрать страницу» добавьте ссылку на нужный раздел сайта.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Кастомизируем внешний вид меню

В разделе настроек контента «Логотип» добавьте название сайта. Если у вас есть логотип, загрузите его.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Этот шаг необязательный

Добавьте ссылки на профили в соцсетях, отредактируйте кнопку Contacts. Укажите настройки страницы и опубликуйте ее.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Так выглядит модуль на готовой странице

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Нажмите кнопку «Настройки сайта»

Выберите раздел «Шапка и подвал» и с помощью выпадающего меню укажите нужную страницу.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Назначаем меню в подвал

Сохраните изменения и опубликуйте все страницы. Проверьте, как отображается меню.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Обратите внимание на верхнее меню

Сайт-визитка специалиста с базовыми функциями готов. При необходимости воспользуйтесь дополнительными возможностями «Тильды».

Что еще может Tilda

С помощью дополнительных возможностей конструктора Tilda можно решать специальные задачи. Некоторые из них перечислены ниже.

Интеграция с WordPress

Реализацию идеи можно оценить на примере «Лайфхакера». Сайт проекта работает на WordPress, а с помощью «Тильды» редакция сделала серию лонгридов.

Чтобы интегрировать Tilda с WordPress, необходимо оплатить бизнес-тариф и установить любой подходящий плагин.

CMS WordPress имеет достаточно платных и бесплатных инструментов для создания лендингов и оформления лонгридов. Учитывайте это при оценке целесообразности оплаты бизнес-тарифа.

Подготовка писем для рассылки

Конструктор писем можно найти в панели управления Tilda. Инструмент позволяет делать письма из готовых шаблонов и отправлять их подписчикам через сервисы SendGrid или MailChimp. Также можно экспортировать код на другие платформы email-маркетинга.

Созданные письма можно хранить на субдомене вида nashi-pisma.tilda.ws. Шаблоны писем редактируются и настраиваются, как страницы сайтов на Tilda.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Этот шаблон можно кастомизировать

Создание пользовательских блоков

Эта функция подойдет специалистам, которые имеют как минимум базовые представления о веб-дизайне. С помощью редактора Zero Block они могут создавать модули страниц самостоятельно.

Чтобы открыть редактор блоков, в режиме редактирования нажмите кнопку Zero в списке модулей в нижней части страницы или выберите «Нулевой блок» в библиотеке модулей.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Кнопка доступна с любой страницы

Интеграция с внешними сервисами

Сайт на «Тильде» можно интегрировать с внешними службами:

Для интеграции в настройках сайта выберите меню «Формы» и «Платежные системы».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

У Tilda широкие возможности для интеграций со сторонними сервисами

Создание промокодов

Чтобы создать и опубликовать промокод, откройте соответствующее меню в разделе «Платежные системы» в настройках сайта. Укажите подходящие параметры и опубликуйте промокод.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Подраздел «Промокоды» находится в разделе «Платежные системы»

Электронная торговля

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

В разделе «Бизнес» есть адаптированные для электронной торговли шаблоны страниц.

В меню блоков «Магазин» есть модули, с помощью которых страницы магазина можно сделать самостоятельно.

В разделе «Другое» есть модули для интеграции сайта на «Тильде» с платформой для создания ecommerce-сайтов «Эквид».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

В два клика мы можем сделать полноценный интернет-магазин на Tilda

Пользовательская страница 404

Пользователи «Тильды» могут самостоятельно назначить и отредактировать страницу 404. Для этого создайте и опубликуйте страницу. В настройках сайта в разделе «Еще» с помощью выпадающего меню выберите нужный вариант.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Сперва 404-я создается, затем назначается в этом разделе («Еще», «Страница: 404 Ошибка»)

Tilda CRM

Осенью 2018 года Tilda предложила пользователям полезный инструмент – бесплатную CRM. Чтобы работать с системой, выберите соответствующий раздел в вертикальном меню и нажмите кнопку «Создать новый лист».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Откройте раздел CRM

В настройках в разделе «Сайт» подключите к CRM сайт.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Будем настраивать подключение CRM-системы к сайту

В настройках сайта подтвердите подключение CRM. Для этого можно выбрать настройки блока страницы и перейти в раздел «Формы».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

После подключения все заявки с сайта будут приходить в CRM. Если заявка получена по телефону, ее можно добавить в систему вручную с помощью кнопки «Добавить заявку».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Есть одна заявка

В заявке оператору доступны контактные данные клиента. Здесь можно создавать примечания и отвечать на заявки. Чтобы ответить клиенту по электронной почте, нужно перейти по ссылке «Открыть карточку» и перейти на вкладку «Письмо».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Изучаем поступившие заявки

Tilda или сайт на движке?

Tilda – удобный и функциональный инструмент. давайте сравним его с WordPress, самым популярным движком.

Что вы потеряете, если выберете Tilda вместо WordPress

Деньги

За доступ к полной функциональности Tilda придется платить как минимум 6 000 рублей в год. Есть тариф Free, с которым можно создать на сайте до 50 страниц. Пользователи плана Free могут добавлять на страницы только базовые модули.

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

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

Безопасное соединение

По умолчанию сайты на поддомене «Тильды» доступны по https. После оплаты тарифа Personal или Business можно купить SSL-сертификат и настроить доступ к сайту по безопасному протоколу через сервис CloudFlare.

У российских пользователей могут быть проблемы с доступом к ресурсам, так как некоторые провайдеры блокируют IP CloudFlare, а контролирующие органы не рекомендуют владельцам сайтов пользоваться этим сервисом.

Удобство внедрения микроразметки

На страницы сайтов на Tilda можно добавлять структурированные данные. Делать это придется вручную: создавать разметку и публиковать ее на каждой странице отдельно.

На страницах сайта на WordPress можно задать базовые типы разметки, например, Article или BlogPosting, для всех страниц публикаций. Это можно делать с помощью SEO-комбайнов, например, All in One SEO Pack. Также есть отдельные плагины, например, WPSSO Schema JSON-LD MarkUp.

Оптимизация скорости загрузки страниц

Пользователи Tilda практически не могут влиять на скорость загрузки страниц. Можно только удалять со страниц отдельные модули и сжимать изображения. В остальном придется довериться разработчикам «Тильды».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Приемлемо, но лучше улучшить

Пользователи WordPress могут самостоятельно оптимизировать скорость загрузки страниц.

Ускоренные мобильные страницы

Пользователи Tilda пока не могут внедрять AMP. У пользователей WordPress такая возможность есть. Google охотно направляет пользователей на ускоренные страницы.

Доступ к файлам сайта

У владельцев сайтов на «Тильде» такой возможности нет, а у «Вордпресса» есть. Впрочем, доступ к файловой системе обычно нужен продвинутым пользователям движка.

Редактирование карты сайта и файла robots.txt

Tilda создает sitemap.xml и robots.txt автоматически, и пользователи не могут их редактировать. На WordPress карту сайта и файл robots.txt можно создать самостоятельно с помощью плагинов, например, All in One SEO Pack. Пользователь может редактировать карту и директивы для поисковых роботов.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Что вы приобретете, если выберете Tilda вместо WordPress

Деньги

Если вам нужен одностраничный сайт или онлайн-визитка с портфолио и контактными данными, дешевле работать с «Тильдой». Сайт-портфолио на Tilda можно сделать бесплатно, но он будет доступен на поддомене.

Простота редактирования шаблона

С «Тильдой» любой пользователь без специальных знаний может почувствовать себя дизайнером. Для изменения шаблонов на WordPress нужны специальные знания.

Визуальная привлекательность страниц

Этот пункт – продолжение предыдущего. С помощью «Тильды» можно красиво оформить страницу сайта. Это не требует специальных знаний и много времени.

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

Простота

На Tilda проще создать сайт и управлять им. За простоту придется расплачиваться деньгами и ограничениями в функциональности ресурса.

Что в итоге

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

Осваиваем конструктор Tilda: делаем сайт-визитку с нуля

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

«Тильда» — это онлайн-конструктор сайтов. С его помощью можно быстро и просто создать свой сайт-визитку, протестировать и опубликовать в интернете. Чтобы сделать сайт на «Тильде», не нужно покупать доменное имя или учиться программировать — достаточно расставить по местам готовые блоки.

Почему именно «Тильда»:

Что будет в этом уроке

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Что такое сайт-визитка

Сайт-визитка рассказывает о вас: кто вы, что умеете, чем можете быть полезны и как с вами связаться. Чтобы создать такой сайт и опубликовать его в интернете, не нужно быть программистом или дизайнером — если работали в MS Word или Google Docs и у вас есть вкус, то всё получится.

Регистрируемся в «Тильде»

Здесь всё просто: заходим на сайт tilda.cc, нажимаем справа вверху кнопку «Регистрация», вводим имя и email, придумываем пароль, переходим в сервис.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Создаём проект

После регистрации платформа сразу же предлагает создать свой первый сайт. Вводим название сайта — например, My site — и жмём «Создать».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

«Тильда» автоматически создаёт ссылку, по которой сайт будет доступен в интернете.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

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

Создаём первую страницу

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

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

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Рабочее пространство пустого шаблона

Скриншот: Skillbox Media

Что надо подготовить до создания сайта

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

Составим список блоков, которые нам понадобятся. Например:

Теперь по этим блокам надо подготовить всю информацию: текст, изображения, примерные цвета сайта. Всё остальное сделаем уже в «Тильде».

Рекомендую подумать 5−10 минут, набросать схему своего первого сайта, найти материалы и только после этого двигаться дальше.

Знакомимся с шаблонами блоков

Обычно самый первый (верхний) блок сайта — это меню. Нажимаем на кнопку «Все блоки» и слева выбираем пункт «Меню».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

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

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Если вы не можете сразу найти нужный вам блок, используйте поиск по библиотеке блоков — его иконка вверху.

Подключаем весь функционал «Тильды»

Чтобы оценить всю мощь «Тильды» и попробовать все функции и блоки, необходимо использовать платный тариф — после регистрации он даётся бесплатно на 14 дней. Чтобы подключить, переходим на главную страницу проекта.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

А теперь в нижней части страницы нажимаем кнопку «Тарифы и оплата».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Подтверждаем активацию тарифа и читаем описание.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Если вы всё сделали правильно, появится такое окно.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Поздравляю! Теперь вы две недели можете тестировать все функции «Тильды».

Меняем заголовок страницы сайта

По умолчанию название страницы из пустого шаблона — Blank page. Давайте поменяем его на Main page, то есть «Главная страница». Снова в верхнем левом углу выбираем пункт меню «Мои сайты» и переходим на страницу проекта. Нам понадобится раздел «Редактировать сайт».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

На открывшейся странице выбираем созданный нами шаблон Blank page, переходим в пункт «Настройки». Вместо заголовка Blank page вписываем Main page и сохраняем изменения.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Добавляем и редактируем блоки

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

Добавляем блок «Меню»

Нажимаем на Main page и возвращаемся к редактированию шаблона. В пункте «Меню» выбираем шаблон «Фиксированное меню», обозначенный как ME204 (в сером овале в левом нижнем углу). Раньше он был недоступен — ведь мы пользовались бесплатным тарифом.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Нажимаем и смотрим, что получилось.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Мы добавили на страницу блок с меню, теперь нужно поменять его пункты и вписать своё название вместо CompanyName. Для этого наводим курсор мыши на блок и нажимаем появившуюся кнопку «Контент».

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Добавляем нужные пункты меню, а рядом проставляем внутренние (якорные) ссылки через знак # — это нужно для удобного перехода между блоками главной страницы сайта. У нас на странице пока ещё ничего нет. Но мы заранее подготовили список блоков — вот из них и сделаем якорные ссылки. Портфолио станет #portfolio, услуги — #services, и далее по такому же принципу.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Ниже в поле «Заголовок» вводим название сайта. Оно будет отображаться в левой стороне нашего шаблона меню.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Здесь же (в самом низу) надо удалить языковые версии Ru и En — они не понадобятся.

Made in tilda что это. Смотреть фото Made in tilda что это. Смотреть картинку Made in tilda что это. Картинка про Made in tilda что это. Фото Made in tilda что это

Мы настроили первый блок — «Меню». Теперь добавим следующий блок «Обо мне».

Добавляем блок «Обо мне»

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

Чем хорош сайт на Тильде? И почему не надо лезть в дорогостоящие решения

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

Публикация составлена совместно с командой Годунова.

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

По факту в более чем 50% случаев от всех задач бизнеса в медиа пространстве, ваш сайт не нуждается в том, чтобы он был разработан кодом. Не обязательно ставить такие условия где необходимо будет привлекать верстальщика или программиста. В таких проектах обычно нуждается средний или крупный бизнес, так как к тому времени у компании сформировалось представление и сложные многоуровневые задачи, которые решаются только таким же сложными решениями.

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

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

2. «Не, Тильда не подойдет, у нее слишком урезанный функционал. »

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

Тогда скорее всего вы общаетесь с командой, которая работает только на этой платформе или же с непрофессионалом.

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

Рассмотрим параллельно 2 ситуации, которые могут показаться разными, но по факту объединены одним и тем же.
1. Заказчик не имеет серьезного бюджет, но ему срочно необходим небольшой сайт для мероприятия, которое стартует уже в конце недели.
2. Заказчик имеет серьезный бюджет, но у него отсутствуют амбициозные задачи и в целом планы на будущий сайт. Сроки не превышают 14 дней, но для простоты понимания давайте приведем также к 7 дням.

Задача
По факту перед нами стоит задача, как сделать симпатичный MVP-проект, в срок не превышающий 7 дней.

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

День 1. Подбор референсов и обсуждение проекта
Для экономии времени и ресурсов приступаем к аналитике, но акцентируем внимание только на самых важных моментах, а именно:

Конец дня ознаменовывается обсуждением выбранных решений с заказчиками. На каждый из этапом тратим примерно по 2 часа.

День 3-4. Дизайн
На данном этапе делаем акцент, выделяя под него 2 суток. Так как он является самым основным в рамках работы на Тильде. Определяемся с 3 наиболее интересными и продуманными работами в данной нише, предварительно все это согласовав с заказчиками. Первый день занимает подбор и поиск будущих элементов сайта, а именно:

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

Источники информации:

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *