Content Oriented Web
Make great presentations, longreads, and landing pages, as well as photo stories, blogs, lookbooks, and all other kinds of content oriented projects.
НАПИШИТЕ НАМ
Спасибо за обратную связь!
Сравнение этапов разработки сайта, какие могут быть подходы
email рассылка
Каталог в тильде
SEO продвижение на Тильде
Популярность тильды в 2021
Какие сотрудники могут работать в Тильде
Отзывы о тильде других пользователей
За что платить Тильде
Какие сайты можно делать на Тильде
Как посчитать стоимость разработки сайта
Как перенести сайт на Тильду и зачем это делать
Дополнительные возможности Тильда
Служба работы с историей клиентов
Верстальщик берет макет и переводит его в html-код. Далее пишутся скрипты, которые оживляют проект: кнопки нажимаются, заявки отправляются, калькуляторы работают и прочее
Дополнительно к сайту подключаются метрики для отслеживания аналитики, пиксели, устанавливается SSL-сертификат
HTML-верстка и программирование
CMS (система управления сайтом)
На этом этапе проект подключается к админке, с помощью которой далее будут вноситься изменения на сайте: добавляться новые страницы и статьи, логотипы партнеров и прочее
Сайт подключается к уникальному адресу в интернете
Сайт пока — набор файлов и папок. Для того чтобы он работал, его необходимо загрузить на хостинг (сервер-хранилище)
Это процесс сканирования сайта поисковиками и занесения его страниц в поисковую выдачу (Гугл, Яндекс и прочие)
При эксплуатации сайта вам наверняка потребуется вносить изменения в контент, а также следить за тем, чтобы все работало корректно. Этот этап и называется поддержкой или сопровождением
#
#
#
#
#
#
Верстальщик берет макет и переводит его в html-код. Далее пишутся скрипты, которые оживляют проект: кнопки нажимаются, заявки отправляются, калькуляторы работают и прочее
Верстка на Тильде
Сайт далее может хостоваться у Тильды
Техническая оптимизация
Делаем адаптив, подключаем формы, проверяем работу всех элементов. Повторимся, что этапов разработки на самом деле гораздо больше (о них — в наших модулях), но они справедливы в общем для всех сайтов, а сейчас мы показываем именно отличия Тильды от других способов создания проекта в интернете
Вы сможете в любой момент редактировать проект, добавлять новые страницы и вносить в него любые изменения, какие угодно вашей душе. Кроме этого, сайт можно подгрузить по API в ваш сайт на другой платформе, а также код проекта может быть экспортирован и загружен на ваш хостинг (такой, как при обычной разработке). В первом случае страницы можно будет собирать и редактировать на Тильде, а во втором вы утратите возможность редактирования, в режиме онлайн, но можете «перезагружать» измененные страницы на сторонний хостинг (или кодить)
#
#
#
Дизайнер использует Тильду как дизайн-инструмент (по большому счету, все равно, что использовать, Фотошоп или Тильду — принципы там примерно одинаковые). И сайт сразу работает.
# На Тильде логика почти такая же, только упрощенная: html-верстка и программирование не требуются, а CMS и хостинг предоставляется самой Тильдой
Полный цикл разработки сайта с нуля.
#

Сравнение этапов разработки сайта.

Домен
Хостинг
Индексация
Поддержка
Шаг 1 ИЗУЧЕНИЕ
Шаг 2
Исследовать компанию или персону, для которой разрабатывается проект, собрать все требуемые данные для сайта. Ответить себе на вопрос: Что мы знаем о том, кому будет служить сайт?

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

