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

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

Как создать сайт без программирования на Тильде с нуля Гифка, Длиннопост

Прошли те времена, когда сайты создавали только программисты и IT-компании. Теперь любой, вне зависимости от возраста, рода занятий и навыков, может сделать свой сайт. И выглядеть это будет стильно. Бросьте все эти «не умею», «не могу» и «не разбираюсь». К концу этого материала у вас будет достаточно знаний, чтобы запилить свой собственный интернет-магазин, страницу компании, портфолио (да что угодно) в конструкторе сайтов Тильда.

Почему Tilda подходит для не-программистов


Если вы в принципе не задумывались над тем, как создаются сайты, вы вряд ли пользовались конструкторами и знаете, как они устроены. Tilda — это блочный конструктор сайтов. Внутри больше 480 готовых блоков. Все они разделены по назначению, чтобы было проще найти нужный: готовые меню, обложки, блоки «О компании», списки услуг и тарифов, галереи, формы захвата данных, карточки товаров интернет-магазина и все-все, что нужно вам для создания сайта. И все это вы можете комбинировать, настраивать и изменять на свое усмотрение. А можете и не изменять: блоки сконструированы так, чтобы органично смотреться друг с другом. Отдельный инструмент — «Нулевой» блок. Его возможности почти безграничны, а контент не привязан к заданным местам.


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

Как создать сайт без программирования на Тильде с нуля Гифка, Длиннопост

С чего начать, если я не хочу заморачиваться?


С шаблонов. В Тильде их сотни. При условии, что у вас уже есть вся информация и картинки, вам хватит и получаса (15 минут из них вы будете осваиваться и подгонять детали). Универсальные варианты для компаний, магазинов, блогов и мероприятий, резюме и портфолио. Услуги нотариуса и адвоката, автосервис, салон красоты, кофейня или ресторан, фитнес-центр, детский сад, хостел, мобильное приложение, интернет-магазин, резюме или портфолио. Если вы не готовы заниматься структурой и дизайном, берите один из готовых шаблонов, добавляйте свою информацию и публикуйте сайт.

Совет
Не зацикливайтесь на шаблонах для ваших целей. Лучше смотрите на структуру страницы и подбирайте вариант, который подойдет вашим целям. Заменить контент проще, чем выстраивать структуру. А если в готовом шаблоне не нашлось нужных блоков, поищите их в других примерах и просто скопируйте на страницу.
Как создать сайт без программирования на Тильде с нуля Гифка, Длиннопост

Как редактировать блоки?


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

А что, если мне не нужны шаблоны? Хочу создать свою структуру


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

Как создать сайт без программирования на Тильде с нуля Гифка, Длиннопост
Совет
Накидайте структуру сайта сначала на бумаге. Опирайтесь на цели сайта и поведение вашей целевой аудитории. Подумайте, что хотите донести и какой путь приведет пользователя к желаемой цели: заявке, звонку или реакции на новый пост в блоге. Не исключено, что в процессе структура изменится, но вам нужен план действий, чтобы не растягивать процесс и не сбиваться с пути. А если трудно определиться, почитайте пошаговое руководство Тильды вот тут.

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

Все. Я готов идти дальше. Что там было про «Нулевой» блок?


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

Как создать сайт без программирования на Тильде с нуля Гифка, Длиннопост
Совет
В настройках сайта вы можете выбрать шрифт для всего сайта из стандартных или загрузить свой. После смены шрифта переопубликуйте все созданные страницы.

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

Так-так. Про анимацию подробнее.


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

Давайте-ка откатимся назад. В начале поста было что-то про формы и интернет-магазин.


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

Как создать сайт без программирования на Тильде с нуля Гифка, Длиннопост

С формами все проще. В Тильде есть несколько готовых блоков и настраиваемый объект в Нулевом блоке. Предлагайте посетителям сайта подписаться на вашу рассылку, оставить контакты для связи, отправить параметры будущего заказа для расчета стоимости или написать отзыв. Данные форм будут сохраняться в разделе «Заявки» на странице со списком страниц вашего сайта. Также к любой форме вы можете подключиться один или несколько из 20 сервисов приема данных, включая почту, Google Таблицы, Битрикс, Telegram, Slack, Trello и собственный скрипт.

Совет
Не забывайте о политике обработки персональных данных. По закону у вас она должна быть, и вы должны пообещать (и сдержать это обещание), что данные будете использовать только внутри компании и не станете передавать их третьим лицам. У Тильды есть свой конструктор. В нем вам нужно будет заполнить данные своей компании и цели сбора данных. Готовую политику обработки персональных данных останется только вставить в нужный блок.

Окей. Я в этом деле не новичок. Давайте о серьезном. Что делать с SEO-оптимизацией?


Настраивать! Во-первых, сайты на Тильде, как говорится на самой платформе, автоматически неплохо индексируются в поисковиках за счет последовательной структуры. Во-вторых, конструктор дает целый пул возможностей для SEO-оптимизации.


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

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

Все это слишком хорошо звучит. Сколько мне придется заплатить?


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


Тариф Personal открывает всю коллекцию блоков, позволяет подключить домен, убрать лейбл Тильды. Помимо прочего, вы получите 500 страниц и расширите хранилище на сервере до 1 ГБ. Стоит тариф 500 рублей в месяц, если платить сразу за год. Еще и домен подарят и два курса по дизайну и маркетингу. Если же ваши планы чуть шире, подойдет тариф Business. В него помимо всех преимуществ Personal входит пять сайтов и возможность экспортировать исходный код. Подробные условия тарифов ищите здесь.

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

Создать сайт на Тильде действительно несложно. Даже эта статья куда сложнее. Конструктор создан так, чтобы в нем могли освоиться и программист, и дизайнер, и человек, совершенно не разбирающийся в том, как делать сайты. Площадка предоставляет базовые инструменты и практически неограниченный простор для творчества. Жмите на кнопку и пробуйте. У вас получится!