Как команда разработки в "Логеме" поженила ежей, ужей и Тильду

ЗаказчикЭкосистема сервисов «МТС Линк«ЗадачаПеренести статьи блога на WordPress для SEO, разработать админку на Laravel для управления лендингами на Тильде

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

В общем, классика! Поехали!

04d8cec18af8d5d94f39932c675f38ca.png

В роли кота — команда разработки «Логема», в роли Примуса — Тильда

ПАРА СЛОВ О КЛИЕНТЕ И ЗАДАЧЕ

 «МТС Линк» — это платформа бизнес-коммуникаций и совместной работы, на которой ежегодно проходит до 5 миллионов онлайн-мероприятий. Сайт такой компании должен выполнять свои функции: рассказывать клиентам платформы о новостях, знакомить с тарифами, продуктами и нести полезную нагрузку в виде блога,  ? п? о? т? о? м? у? ? ч? т? о? ? т? а? к? ? х? о? т? я? т? ? S? E? O? . А еще компания постоянно тестирует гипотезы с помощью настраиваемых брендированных лендингов. 

Формула успеха завязана на статейном продвижении и желании быстро проверять гипотезы. Если будут высокие показатели в Google PageSpeed и реальные поведенческие — будет совсем хорошо. Как с этой целью действует маркетолог: сначала создается лендинг, измеряются показатели трафика и A/B тестов, затем льется рекламный трафик. Если конверсия достойная, страницу дорабатывают по рекомендациям оптимизатора. Логично, что чем больше людей придут в компанию из поиска, тем приятнее будут показатели вовлеченности, прибыли, лояльности. При этом желательно, чтобы между маркетологом и лендингом не было программиста, которому нужно платить деньги за разработку страницы. А когда программист будет нужен?

  • Когда после подключения Тильды станет ясно, что сайту не хватает скорости и гибкости для продвижения;
  • Когда потребуется добавить к Тильде еще одну CMS и настроить уже ее, чтобы было и гибко и быстро;
  • Когда бизнесу потребуется современный фронтенд на Vue или React`е.

8518056e9cf5db829863fcaf5e808622.png

В чем была сложность? Сайт заказчика был разработан в связке PHP 5.4 + October CMS на базе Laravel v5. Фактически, речь шла об устаревшей версии ПО и отсутствии нужной для оптимизаторов функциональности. Нам пришлось обновить стек до PHP 8.1 с Laravel v9 и Nuxt.js, заново написать код и оптимизировать структуру. А еще: подключить Wordpress для хорошей SEO-оптимизации и Тильду, для запланированных массовых лендингов под гипотезы и сбор лидов.

7e9daf55c4d31550a91e574877659e7f.png

Почему выбрали еще и Тильду? Конструкторы умеют решать задачи бизнеса, если нужно быстро протестировать гипотезу: запускаете страницу, запускаете рекламу и собираете лиды

Wordpress — нормальная история для клиентов, которым нужно что-то доброе и вечное для блога, с максимальными возможностями из коробки. Тильда хороша для визиток и лендингов. Чтобы не затрагивать холиварную тему о том, что seo на этом конструкторе имеет ограничения, вернемся к истории о разработке; к тому же, за SEO у нас отвечал WP. (SEO-оптимизаторы приглашаются к обсуждению, поп-корн за наш счет). 

Казалось бы, задача решена? Был медленный и устаревший вариант сайта, а теперь — комбайн, на котором можно все, что угодно. На Тильде разместили около 300 страниц: посадочные и экспериментальные для А/Б тестов. На WP мы перевезли более сотни статей, которые до этого хранились в отдельных файлах; контент стал управляемым, менеджерам больше не нужно было изучать программирование в свободное от основной работы время. Стало возможным полное изменение структуры страниц на фронтенде без какой-либо зависимости от бэкенда. Переписанное на современный фреймворк решение и компонентный подход позволили объединить хранение скриптов, ускорить загрузку сайта на 37%.

b53d651e9c620dd83deeee9388f05107.png

 Примеры задач, которые удалось решить:

  • Исправили показатели Core Web Vitals и оптимизировали скорость загрузки страниц;
  • Сделали пагинацию для списка статей в блоге и настроили хлебные крошки на сайте;
  • Скорректировали sitemap.xml и robots.txt, сгенерировали карту сайта, общую для 3-х CMS;
  • Перевезли статьи на WordPress;
  • Перевезли внутренние страницы для теста гипотез на Тильду и автоматизировали процесс их создания;
  • Перенесли исполнение части JS-скриптов в отдельные потоки;
  • Настроили обе CMS, попутно решив несколько задач по seo на сжатие изображений, внедрение JSON- и Open Graph-разметки.

Но появились новые трудности:

  1. У маркетологов возникала задача по массовой проверке форм на лендингах, а в текущей реализации, инструментов для этого не было;
  2. Не было контроля версий страниц на Тильде — не получалось отслеживать изменения;
  3. Нужно было сохранить возможность создавать/редактировать страницы через Тильду, но забирать их на наш сервер при необходимости для доработок;
  4. Нужен был человеческий поиск. Например, маркетологу требовалось заменить какое-либо слово на всех лендингах Тильды, но найти его вхождения через админку было невозможно, пришлось бы методично открывать каждую страницу. Полноценный поиск по документам и адресам в импровизированной админке гарантировал «Логеме» плюс в карму.

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

КАК РЕШАЛИ ЗАДАЧУ

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

Решили проксировать Тильду

Сначала мы предложили проксирование. Казалось бы, контент-менеджеры и маркетологи заказчика теперь могли спокойно решать, какой из 400 лендингов на Тильде требует внимания — гипотеза выстрелила, трафик можно приводить не только через контекст или таргет, но и с органики. Нужна доработка страницы? Проксируем страницу на сервер с помощью nginx → посетитель даже не замечает перехода между нашей версией страницы и Тильдой, но…

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

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

Подключили фреймворк

Имея такую возможность, мы решили посмотреть, что будет, если вместо проксирования мы будем скачивать нужные страницы с Тильды, показывая их с сервера. Ключевая идея была в том, чтобы связав Тильду с современным фронтенд-фреймворком, обеспечить заказчику больше гибкости в возможностях SEO-оптимизации и настройки страниц. Следите за руками: взяли PHP, Nuxt.js, Laravel и настроили все так, чтобы у контент-менеджера была возможность создавать/редактировать страницы через ЛК Тильды. При сохранении эти страницы передавались на наш сервер и выводились через него же.

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

4970fa602e2183c1f0614242045aef3d.png

Написали админку

Чтобы все это было удобно админить, за основу взяли решение на Laravel. Ничего уникального: Laravel Breeze + кастомные компоненты. Например, авторизация и регистрация, тарификация, персоналии авторов статей. 

7973aa88e74ebf71fd4409d6ec56ebca.png

083633cac3fc606caac9f28a0dc4f020.png

В решении из коробки не было поиска: весь контент был реализован в виде бесконечного списка. Нужные поля мы добавили и теперь у контент-менеджера появилась возможность искать любой материал по текстовому отрывку (заодно и видеть, где еще используется тот или иной текст), а также осуществлять поиск документа по части известного url.

74606358061b0d22f40d0a6354e930d6.png

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

616e108124d270994efe81a351fb6204.png

5386d6eccf2ff274bb1fdd8686da9bdb.png

РЕЗУЛЬТАТЫ РАБОТЫ

Сейчас измеряемых метрик, которые касаются скорости работы в админке, у нас для вас нет. Контент-менеджеры и маркетологи как работали раньше, так и продолжают работать. Но теперь возможности маркетологов стали еще шире — можно делать много хорошего, тестировать гипотезы и не платить за разработку сложного и спорного лендинга сразу много денег. Если счастье SEO-специалиста можно измерить, то остановимся на том, что оптимизатор в этом кейсе был очень рад, потому что стало можно:

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

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

При создании таких ресурсов самое важное — метрика Time to Market, а она никуда не делась. Соорудить лендинг можно очень быстро, если нужно протестить бизнес-гипотезу: например, маркетолог хочет пройти клиентский путь и выяснить, как оптимизировать воронку продаж, но так, чтобы не привлекать разработчика, дизайнера и еще десяток людей к процессу.

d23d6a2b8c4bdacb132ed99618283641.png

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

c8b88ff9bf889fcfe75c854b9446ebbe.png

ПАРА СЛОВ ДЛЯ ТЕХ, КТО ДОЧИТАЛ ДО КОНЦА

Сегодня поисковые системы отдают приоритет не конкретному документу, а структурированной базе данных документов, если хотите — коллекциям. Строятся целые графы, хитрым способом распределяется вес страниц. Формулы расчета основаны на филигранном балансе между тем, как оптимизатор расширяет запросный индекс и суммарным спросом, на который поисковая система может ответить. Такая борьба за первые пять мест в выдаче порождает агрессивный поиск точек роста для любого сайта: что можно добавить, улучшить, чтобы сайт получил больше полезного трафика? Тильда здесь может выступать в качестве ограничения, а может — в качестве бонуса; все индивидуально. Поэтому:

  • Хотите MVP — делаете сайт на Тильде;
  • Хотите конкурировать с сайтами, у которых большой траст, запросный индекс, проработанные коммерческие факторы — делаете сайт на более гибкой платформе, которая позволяет внедрять всякие-разные технические задания.

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

  • Не каждому бизнесу нужны сложные, дорогие в обслуживании и ресурсозатратные связки ПО/сервисов. Какой-нибудь условный airtable + zapier + webflow + еще пару сервисов будут съедать бюджет очень быстро. Некоторые из них требуют постоянной подписки, имеют ограничения по объему данных — не слишком ли много проблем, чтобы быстро протестировать гипотезу?
  • Переезд на Wordpress или другую CMS может прокатить, но когда бизнес-процессы подразумевают 50–100–200 полноценных одностраничников — контент-менеджер будет грустить не меньше, чем оптимизатор.?

Проблема в работе таких сайтов, если говорить простым языком, состоит в количестве действий, которые надо совершить для внесения изменений на все 100500 страниц. Если задача стоит в том, чтобы поменять header, то надо будет пройтись вручную по каждой странице. А еще, обычно, сверху нависает команда оптимизаторов и менеджеров с ворохом технических заданий. Возникают вопросы: как все это внедрять, оправданы ли будут попытки дорабатывать эту систему?

417af9020a3dc02fd3359f379ce68bfe.png

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

Павел Машанов,
технический директор компании «Логема»

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

4fd3357688777f66b9ffe1418f45cb3a.png

P.S. Да, нам пришлось в это погрузиться, чтобы быть полезными клиенту. Если ваш подрядчик или команда разработки сообщают, что их дело «внедрять», а не «разбираться», тогда приходите к нам. В «Логеме» все по-красоте, мы помогаем с любыми решениями.

Перейти на сайт

Полный текст статьи читайте на CMS Magazine