Собрать мудборд (подборку с вдохновляющими примерами), ответить себе на вопрос: Как сделали другие и можем ли мы их превзойти?
#
#
Идея и структура будущего сайта Все твердят: «Сайт начинается с контента», «Контент — король» и вот это все. На самом деле это не совсем так. Сайт начинается с идеи и понимания структуры. Задача этапа — получить ответ на вопрос «Что делаем?». Сколько в нашем сайте будет страниц? О чем примерно будем на них говорить и почему? Результатом этого этапа должны стать описанная концепция, схема будущего сайта и ТЗ на тексты
Шаг 3
Шаг 4
Написать тексты
Этот шаг можно разбить на несколько частей:
1. Придумываем центральный оффер или работаем с его формулировкой. Кто мы такие и что нам надо от посетителей сайта?
2. Пишем текст. В уроках попробуем рассказать о методике, которая позволит написать текст, даже если вы этого никогда не делали.
3. Редактируем. В агентстве это обычно делает профессиональный редактор — указывает на слабые места. В уроках расскажем, как можно «сымитировать редактора».
4. Проверяем ошибки. Корректор вычитывает текст.
5. Оптимизируем текст. Прописываем основные мета-теги
#
#
Подготовить прототипы Прототип схематично изображает полную структуру сайта, расположение текста (работаем уже с реальными текстами), изображений, видео, ссылок. Важно понимать, что прототип — это не дизайн. Это просто серая схема с текстами, которую дизайнер будет использовать далее, «натягивая» дизайн на этот каркас
Шаг 5
Определиться с дизайном (эскизы) и отрисовать типовые блоки На этом этапе можно подготовить несколько визуальных концепций. Для этого не нужно отрисовывать все страницы сайта, достаточно одной, например, главной. После того как определимся — готовим визуализацию для типовых блоков, которые встречаются на других страницах, и фиксируем стили: кегли и начертание текста, отступы и цветовые решения
#
Шаг 6
Верстка сайта на Тильде
Этот шаг можно разбить на несколько частей:
1. Верстка главной страницы, типовых блоков, хэдера и футера. Именно они определяют, как сайт будет строиться дальше — как хорошо вы сделаете заготовки = как быстро и правильно будет идти далее верстка.
2. Вот здесь готовится адаптив главной и типовых блоков: как сайт будет выглядеть на планшете и смартфоне.
3. Верстка корневых страниц. Готовим основные типовые страницы (которые могут служить шаблонами для прочих — например, мы создаем одну страницу Услуги, а все остальные будут строиться по этому же принципу).
4. Наполнение контентом. Здесь речь пойдет о заполнении карточек товаров, или верстке статей блога, или заполнении всех Услуг.
5. Верстка технических страниц. Страницы Ошибки и Успеха, Политика обработки персональных данных, Публичная оферта.
6. Проверяем адаптив. Убедитесь, что все страницы со всех устройств отображаются корректно
#
Шаг 7
Техническая оптимизация, подключение необходимых интеграций (системы аналитики, рассыльщики) и систем оплаты
Какие работы нужно провести:
1) тестирование работы сайта (проверить, чтобы все кнопки нажимались и вели, куда нужно);
2) подключение и тест форм (куда уходят данные при заполнении форм?);
3) подключение и тест иных интеграций (от CRM до платежных систем);
4) подключение систем аналитики (Яндекс Метрика и Google Analytics) и пикселей (например, Facebook и ВКонтакте);
5) подключение SSL;
6) проверка работы технических страниц;
7) проверка индексации;
8) проверка метатегов и установка бейджей для социальных сетей;
9) установка фавикона;
10) подключение доменного имени.
#
Упрощенный цикл разработки сайта за 20 000 рублей.
Выбрать более подходящий шаблон для заданной тематике. Показать клиенту. Внести пару правок.
Поменять телефоны, адреса, фразы.
Шаг 8
#
# Во-первых, процесс разработки в каждой компании строится по разному. Где-то он состоит из большого количества этапов, с участием различных специалистов и занимает существенное время. Где-то все происходит проще и быстрее.
# Во-вторых, многое зависит от требований, которые предъявляет к конечному продукту заказчик. Чем больше требований, тем больше человеко-часов необходимо на работу.

