Переделка сайта психолога с Tilda на собственный код: дизайн, блог и скорость 99 баллов

Клиент и задача

Частный психолог Анатолий Яско помогает людям после измены и расставания, при фобиях и зависимостях, а также консультирует коллег по маркетингу и продажам. Его сайт был собран на Tilda и работал: тексты, отзывы, форма и ссылка на книгу были на месте. Но у сайта был потолок, и мы уперлись в него быстро.

Старый сайт (технический адрес на Tilda) это одна длинная страница из стандартных блоков конструктора. Тексты уже были хорошие, их мы почти не меняли, но подать их так, как хотелось, мешали рамки шаблона. Задача была такая: сохранить сильные тексты, сделать сайт, на котором все четко выделяется и нажимается, и добавить то, чего на Tilda не хватало: блог, отдельные страницы под разные запросы и нормальную скорость.

Что было на старом сайте

• Одна длинная страница. Все услуги, отзывы и книга шли подряд сплошным текстом. Чтобы найти нужное, человеку приходилось листать.
• Стандартные блоки Tilda. Выделить главное, сделать нестандартные кнопки или аккуратные карточки можно было только в рамках шаблонов.
• Нет блога и отдельных страниц. Для поиска нужны статьи и страницы под отдельные запросы, а на сайте была только одна страница.
• Сдвиги макета и тяжелые изображения. PageSpeed показывал сдвиги макета 0,178, что выше нормы, и замечания по изображениям без размеров.
• Предупреждение о cookie, которое читалось тяжело и закрывало часть экрана.

Что мы сделали

1. Придумали дизайн, а не собрали из блоков

• Ритм темных и светлых блоков. Короткие сильные утверждения, цифры и заголовки стоят на темном фоне, а длинные тексты, карточки и отзывы на светлом: так глаз отдыхает, а главное выделяется.
• Фирменный цвет остался. Красный акцент мы взяли с заголовков старого сайта, чтобы автора узнавали. Он стал подсвечивать имя, кнопки и важные слова.
• Современные шрифты. Выразительный широкий шрифт для заголовков и спокойный для текста, оба с поддержкой кириллицы.
• Темный фон потеплел. Сначала сайт получился слишком темным, поэтому мы сделали фон теплее и мягче, а светлые блоки сделали кремовыми.
• Единый стиль для соцсетей. Мы свели палитру сайта и каруселей автора в одну, чтобы материалы выглядели как часть одного бренда.

2. Выстроили структуру главной

Главная теперь ведет человека от знакомства к действию: имя и главные цифры, позиция («Наверное, я не психолог»), запросы, с которыми помогает автор, отзывы, публикации в СМИ, свежие статьи, методы работы, цены, соцсети, книга, дипломы и итоговый призыв. Каждый блок отвечает на один вопрос и заканчивается понятным действием.

3. Сделали сайт удобным

• Все, что нажимается, выглядит нажимаемым. Кнопки с иконкой Telegram, понятным наведением и аккуратным скруглением. В шапке кнопка тоже реагирует.
• Карточки-аккордеоны. Пять запросов видны сразу, а подробности раскрываются по клику, поэтому страница не превращается в стену текста.
• Карусели с отзывами и дипломами. Отзывы листаются сами, а по клику открываются целиком на весь экран. Миниатюры одинакового размера, у дипломов естественные пропорции.
• Плавные анимации. Блоки мягко появляются при прокрутке, а карусели движутся без рывков, потому что дорожку мы дублируем целиком.
• Выровненные заголовки и одинаковая ширина блоков. Мы выровняли однотипные блоки, чтобы они выглядели как набор, а не как случайные куски.
• Четкая шапка и подвал, меню с якорями, понятное имя в логотипе с точкой между словами и фавиконка из фотографии автора.

4. Сохранили тексты и аккуратно их доработали

Мы взяли тексты с действующего сайта дословно, а правки вносили только те, что просил автор: сократили вступление, добавили цифры «99% клиентов решают запрос за 4 сессии» и «500+ женщин обратились после измены», обновили описание методов (ДПДГ и DeTUR) и цены. Тексты мы не сокращали по своей инициативе: автор читает их сам и каждое слово ставит осознанно.

