Как сделать свой сайт за 10 минут без программирования

Другие вопросы

• Можно ли давать отдельный доступ пользователям к проектам?
• Наблюдаются ли у вашего сервисы проблемы из-за блокировок Роскомнадзором?
• Как сделать бэкап проекта на Тильде?
• Выписался счёт для тарифа Бизнес на 15000 рублей без скидки. Почему?
• Где находится Ваш ЦОД?
• Яндекс.Вебмастер сообщил, что мой домен «Малополезный контент, спам, избыток рекламы» или «дорвей». Что делать?
• Как включить капчу?
• Для подтверждения нужно загрузить в корень сайта файл. Как это сделать?
• Что делать, если сайт не работает (не открывается)?
• Как сделать слайдер?
• Как добавить карту Google или Yandex на сайт?
• Где ввести промокод?
• Есть ли возможность отредактировать файл robots.txt?
• Я могу зайти на сайт по FTP?
• Могу ли я импортировать сайт в Тильду?
• Как добавить линию подчёркивания ссылки?
• Можно ли подключить Тильду к WordPress?
• Можно ли подключить Тильду к Битрикс?
• Есть ли у Тильды API?
• Как добавить Whatsapp или Viber?
• Почему не работают карты от Google?
• Как отключить Jivosite на мобильных устройствах?
• Что делать, если забыл почту (логин, аккаунт) для входа?
• Как загрузить MP4 или WEBM видео?
• Как сделать GIF из видео?
• У меня уже есть сайт в другом конструкторе. Как перенести сайт в Тильду из другой платформы или другого конструктора?
• В мобильном браузере показывает сообщение «Этот сайт заблокирован от автоматического запуска вызова». Почему?
• Почему я вижу на своём сайте рекламу? Откуда реклама на сайте?
• Как убрать капчу?
• У меня на сайте маленькая конверсия, помогите с маркетингом?
• Есть ли сервис для создания UTM меток?
• Где почитать новости про обновления Тильды?
• Как мне найти исполнителя для создания или доработки сайта?
• Вы занимаетесь разработкой сайтов на заказ?
• Я сделал сайт, как мне попасть в рубрику Madeontilda?
• Как подключить Почтовый Офис от Яндекса?
• Не могу войти в аккаунт, выдается сообщение, что пользователь с таким Email не найден.
• Где посмотреть статистику по utm меткам?
• Где найти публичную ссылку на блок?
• Что такое Tooltip (тултип) в Zero блоке?
• Есть ли сервис для создания «Соглашения об обработке персональных данных»?
• Есть ли возможность отредактировать файл .htaccess?
• Скачал файл заявок в формате CSV. Не могу открыть в Excel, почему?
• Как настроить calltracking?
• Как подключить бота в группу Телеграм?
• Возможно ли в Тильде сделать горизонтальную прокрутку?

Tilda — сервис для создания сайтов

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

Я полностью с ними солидарен.

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

Когда я начинал создавать там первые лендинги, было всего 2 категории шаблонов: “Бизнес” и “Контент”. Со временем сервис серьезно расширил палитру. Кроме того, для всех готовых шаблонов существуют адаптивные версии, рассчитанные на смартфоны и планшеты.

Тильда позволяет использовать 6 групп шаблонов “Бизнес”, “Магазин”, “Событие”, “Блог”, “Контакты”, “Анкета”. Для меня наиболее востребованными были макеты лендингов для бизнеса. Знакомые хвалили “Блог” и “События”.

Интерфейс, в котором нет ничего лишнего — сильная сторона Tilda

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

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

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

Пользователи также хвалят возможности для интеграции HTML, JS, CSS и сравнительно небольшие тарифы.

Как создать лендинг на Тильда?

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

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

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

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

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

Можно условно разделить создание ресурса на Тильда на 4 основных этапа:

1. Первый — это формирование UX-дизайна и набросков текста — т.е. базовая смысловая структура;

UX удобно созвать вместе с текстом — это можно делать сразу в текстовом редакторе