ТРЕБОВАНИЯ:
# Ожиданий от дизайна.
# Объема контента.
# Интеграции с внешними сервисами.
# От стоимости ставки одного специалиста. Ставки специалистов в разных компаниях отличаются.
Шаг 1 ИЗУЧЕНИЕ
#
Изучить нишу, составить список из 20 шаблонов подходящие под тематику.
# Лендинг (одностраничник), промо-сайты, сайты для мероприятий или HR-целей, Маркетологам нужны лендинги для мероприятия, Тильда держит посещаемость ресурса 20 тысяч человек в день, не падает от нагрузок, все люди пришли, организаторы счастливы!
Корпоративный сайт
Интернет-магазин
На Тильде можно делать полноценные большие многостраничные сайты для бизнеса, со сложными перелинковками, с новостями и контент-проектом внутри. Единственное ограничение для корпоративных порталов — лимит в 500 страниц в рамках одного проекта. Но этого более чем достаточно, редкий подобный сайт имеет более 50 страниц
#
#
На Тильде можно делать интернет-магазины до 500 (если нужно, чтобы каждый товар имел отдельную страницу) и до 5000 товаров (если они организованы с помощью каталога). Особенно классно в Тильде то, что можно протестировать нишу с минимальным вложением ресурсов — сделать своеобразный MVP магазина, пустить на него трафик и понаблюдать за продажами. Дальнейшую разработку — сложные личные кабинеты, избранное и прочее — можно будет финансировать уже из заработанных средств.
Личный сайт или портфолио
Блог или спецпроект
Прекрасный и быстрый способ создать свое портфолио и рассказать о себе — сделать сайт на Тильде. Обновляйте работы, принимайте заказы
#
#
Тильда отлично подходит для ведения блога. Но вам нужно знать о двух минусах. Во-первых, в Тильде совсем недавно появился способ организации контента — Потоки, с ними можно сделать теги, но этот инструмент пока сыроват. Во-вторых, есть ограничение в 500 страниц (тоже надеемся, что его снимут). При регулярном выпуске 10 материалов в месяц сайта хватит на 4 года. То есть пока для контент-проектов Тильду можно рассматривать как временный вариант
Презентации
В Тильде можно создать презентацию из полноэкранных проектов и перемещаться от слайда к слайду с помощью кнопок «вверх-вниз». Добавьте блок Т203 в категории Другое — и каждый блок превратится в отдельный слайд
#

Какие сайты можно делать на Тильде?

# Это постраничная визуализация сайта. Макет готовит веб-дизайнер, и уже на этом этапе можно понять, как сайт будет выглядеть. Но пока он — картинка, которая не имеет адреса в интернете, не ищется, не индексируется и пока не работает. Обычно готовится в Фотошопе, Скетче, с недавних пор — в Фигме, а вообще, в любой удобной графической программе — по согласованию с верстальщиком, которому будет передаваться макет
Дизайн макет
#
# Тильда позволяет оптимизировать работу и помочь управляющему (менеджеру) без навыков заниматься оформлением кейсов. Тильда имеет большое количество блоков, но для того что бы оформить любой кейс достаточно даже 15 типовых блоков.
Цель данной- статьи рассказать о тех блоках которые являются самыми популярными и универсальными, и показать как с их помощью можно создать прототип любого сайта. За основу будут взяты несколько сайтов, и переработаны с помощью стандартных блоков тильды. По результатам эксперимента произведем сравнение оригинального сайта и сайта собранного из стандартных блоков.
#
Точнее, на сегодняшний день один редактор. Внести изменения в текст, добавить картинки, даже сделать простой адаптив, который дизайнер упустил из виду, — редактору это по силам.
Редакционная
Задачи того же плана: поменять предложения, даты курсов, условия, добавить блок или форму.
Маркетинговая
В том числе я в качестве арт-директора.
Глобальных неразрешимых проблем с Tilda не помню — разве что частности. Как человек, старающийся сохранять корпоративную идентичность, я почти всегда пользуюсь zero-блоками и избегаю стандартных. Между тем в Zero Block, как ни странно, нельзя сделать некоторые вещи, которые доступны в обычных, не кастомных блоках. Хотя вот недавно в Zero Block добавили формы и стало гораздо лучше.
Дизайнерская
# Мы до сих пор живём в формате стартапа, поэтому у одного человека в команде часто целый веер обязанностей. Так что с Tilda в Contented работают три группы сотрудников:

Какие сотрудники могут работать в Тильда?

