🏷️ Чек-лист: 25 параметров для проверки сайта на Tilda перед передачей клиенту
Бытует мнение, что собрать сайт на Tilda — это задача на два вечера под чашку кофе. Из-за этого мифа рынок переполнен «специалистами», которые сдают проекты, едва натянув макет из Figma на стандартные блоки.
А теперь реальность: клиент запускает контекстную рекламу или таргет, сливает бюджет в первую же неделю, а конверсия топчется на уровне 0,3%. Начинаем разбираться, и всплывает классический букет: формы теряют заявки из-за кривых масок, на экранах UltraWide поползла верстка, картинки весят по 5 МБ, а мобильные пользователи видят вместо лица спикера его пупок, потому что никто не настроил фокусную точку.
Профессиональный no-code в 2026 году — это не про «подвигать блоки». Это про глубокий технический аудит, бизнес-логику и безупречное SEO. Ниже — жесткий инженерный чек-лист из 25 пунктов, по которому мы проверяем каждый проект перед передачей заказчику. Сохраняйте в закладки, если не хотите краснеть перед клиентом или терять миллионы на кривых интеграциях.
🎨 Блок 1: Дизайн, Верстка и Адаптивность
1. Работа Autoscale в Zero Block
Что проверить: Отображение кастомных блоков на экранах от ультрабуков (1366px) до огромных 4K-мониторов (2560px+).
Зачем это нужно: Избежать появления позорного горизонтального скролла на ПК и эффекта «поплывшей» верстки, когда элементы накладываются друг на друга.
Как сделать в Tilda: Открыть настройки Zero Block, активировать функцию Autoscale (Scale / Window Width) для нужных брейкпоинтов и проверить корректность масштабирования через режим разработчика в браузере.
2. Focal Point на обложках (Cover Blocks)
Что проверить: Как кадрируются фоновые изображения на экранах смартфонов.
Зачем это нужно: На десктопе фото спикера или товара выглядит отлично, а на мобильном экран обрезает всё, оставляя пустой фон или плечо. Теряется визуальный контекст и авторитет страницы.
Как сделать в Tilda: В настройках фонового изображения блока (раздел «Контент») использовать инструмент Focal Point (ручное управление точкой фокуса). Сместить маркер на самый важный объект (лицо, продукт), чтобы Tilda центрировала мобильный кроп именно по нему.
3. Индикатор скролла и якорные ссылки
Что проверить: Плавность перехода по якорным ссылкам меню и их поведение на мобильных устройствах.
Зачем это нужно: Если на сайте используется фиксированная плашка меню (Sticky Menu), при клике на якорь верхняя часть целевого блока может уйти под меню. Клиент не увидит заголовок.
Как сделать в Tilda: Использовать стандартный блок плавного скролла (T178). Если меню перекрывает контент, настроить отступ сверху (в пикселях) в параметрах якорных ссылок меню, чтобы учесть высоту фиксированной шапки.
4. Читаемость типографики и «висячие» предлоги
Что проверить: Отсутствие предлогов (в, на, с, под, от) и союзов, оторванных от своих существительных на стыке строк. Контраст текста относительно фона.
Зачем это нужно: Оторванные предлоги ломают ритм чтения. Сайт выглядит небрежно, падает индекс профессионализма компании в глазах требовательного клиента.
Как сделать в Tilda: Принудительно связывать предлоги со следующими за ними словами с помощью неразрывного пробела — кода в текстовом редакторе или используя авто-исправление текста в типографе Tilda.
5. Анимация (Step-by-Step и ИИ-модули)
Что проверить: Скорость воспроизведения и плавность пошаговой анимации на Mac, Windows и, главное, на среднебюджетных Android-смартфонах. Если использовались интерактивные модули Vibe Blocks с ИИ-генерацией кода — протестировать их на логические циклы.
Зачем это нужно: Сложная анимация, которая "летает" на вашем рабочем iMac, способна намертво повесить браузер на телефоне клиента. Итог — моментальный уход с сайта.
Как сделать в Tilda: В настройках пошаговой анимации Zero Block оптимизировать количество одновременно движущихся элементов. При необходимости отключить тяжелую анимацию для мобильных разрешений (выставить Оff для брейкпоинтов меньше 980px).
🔧 Блок 2: Техническое SEO и Надежность
6. Настройка тегов H1, H2, H3
Что проверить: Иерархию заголовков на каждой странице. Специфику разметки в текстовых блоках.
Зачем это нужно: Роботы Яндекса и Google оценивают структуру страницы по тегам. Если на странице три тега H1 или их нет вовсе (всё сверстано обычным текстом с увеличенным шрифтом), сайт улетит на дно поисковой выдачи.
Как сделать в Tilda: Для каждого главного заголовка страницы в настройках блока принудительно задать тег <h1>. Для подзаголовков — <h2> и <h3>. Строго соблюдать правило: один тег H1 на одну страницу.
7. Альтернативные теги (Alt) для изображений
Что проверить: Наличие заполненных описаний ко всем смысловым картинкам, графикам и фотографиям товаров.
Зачем это нужно: Дополнительный органический трафик из Google Картинок и Яндекс Изображений. Кроме того, это важный параметр доступности сайта (accessibility).
Как сделать в Tilda: Зайти в «Контент» блока, открыть карточку изображения и в поле Alt-текст для SEO кратко прописать, что изображено на фото, используя ключевые слова (без фанатизма и спама).
8. Файлы robots.txt и sitemap.xml
Что проверить: Корректность автоматической генерации служебных файлов поисковых систем.
Зачем это нужно: Если файлы не настроены или закрыты от индексации, поисковые роботы не смогут внести страницы сайта в свою базу. Сайт будет невидим в сети.
Как сделать в Tilda: Tilda генерирует эти файлы автоматически. Вам нужно зайти в Настройки сайта -> SEO, проверить, что сайт открыт для индексации, и перепроверить адрес карты сайта, чтобы затем добавить его в Яндекс Вебмастер и Google Search Console.
9. Канонические ссылки (Canonical) и HTTPS
Что проверить: Наличие SSL-сертификата и отсутствие дублей страниц по протоколам http:// и адресам с www.
Зачем это нужно: Поисковики штрафуют сайты за дублирование контента. Без HTTPS-соединения современные браузеры будут пугать пользователей плашкой «Сайт незащищен», срезая конверсию до нуля.
Как сделать в Tilda: Подключить бесплатный SSL-сертификат в Настройки сайта -> SEO -> Настройка HTTPS. Там же активировать редирект с HTTP на HTTPS и включить автоматическую генерацию канонических ссылок (rel="canonical"), чтобы склеить возможные дубли страниц.
10. Человекопонятные URL (ЧПУ)
Что проверить: Адреса страниц, включая статьи в Потоках (Feeds) и карточки товаров в новом e-commerce блоке ST340.
Зачем это нужно: Ссылки вида u11.ru/page123456.html не вызывают доверия у пользователей и плохо ранжируются. Ссылка u11.ru/blog/tilda-checklist понятна и людям, и роботам.
Как сделать в Tilda: В настройках каждой страницы в поле Адрес страницы прописать латиницей осмысленный URL. Для Потоков и каталога товаров ST340 настроить генерацию ЧПУ по заголовку (раздел «Настройки каталога»).
💼 Блок 3: Конверсия, Формы и Интеграции
11. Интеграция с CRM и резервными каналами
Что проверить: Фиксацию тестовых лидов во всех подключенных сервисах (Tilda CRM, Telegram-боты, почта, Битрикс24 / amoCRM).
Зачем это нужно: Если отвалится одна система (например, упадет сервер внешней CRM), данные не должны потеряться. Вы обязаны гарантировать клиенту сохранность каждого лида.
Как сделать в Tilda: Настроить отправку данных из форм минимум в два независимых источника. Обязательно оставлять включенной встроенную Tilda CRM как надежное внутреннее хранилище, откуда лиды можно выгрузить вручную в любой момент.
12. Маски для полей ввода (Валидация телефонов)
Что проверить: Невозможность отправить форму с некорректным или неполным номером телефона.
Зачем это нужно: Избавить отдел продаж клиента от мучений с лидами вроде +7 (999) 111-11-1... (забыл дописать цифру) или текстовых шуток от скучающих пользователей вроде «авыаыва».
Как сделать в Tilda: В настройках полей формы для поля «Телефон» выбрать тип «Номер телефона» и активировать Маску с автоматическим определением страны или жесткую маску той страны, на которую настроена реклама.
13. Страница «Спасибо» (Thank You Page)
Что проверить: Перенаправление пользователя на отдельную страницу после успешной отправки формы, вместо вывода стандартного поп-апа «Спасибо, заявка принята».
Зачем это нужно: На отдельную страницу гораздо проще и надежнее вешать пиксели отслеживания рекламы (Яндекс Директ, VK Реклама). Это гарантирует чистоту сквозной аналитики без ложных срабатываний кода.
Как сделать в Tilda: Создать скрытую от меню страницу (например, /thankyou). В настройках каждого блока с формой в разделе «Контент» -> «Дополнительно» в поле Адрес страницы в случае успеха вставить URL этой страницы.
14. Скрипты аналитики (Яндекс Метрика / GA4)
Что проверить: Корректность фиксации визитов и кликов. Отсутствие дублирования кодов счетчиков.
Зачем это нужно: Без аналитики маркетинг слеп. Если код установлен криво, вы получите некорректный показатель отказов (Bounce Rate) и неверные данные по путям пользователей.
Как сделать в Tilda: Подключать счетчики строго через штатный раздел Настройки сайта -> Аналитика (вставив только ID счетчика Метрики или Google Analytics). Не нужно пихать полные JS-скрипты в блоки T123 в подвале сайта — это может вызвать двойной учет просмотров.
15. Защита от спама (Капча)
Что проверить: Наличие невидимой защиты от спам-ботов на всех формах сайта.
Зачем это нужно: Без защиты формы сайта за первые же сутки будут забиты автоматическим спамом с рекламой сомнительных услуг. Отдел продаж проклянет этот сайт.
Как сделать в Tilda: Подключить в Настройки сайта -> Формы сервис Google reCAPTCHA v3 или внутреннюю невидимую капчу Tilda. Она анализирует поведение пользователя на странице и отсекает ботов, не раздражая реальных людей разгадыванием картинок со светофорами.
🚀 Блок 4: Скорость и Оптимизация (PageSpeed)
16. Автоконвертация изображений в WebP
Что проверить: Реальный формат графики на опубликованном сайте через инспектор кода.
Зачем это нужно: Скорость загрузки сайта напрямую влияет на конверсию и позиции в SEO. Картинки — главный враг скорости.
Как сделать в Tilda: Убедиться, что в Настройки сайта -> Дополнительно включена функция Lazy Load и оптимизация изображений. Tilda сама сжимает исходные PNG и JPEG в современный формат WebP. Ваша задача — не загружать в Zero Block исходники весом более 1-2 МБ; предварительно прогоняйте их через компрессоры (например, TinyPNG).
17. Оптимизация шрифтовых начертаний
Что проверить: Список подключенных весов шрифта (Light, Regular, Medium, Bold, Black).
Зачем это нужно: Каждое начертание шрифта — это отдельный файл весом до 100-200 Кб, который браузер должен скачать перед рендерингом страницы. Подключение всей линейки ради одного слова жирным шрифтом «роняет» показатели Google PageSpeed в красную зону.
Как сделать в Tilda: В Настройки сайта -> Шрифты и Цвета подключать только те веса, которые реально используются в дизайне (обычно достаточно Regular и Bold). Все неиспользуемые галочки — убрать.
18. Минификация и ленивая загрузка (Lazy Load)
Что проверить: Активацию системных оптимизаторов кода Tilda.
Зачем это нужно: Позволяет отдавать браузеру пользователя контент порционно — сначала то, что находится на первом экране, а нижние блоки подгружать по мере скролла.
Как сделать в Tilda: Проверить чекбоксы в самом низу раздела Настройки сайта -> Дополнительно. Пункты «Оптимизация кода (минификация CSS и JS)» и «Использовать отложенную загрузку изображений (Lazy Load)» должны быть включены по умолчанию.
19. Фавиконки под все типы устройств
Что проверить: Отображение иконки сайта во вкладках десктопных браузеров, на смартфонах и при сохранении закладки на рабочий стол iOS/Android.
Зачем это нужно: Сайт без фавиконки в поисковой выдаче выглядит серым безликим куском текста. Пользователи реже кликают по таким сниппетам.
Как сделать в Tilda: Загрузить иконки в разделе Настройки сайта -> Быстрые ссылки (Favicon). Нужен не только стандартный favicon.ico (32x32), но и тяжелая четкая иконка Apple Touch Icon (152x152 или 180x180) для мобильных девайсов.
20. Аудит кастомного кода (Блоки T123)
Что проверить: Работоспособность сторонних HTML/CSS/JS-скриптов (кастомные виджеты, анимации, нестандартные интеграции).
Зачем это нужно: Забытый незакрытый тег </div> или синтаксическая ошибка в коде внутри блока T123 может полностью "сломать" верстку всех последующих блоков на странице или заблокировать работу форм.
Как сделать в Tilda: Открыть консоль браузера (F12 -> Console) на опубликованном сайте. Там не должно быть критических ошибок (красных строк), связанных с вашими кастомными скриптами. Весь сторонний код должен быть снабжен комментариями разработчика, чтобы в будущем проект можно было легко масштабировать.
📜 Блок 5: Коммерческий блок и Информационная гигиена
21. Кастомная Страница 404
Что проверить: Внешний вид страницы при вводе несуществующего адреса сайта (например, u11.ru/ololo).
Зачем это нужно: Стандартная серверная заглушка пугает пользователя. Он думает, что сайт сломался, и закрывает вкладку. Грамотная 404 страница удерживает внимание.
Как сделать в Tilda: Создать отдельную страницу в фирменном стиле компании, написать понятный текст (например, «Упс, этой страницы больше нет, но у нас есть много полезного на главной») и обязательно вывести ссылки на основные разделы сайта. Затем назначить её главной ошибкой в Настройки сайта -> Ограничения -> Страница 404.
22. Политика конфиденциальности (ФЗ-152 / GDPR)
Что проверить: Наличие юридических документов и чекбоксов согласия под каждой формой сбора персональных данных.
Зачем это нужно: Защита клиента от крупных штрафов со стороны контролирующих органов за незаконный сбор персональных данных (имен, телефонов, почт).
Как сделать в Tilda: Разместить текст политики на отдельной странице. В настройках форм активировать галочку «Выводить текст о согласии с политикой конфиденциальности под формой» и прикрепить ссылку на этот документ. При необходимости — настроить встроенный в Tilda баннер согласия на сбор файлов Cookies.
23. Кликабельность контактов и протоколы ссылок
Что проверить: Реакцию интерфейса на нажатие по номеру телефона, адресу почты или кнопкам мессенджеров.
Зачем это нужно: Мобильный пользователь должен позвонить в компанию в один клик. Переписывать номер телефона на листочек, чтобы набрать его вручную — это убийство конверсии.
Как сделать в Tilda: Для всех номеров телефонов прописать ссылку вида tel:+79991112233 (без пробелов и дефисов). Для почты — mailto:info@u11.ru. Для Telegram — прямую ссылку [https://t.me/username](https://t.me/username).
24. Комплексная проверка E-commerce (Блок ST340)
Что проверить: Корректность работы корзины, калькуляцию скидок, применение промокодов, работу фильтров по характеристикам и прохождение тестового платежа.
Зачем это нужно: Если в корзине неверно считается итоговая сумма или платежный шлюз (ЮKassa, Робокасса) выдает ошибку при попытке оплаты, бизнес мгновенно теряет прямую прибыль.
Как сделать в Tilda: В настройках платежной системы перевести шлюз в «Тестовый режим». Пройти весь путь реального покупателя: положить товар из каталога ST340 в корзину, ввести тестовые данные карты, убедиться, что заказ зафиксировался в CRM, а клиенту ушло автоматическое письмо-подтверждение. После этого не забыть вернуть шлюз в рабочий режим.
25. Личный кабинет и права доступа (Members Area)
Что проверить: Систему регистрации пользователей и разграничение прав доступа к закрытым страницам (актуально для инфобизнеса, закрытых клубов или b2b-порталов).
Зачем это нужно: Исключить утечку платного или конфиденциального контента в открытый доступ. Проверить юзабилити писем для восстановления паролей.
Как сделать в Tilda: Через раздел «Личный кабинет» проверить корректность работы групп пользователей. Попробовать зайти на защищенную страницу по прямой ссылке без авторизации — система должна жестко перенаправлять на форму входа.
Резюме эксперта
Разница между сайтом за 20 000 рублей у начинающего no-code мастера и проектом за 200 000+ рублей в профессиональной студии кроется именно здесь — в невидимой, но титанической работе под капотом.
Красивую картинку сегодня умеет генерировать даже базовая нейросеть за секунды. Но заставить эту картинку быстро загружаться, идеально адаптироваться под любые экраны, правильно считываться роботами Яндекса и без сбоев передавать лиды в CRM-систему — это задача, требующая строгой инженерной дисциплины.
Используйте этот чек-лист перед каждым релизом. Он экономит рекламные бюджеты клиентов и бережет Вашу профессиональную репутацию.