5. Добавили блог

На сайте теперь есть раздел с авторскими статьями, которые отвечают на запросы людей: что делать после измены, как работает метод ДПДГ, техника заземления при панической атаке, 36 вопросов для сближения. Для этого мы собрали шаблон статьи: из текстового файла автоматически получаются страница, обложка, оглавление, перелинковка и разметка. Блок «Последние статьи» на главной подтягивает три новых, а в блоге есть рубрики: «Измена», «Методы», «Близость», «Техники».

6. Сделали отдельные страницы

• Страница по измене. Посадочная под главный запрос с отзывами, ответами на вопросы и подробным описанием работы.
• Страница с материалами для тех, кто пришел за бесплатным руководством, и страница «Спасибо» после заявки.
• Публикации в СМИ. Блок с экспертными комментариями автора и ссылками на издания: доверие в одном месте.
• Бесплатные инструменты. Онлайн-тренажер ДПДГ для самопомощи и справочник телефонов доверия по странам. Это дает сайту живой повод для переходов из поиска.

7. Подключили заявки в Telegram

Заявка с формы приходит в личный чат автора в Telegram через серверную функцию на Cloudflare Pages. Чтобы не получать спам, форму защищает проверка Cloudflare Turnstile, а ключи хранятся в защищенных переменных, а не в коде страницы. Кнопки «Написать в Telegram» ведут на отдельный аккаунт для заявок и подставляют готовое сообщение, поэтому писать удобно и понятно, с какой страницы пришел человек.

8. Оформили юридические страницы и согласие

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

9. Провели SEO и техническую подготовку

• Уникальные title и description на каждой странице, canonical, карта сайта, файл robots.txt и файл llms.txt для нейросетей.
• Микроразметка schema.org: персона и услуги, книга, статьи, вопросы и ответы (FAQPage), инструмент (WebApplication) и инструкция (HowTo).
• Чистые адреса без «.html», перенаправление с адреса «www» и технического адреса на основной.
• Подтверждены Google Search Console и Bing Webmaster, при публикации статей адрес отправляется через IndexNow.
• Все изображения переведены в WebP, у картинок заданы размеры, у страницы 404 собственный дизайн.
• Заголовки безопасности: HSTS, запрет встраивания, политика содержимого и ограничения доступа к устройству.
• Весь сайт это файлы без сборки и тяжелых библиотек: он быстро загружается и просто обновляется.

Скорость: было и стало

Измерения сделаны 24 октября 2026 года в Google PageSpeed Insights на эмуляции среднего Android при медленном 4G.

Отчеты: до переделки · после переделки

Результат

Автор получил сайт, который выглядит как его бренд, а не как шаблон: с понятной структурой, четкими кнопками, плавными анимациями, блогом и отдельными страницами под запросы. Сильные тексты остались, но теперь их подают так, чтобы их хотелось дочитать, а страницы приводят людей из поиска. Оценка скорости на смартфоне выросла с 87 до 99, а проверка совместимости с ИИ-агентами в отчете PageSpeed прошла на 3 из 3 против 0 из 2 у старого сайта.

Мы обновим этот кейс. Когда накопятся данные по заявкам и посетителям из поиска, добавим их сюда.

Что вынесли из проекта

• Сильные тексты стоит беречь. Мы переделали подачу и структуру, но не трогали то, что уже работало.
• Конструктор ограничивает, а не запрещает. Tilda хороша для старта. Когда нужны блог, свои страницы, нестандартный дизайн и контроль над скоростью, удобнее свой код.
• Юзабилити это мелочи. Одинаковая ширина блоков, реакция кнопки на наведение и белый крестик на красном кружке читаются сильнее, чем крупная идея.
• Блог и отдельные страницы дают сайту будущее. Одна страница ловит один запрос, а сайт из десятка страниц ловит десятки.
• Скорость измеряется до и после. Тогда видно не только выигрыш, но и то, что стало хуже, и это можно честно показать.

Частые вопросы