# Растет кол-во фрилансеров, которые делают очень неоднородный по качеству продукт — от очень крутых сайтов на Zero Block с анимацией, до очень простых страниц-визиток, нацеленных на быстрый старт бизнеса. Над всем этим существует надстройка из агентств, которые либо специализируются на тильда-разработке, либо используют Тильду как один из инструментов. Их сравнительно немного, достаточно посмотреть каталог веб-студий CMS Magazine, включив фильтр CMS: Tilda Publishing.
# " Как я считаю, самое крутое в нашем опыте с Tilda то, что нам удалось разгрузить своих фронтендеров и не быть привязанными к их обстоятельствам. У них большая очередь задач — в нее еще нужно попасть. Да и мне самому легче сделать страницу лично, сообща с дизайнером, чем растолковывать фронтендеру, чего я хочу. "

Популярность Тильды в 2021 году

Растет кол-во фрилансеров, которые делают очень неоднородный по качеству продукт — от очень крутых сайтов на Zero Block с анимацией, до очень простых страниц-визиток, нацеленных на быстрый старт бизнеса. Над всем этим существует надстройка из агентств, которые либо специализируются на тильда-разработке, либо используют Тильду как один из инструментов. Их сравнительно немного, достаточно посмотреть каталог веб-студий CMS Magazine, включив фильтр CMS: Tilda Publishing.
#
# В итоге главный профит от Tilda непосредственно для нас — скорость и экономия ресурсов.

# " В целом, пожалуй, я бы даже не применял к Tilda термин «конструктор». Стандартные блоки, с которых она начиналась, в настоящее время явно не основная ее функциональность. Профессиональные дизайнеры и, шире, команды продакшена скорее предпочитают Zero Block, который идеологически гораздо ближе к базовым принципам создания цифрового продукта. "
# " С созданием лендинга справляется один дизайнер. Хорошо бы, чтобы при этом у него были базовые знания CSS. Впрочем, мы наработали свою базу шаблонов — тех блоков, которые устраивают наших внутренних заказчиков, хорошо адаптируются и предсказуемо ведут себя в пространстве Mos.ru. Благодаря им менеджеру по силам самостоятельно собрать лендинг всего за несколько часов — при условии, что контент полностью готов.
Это бывает актуально, когда нужно выпустить проект суперсрочно. "
# " Эта своеобразная библиотека родилась из решения сделать для наших редакторов готовый формат лонгрида с админкой. Мы тогда не смотрели на Tilda, а опирались на формат наших редакционных материалов — то, как написаны статьи, — собирали референсы по другим СМИ и в результате сделали макет с несколькими видами галерей, врезок и цитат. И обнаружили, что всё это реализуемо на Tilda.
К тому времени у нас уже была создана инфраструктура для импорта проектов с Tilda по API. Перенести проект с платформы может практически любой, включая операторов службы поддержки. Никаких специальных навыков не надо — только доступ в админку.
У нас при импорте автоматически подтягиваются наши шапка и подвал, счётчики, в админке можно задать метатеги и OpenGraph-теги для страницы.
Иногда некоторые блоки после выгрузки на сайт могут вести себя некорректно. Например, в блоке с развлекательном тестом не работала «шарилка». Мы обратились в службу поддержки Tilda и попросили сделать так, чтобы при шаринге прописывались не абсолютные, а относительные пути. На нашу просьбу откликнулись довольно быстро, блок починили. Так что маленький совет: если можете произвести диагностику — делайте это сами и просите о конкретном решении. "


По нашему опыту, достаточно одного, причём даже внештатного, дизайнера, чтобы собрать приличный лендинг. Как следствие, маркетинг в YouDrive удалось сделать независимым от айтишников, точнее, от степени их загруженности.
# " Как видно по комментариям экспертов, Tilda встраивается в бизнес-процессы самых разных компаний. Наверняка вы заметили, что выделяются типовые кейсы ее применения — например, оперативно соорудить лендинг о новом продукте или мероприятии, создать блог или сверстать статью. Бывают и более необычные сценарии: оформление писем для рассылок, создание обучающих курсов. Если перед вами стоят задачи, похожие на те, о которых рассказали наши герои, то с оглядкой на эти шесть историй, надеемся, вам будет проще попробовать Tilda и освоиться с ней.. "
#

Отзывы о тильде других пользователей