1. Второй — выбор подходящего шаблона, определение структуры сайта, места расположения основных элементов, определение стилеобразующих элементов (шрифтов, цветов, бэкграунда и пр.);

Особенно важно учитывать стартовый экран

1. Третий — наполнение контентом (текстами, фотографиями, видео, ссылками);

Возможности конструктора позволяют оперативно менять контент при необходимости

1. Четвертый — оптимизация — прописывание ключевых слов и фраз, title, description, названий изображений, заполнение справочной информации для поисковых роботов;

Даже заполнение немногочисленных полей инструментов SEO требует базовых знаний о требованиях поисковиков, которые можно изучить, пользуясь справочной информацией таких систем как Yandex и Google

1. Пятый — публикация. Этап включает либо выбор доменного имени с доменом второго уровня (по образцу ####.Tilda.cc), либо привязку собственного полноценного домена.

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

Такое структурирование работы упростит вам задачу и сохранит время при создании LP

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

SEO

• Поисковики не видят мой сайт, что делать?
• Как добавить robots.txt и sitemap.xml
• Как сделать страницу ошибки 404?
• Как добавить (назначить) тег H1?
• Как запретить индексировать страницу поисковикам?
• Почему Яндекс показывает неправильный фавикон (favicon), не отображает нужный?
• Как улучшить SEO?
• Как убрать disallow в robots.txt?
• Нужно ли назначать H1 в блоке, который виден только на мобильных?
• Как запретить индексировать сайт поисковым системам?
• Как добавить ключевые слова для сайта?
• Почему сайт не индексируется в поисковых системах?
• Как сделать переадресацию с кодом 301 со старых ссылок на новые?
• Как исключить неправильную ссылку в поисковой системе?

Перед публикацией

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

Назва­ние стра­ни­цы меня­ет­ся по кноп­ке «Настрой­ки» в верх­нем меню. Пишем там то же самое, что и про­шлый раз:

Там же мож­но перей­ти к настрой­кам все­го сай­та — это нам пона­до­бит­ся для настрой­ки цве­тов и общих пара­мет­ров. В пер­вом раз­де­ле сра­зу про­пи­шем общее назва­ние сай­та и его опи­са­ние, а так­же при­ду­ма­ем имя для суб­до­ме­на:

Домен — тот же сайт в интер­не­те с отдель­ным име­нем. Yandex.ru, tilda.ws, thecode.media — это всё при­ме­ры доме­нов. А если у сай­та есть под­раз­дел со сво­им отдель­ным име­нем в интер­не­те, это уже суб­до­мен: rabota.yandex.ru, docs.google.com, mihailmaximov.tilda.ws. Суб­до­ме­ны обыч­но нуж­ны, что­бы офор­мить раз­де­лы на раз­ные темы в рам­ках одно­го сай­та. Наш суб­до­мен mihailmaximov озна­ча­ет, что внут­ри боль­шо­го сай­та tilda.ws будет раз­дел про Миха­и­ла Мак­си­мо­ва — и толь­ко про него.

Цве­та, шриф­ты, ана­ли­ти­ка и про­чие гло­баль­ные вещи настра­и­ва­ют­ся через то же меню сле­ва:

Настраиваем заголовок

В Тиль­де есть два пути — выбрать уже гото­вый шаб­лон или создать стра­ни­цу с нуля. Шаб­лон под­хо­дит в тех слу­ча­ях, когда надо быст­ро сде­лать типо­вой сайт и не хочет­ся думать над дизай­ном. Это не наш слу­чай, пото­му что у нас дизайн уже есть — мы повто­ря­ем то, что сде­ла­ли в про­шлой ста­тье, поэто­му выби­ра­ем вари­ант «Пустая стра­ни­ца»:

Что­бы уви­деть все эле­мен­ты, из кото­рых мож­но соби­рать стра­ни­цу, нажи­ма­ем на «Все бло­ки»:

У нашей стра­ни­цы нет облож­ки, она сра­зу начи­на­ет­ся с заго­лов­ка. Откры­ва­ем раз­дел «Заго­ло­вок» и выби­ра­ем тот, кото­рый под­хо­дит боль­ше все­го. Неваж­но, что там напи­са­но боль­ше, чем нам нуж­но — лиш­нее мы уда­лим или скро­ем. Допу­стим, мы реши­ли, что самый пер­вый заго­ло­вок (TL01) нам под­хо­дит, поэто­му нажи­ма­ем на него, и он сра­зу попа­да­ет на стра­ни­цу:

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

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

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

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

Формы приема данных

• Как отправлять заявки себе на почту?
• Как отправлять заявки себе в Telegram?
• Заявки из форм не приходят
• Как отправлять заявки в SMS?
• Как поменять цвет текста или фона в сообщении об успешной отправке формы?
• Как изменить текст ошибок форм?
• Как отправлять заявки из формы в Google Таблицы?
• Как добавлять контакты из форм в MailChimp?
• Как добавлять контакты из форм в GetResponse?
• Как добавлять контакты из форм в UniSender?
• Как добавлять контакты (лиды) из форм в AmoCRM?
• Как назначить разные воронки и разных ответственных для AmoCRM?
• Как получить данные из форм на свой скрипт через webhook?
• Как подключить к форме свой скрипт?
• Как добавлять контакты (лиды) из форм в Мегаплан?
• Не работает ST105
• Как добавлять контакты из форм в SendPulse?
• Как добавлять контакты из форм в Трелло?
• Как изменить тему для письма с заявкой?
• Как поменять тему заявки в приемщике amoCRM?
• Как добавить голосование?
• Как добавить калькулятор?
• Как различать несколько форм на сайте?
• Как сделать форму, чтобы принимать данные?
• Как сделать, чтобы адреса с разных форм попадали в разные списки в Mailchimp
• Как начать работать с Tilda CRM?

Ошибки

Ошибка в заявках: «Error: sberbank: Доступ запрещён». Что делать?
Ошибка: «ERROR:The Tilda is configured for another domain»
Появляется ошибка: «Temporary CDN error. Please try again later.» Почему?
При передаче проекта ошибка: «У пользователя, которому вы хотите передать проект, бесплатный план или пробный период тарифа Personal. Он не может принять ваш запрос

Ему необходимо оплатить подписку»
Функция «Google безопасный просмотр» обнаружила попытка фишинга
Осторожно, поддельный сайт! Посещение сайта может привести к установке вредоносного ПО или хищению личной информации
Ошибка в заявках: «IP in users black list». Почему?
Ошибка в заявках: «Bitrix24 error: invalid_grant»

Почему?
При экспорте ошибка «Error file not added». Что делать?
После подключения Яндекс.Почты ошибка «Yandex error 200 — bad_uid». Почему?
При посещении сайта ошибка ERR_SSL_VERSION_OR_CIPHER_MISMATCH. Почему?
Появилась ошибка: «Слишком много текста в блоке». Данные не сохраняются. Что делать?
После подключения Яндекс.Почты ошибка «Yandex error 200 — occupied». Почему?
После подключения Яндекс.Почты ошибка «Yandex error 200 — no_registrar_url_for_this_action». Почему?
Ошибка в заявках: «Webhook URL not available». Почему?
Ошибка при заполнении формы «Error . Please, try again later». Почему?
Ошибка в заявках: «Error: Data didnt send, because Receivers in form form* not active». Почему?
Ошибка в заявках: «Error: There are data receivers from another website on the block with a form». Почему?
Ошибка в заявках: «Error: Service deleted». Почему?
Ошибка в заявках: «Bitrix24 error — expired_token» или «Re-authorized application, please (invalid_request)». Почему?
Ошибка в заявках: «Getresponse error: Contact already added». Почему?
Ошибка в заявках: «Getresponse error: Contact doesnt save: Cannot add contact that is blacklisted». Почему?
Ошибка в заявках: «AmoCRM error: save lead. Код ошибки 402. Functional not paid in this account». Почему?
Ошибка в заявках: «Error in form. Cannot find EMAIL or PHONE field». Почему?
Ошибка в заявках: «Getresponse error: Invalid params». Почему?
Ошибка в заявках: «Getresponse error. Contact doesnt save: Custom field invalid: Missing phone prefix». Почему?
При посещении сайта ошибка ERR_TOO_MANY_REDIRECTS. Почему?
Ошибка в заявках: «Getresponse error. Contact doesnt save: Custom field invalid: Value is not numeric». Почему?
В Яндекс.Вебмастере ошибка «Сервер отвечает редиректом на запрос /robots.txt». Что делать?
Ошибка в заявках: «AmoCRM error: not have permissions for save lead». Почему?
Ошибка в заявках: «Contact did not save. ». Почему?
Ошибка в заявках: «Error: Double post data with ». Почему?
При посещении сайта вижу ошибку «Domain has been assigned. Please go to the site settings and put the domain name in the Domain tab». Почему?
Ошибка Today you created (100) pages what your current plan allow. Try do it tomorrow. Почему?
Ошибка в заявках: «Error: Data receivers from another website are linked to the form. Go to the form content, select data receivers and republish the page». Почему?
Ошибка при заполнении формы на сайте: «Отправка данных невозможна. Укажите в настройках сайта действующее имя домена, с которого будет осуществляться отправка форм. Или же к форме не подключен приемщик или был удален. Домен с которого были отправлены данные». Почему?
Ошибка при заполнении формы на сайте: «К форме не подключен приемщик или был удален. Домен с которого были отправлены данные: *». Почему?
Ошибка в заявках: «Data receiver was deleted when a lead was sent. Check if the right box is ticked in the form content». Почему?
При посещении сайта пишет «Соединение не защищено». Что делать?

Какие такие конструкторы

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

Бло­ки мож­но настро­ить по вку­су, но в целом они огра­ни­че­ны по воз­мож­но­стям. Зато их не нуж­но про­грам­ми­ро­вать: в боль­шин­стве кон­струк­то­ров всё про­ис­хо­дит в режи­ме drag’n’drop. Это зна­чит, что доста­точ­но выбрать блок, пере­та­щить его на нуж­ное место, впи­сать текст, вбро­сить кар­тин­ку, и всё — блок рабо­та­ет. В ито­ге мы жерт­ву­ем гиб­ко­стью и воз­мож­но­стя­ми настрой­ки ради того, что­бы делать сай­ты было про­сто.

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

Немного об AIDA

Для продающих LP также существуют типовые структуры, которые позволяют сделать текст мотивирующим к покупке услуги или товара

Я использую AIDA — это сокращение означает Attention, Interest, Desire, Action (внимание, интерес, желание, действие)

В первом блоке (Attention) указывается информация, которая должна привлечь внимание потенциального покупателя (пользователя);
В Interest описываются “боли” потенциального клиента (проблемы, с которыми он сталкивается), как правило, тут же появляется намек на то, что эти боли можно решить с использованием товара, либо услуги;
Блок Desire подробно описывает преимущества, которые избавят клиента от проблемы (время, скорость, комфорт). В этом блоке хорошо размещать фото, чтобы срабатывало визуальное восприятие;
Блок Action — представляет собой побуждающий к действию призыв, часто с дополнительной мотивирующей составляющей (скидки, акции с таймером и т.п.).. Если вы не профессиональный дизайнер, я бы рекомендовал минимально изменять готовые шаблоны Tilda

Даже опытным веб-мастерам, порой, сложно улучшить эти типовые шаблоны, так как цвета, шрифты и фото подобраны очень органично

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

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

Тарифы и возможности

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

• Ограниченный бесплатный тариф Free — это один сайт и возможность его публикации в сети с родным доменом Tilda;
• Personal за 500 рублей в месяц позволяет использовать все функции платформы для одного сайта (в том числе, привязку собственного домена);
• Самый дорогой тариф Business за 1000 рублей в месяц увеличивает количество сайтов до 5 и открывает опцию экспорта исходного кода.