Верстальщик берет макет и переводит его в html-код. Далее пишутся скрипты, которые оживляют проект: кнопки нажимаются, заявки отправляются, калькуляторы работают и прочее
Разберем на примере лэндинга
Стоимость формируется из примерного объема времени (13 часов), необходимого на работу умноженного на ставку 1500 руб. Если экранов, например, двадцать, время на сборку пропорционально увеличивается, соответственно, растет стоимость.

Если у вас особые требования к дизайну, мы отдельно разрабатываем дизайн-концепцию стоимостью 35 000 руб. Это сложный и трудоемкий процесс и как правило включает в себя дополнительные правки от клиента (до двух итераций), которые мы учитываем
#
#
#
Стоимость одностраничника у нас начинается от 20 000 рублей. В эту стоимость входит сборка 5−7 экранов на готовых блоках и все необходимые базовые настройки.
Стоимость дизайн-концепции также складывается из времени, которое затрачивает на работу дизайнер.


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

Как посчитать стоимость разработки сайта на Тильда?

Tilda Publishing
# На самом деле Тильда отличный инструмент, если знать его ограничения и особенности. Мы (digital-агенство), например, на порядок увеличили обороты и лояльность клиентов за счет увеличения скорости разработки. При этом на аналитику, проектирвание и креатив получается выделять еще больше времени – что влияет на качество продукта, как нильзя лучше.
Как видно по комментариям экспертов, Tilda встраивается в бизнес-процессы самых разных компаний. Наверняка вы заметили, что выделяются типовые кейсы ее применения — например, оперативно соорудить лендинг о новом продукте или мероприятии, создать блог или сверстать статью. Бывают и более необычные сценарии: оформление писем для рассылок, создание обучающих курсов.
# Если перед вами стоят задачи, похожие на те, о которых рассказали наши герои, то с оглядкой на эти шесть историй, надеемся, вам будет проще попробовать Tilda и освоиться с ней!
#
# Сайты на Тильде дешевле и быстрее в разработке и поддержке, а также хорошо индексируются поисковиками И не важно, каков уровень дизайна — за 10, 100 или 500 тысяч рублей. Вы в любом случае не будете платить за этап html-верстки и программирования. Кроме того, вы сэкономите время, не проводя эти работы. Таким образом, вы сможете быстрее проводить AB-тесты, и, как следствие — быстрее запускать продукты. С SEO у Тильды также все в порядке.
# Уже готовые интеграции с популярными сервисами, платежными системами и встроенная CRM Тильда интегрирована примерно с 20 популярными сервисами для приема форм и с 12 платежными системами.
# Масса других плюшек: конструктор писем, анимация блоков Рассылку можно делать прямо в Тильде (так же просто, как и верстать сайты), подключить один из сервисов рассылок, например, Mailchimp, и отправить красивое письмо. Сайты на Тильде можно анимировать. В Тильде есть генератор UTM-меток.

За что платить Тильде?

# К сожалению, ответ неутешительный. На чем бы не был сделан ваш сайт, не существует возможности его автоматического переноса. Чтобы перенести сайт на Тильду, вам придется с нуля создавать его в Тильде. Вы можете практически один в один воспроизвести дизайн (возможности Тильды, в частности, Zero Block, это позволяют), но все содержимое вам необходимо вручную добавлять в блоки конструктора. Переподключать домен. Даже фавикон вам придется вручную грузить в Тильду.
# Этим вопросом задаются многие владельцы сайтов и специалисты, по достоинству оценившие возможности Тильды. Но как быть, если у тебя есть сайт на Wordpress или 1C-Битрикс и ты, как и многие, решил перейти на Тильду?

# "Для меня верхом заботы о пользователях стало создание Тильдой после вступления в силу поправок к ФЗ-152 Конструктора политики конфиденциальности. Это говорит о большой клиентоориентированности. Как и работа службы тех. поддержки. Доходило до того, что мне присылали куски CSS, чтобы я мог кастомизировать стандартный функционал так, как мне было нужно."
# "Интересно, с чем приходилось работать на этапе пресейла — мне присылали дизайн-макеты в самых разных форматах, подробно проработанные ТЗ или абзац текста, mind map и даже ссылки на сайты с просьбой скопировать один в один."