◷ 3 сентября 2026 23:18
Когда логотип, цвета и базовая айдентика утверждены, возникает приятное ощущение, что сайт почти готов: осталось подобрать шаблон, расставить тексты и открыть доступ посетителям. На практике именно здесь начинается техническая часть проекта. Нужно решить, каким будет сайт, где он будет работать, кто станет им управлять и что потребуется проверить перед публикацией.
Короткий ответ такой: после логотипа стоит последовательно подготовить структуру сайта, домен, платформу, веб-версии графики, мобильный интерфейс, хостинг, HTTPS, почту и резервное копирование, а затем провести технический pre-launch. Если идти именно в таком порядке, меньше вероятность обнаружить перед запуском, что CMS не подходит, домен ещё не настроен, а мобильная шапка приходится переделывать.
CMS разумно выбирать после того, как определены страницы, типы контента и функции первой версии сайта. Лендинг из нескольких экранов, корпоративный сайт с блогом, каталог и интернет-магазин могут выглядеть похоже на макете, но предъявляют совершенно разные требования к системе управления.
Минимальную структуру можно зафиксировать даже без специального софта: Главная → Услуги → О компании → Кейсы → Блог → Контакты. Отдельно стоит выписать то, чего не видно в основном меню: формы, поиск, фильтры, мультиязычность, личный кабинет, интеграции, подписки, оплату, импорт данных.
Затем полезно мысленно перенести проект на полгода вперёд. Кто создаст новую страницу услуги? Сможет ли редактор самостоятельно опубликовать статью? Что произойдёт, если вместо двадцати позиций в каталоге станет тысяча? Можно ли добавить ещё один язык без перестройки половины сайта?
Если ответы на эти вопросы требуют менять архитектуру, платформу начали выбирать слишком рано. Небольшому лендингу может хватить конструктора, сайту с регулярным контентом обычно удобнее полноценная CMS, а индивидуальная разработка имеет смысл там, где стандартные модели действительно не покрывают бизнес-логику. Сначала архитектура, потом движок — для запуска это гораздо практичнее, чем поиск «универсальной CMS на все случаи».
Домен стоит выбрать и зарегистрировать до финальной технической настройки сайта. Поздняя смена адреса затрагивает не только строку браузера: под домен завязываются DNS, корпоративная почта, SSL, аналитика, абсолютные URL, API, cookie и иногда настройки отдельных модулей.
Проверка начинается не со слова «красивый», а с контроля. Нужно понимать, на кого зарегистрирован домен, у кого есть доступ к панели регистратора, где меняются DNS-записи и какие NS-серверы используются. Отдельно выбирается основная версия адреса — с www или без него. Вторая версия должна вести на основную постоянным редиректом, а не открывать ещё одну копию страниц.
Есть и чисто практический момент: название бренда на макете не всегда превращается в удобный адрес. Сложная транслитерация, неоднозначное написание или несколько дефисов хорошо выглядят только до первого телефонного разговора, когда домен приходится диктовать человеку вслух.
Если разработка идёт на временном домене или staging-адресе, перед публикацией стоит составить короткий список миграции: основной URL CMS, canonical, адреса интеграций, аналитика, формы, внутренние ссылки и редиректы. Такой список гораздо надёжнее подхода «перенесём — там посмотрим».
Для веба почти всегда нужен не один файл логотипа, а небольшой комплект: SVG, резервная растровая версия и отдельные иконки favicon. Особенно это важно для длинных горизонтальных логотипов и фирменных знаков, которые в мобильной шапке приходится использовать отдельно от названия.
SVG хорошо масштабируется и обычно подходит для шапки, футера и других элементов интерфейса. Но файл из графического редактора стоит проверить перед публикацией: корректен ли viewBox, нет ли огромного пустого поля вокруг рисунка, правильно ли отображаются прозрачность и цвета, не спрятаны ли внутри тяжёлые растровые объекты.
Растровая версия пригодится там, где SVG использовать неудобно. Загружать исходник шириной в несколько тысяч пикселей «для качества» не нужно, если на странице логотип выводится размером около двухсот пикселей. Для экранов с высокой плотностью пикселей можно подготовить увеличенный вариант, но его размер всё равно должен соответствовать реальному сценарию отображения.
Полный горизонтальный логотип почти никогда не работает во вкладке браузера. Для favicon лучше использовать лаконичный квадратный знак, который сохраняет узнаваемость при сильном уменьшении. Если фирменный стиль такого знака не предусматривает, его лучше подготовить заранее, а не пытаться в последний момент уменьшить весь логотип до размеров иконки.
Проверка простая: открыть сайт на десктопе и смартфоне, посмотреть обычную и компактную шапку, favicon и поведение изображения при масштабировании. Если логотип приходится растягивать CSS, он становится размытым или на мобильном занимает треть первого экрана, веб-комплект ещё не готов.
Платформу нужно оценивать не только по тому, насколько быстро на ней можно собрать красивую главную страницу. Через месяц после запуска кому-то придётся менять цены, добавлять услуги, публиковать статьи, создавать пользователей, обновлять модули и восстанавливать сайт после неудачного изменения.
| Сценарий | Конструктор | CMS | Индивидуальная разработка |
|---|---|---|---|
| Небольшой лендинг | Часто достаточно | Подходит | Обычно избыточно |
| Регулярные публикации | Зависит от платформы | Обычно удобно | Возможно |
| Каталог или магазин | Зависит от возможностей | Часто подходит | Для нестандартной логики |
| Сложные интеграции | Ограниченно | Через модули или API | Максимальная гибкость |
| Самостоятельное редактирование | Обычно просто | Зависит от настройки | Зависит от админ-панели |
Хороший тест платформы — не презентация разработчика, а несколько обычных операций. Создать страницу, поменять фотографию, опубликовать материал, выдать редактору ограниченные права, сделать резервную копию и выгрузить данные. Если каждое действие требует программиста, для сложной системы это может быть оправдано. Для обычного сайта компании — уже повод задать дополнительные вопросы.
Стоит также проверить переносимость проекта. Можно ли получить файлы и базу данных? Есть ли экспорт контента? Насколько сайт привязан к одному сервису? Закрытая экосистема может быть вполне удобной, но такую зависимость лучше понимать до запуска, а не обнаруживать при первой попытке переноса.
Мобильная версия готова не тогда, когда блоки перестали выходить за границы экрана. На смартфоне меняется доступное пространство, порядок элементов, способ навигации и сам сценарий взаимодействия с сайтом. Поэтому адаптивность приходится проверять отдельно.
Одна из первых проблем обычно проявляется в шапке. Длинный логотип занимает слишком много места, рядом не помещаются контакты и кнопка меню, первый экран превращается в техническую панель вместо нормального знакомства с брендом. Здесь часто лучше использовать компактную версию знака или изменить композицию, а не просто уменьшить всё целиком.
Дальше нужно пройти реальные действия пользователя: открыть меню, перейти в раздел, заполнить форму, нажать номер телефона, открыть таблицу, закрыть всплывающее окно. Стоит проверить, не перекрывают ли фиксированные элементы содержимое, видны ли сообщения об ошибках и не появляется ли горизонтальная прокрутка.
Для первичной проверки подходят режим Responsive в Chrome DevTools и несколько ширин около 360, 390, 768 и 1440 пикселей. Но ключевые сценарии лучше повторить хотя бы на одном реальном смартфоне. Эмулятор отлично показывает размеры, но не всегда передаёт поведение экранной клавиатуры, касаний и прокрутки.
Даже полностью готовый интерфейс нельзя считать готовым сайтом, пока не проверены сервер, DNS и HTTPS. На этом этапе и всплывают ситуации, когда CMS требует другую версию PHP, сертификат установлен только для одной версии домена, резервных копий нет, а почта компании ещё не настроена.
Сначала сверяют поддерживаемые версии PHP или другого runtime, тип базы данных, объём диска, лимиты ресурсов, cron, доступ к журналам ошибок, резервным копиям и панели управления. Для растущего проекта полезно заранее понять, можно ли увеличить ресурсы или перенести сайт без полной пересборки окружения.
Провайдера удобнее сравнивать по конкретным операциям: где меняется версия PHP, как выпускается SSL, где находятся backup, доступны ли логи, как управляются DNS-записи и что потребуется при увеличении нагрузки. Для ориентира можно посмотреть, как подобные сервисы и серверные решения организованы на сайте UkrLine, а затем по тем же критериям проверить выбранную для проекта инфраструктуру. Такой подход полезнее сравнения тарифов только по объёму диска и цене.
После выпуска сертификата нужно открыть HTTP-версию сайта и убедиться, что она одним постоянным редиректом ведёт на HTTPS. Аналогично проверяется выбранная версия с www или без www: конечный адрес должен быть один, без цепочки из нескольких промежуточных переходов.
В DevTools Console и Network стоит проверить mixed content. Если страница открывается по HTTPS, но загружает шрифт, картинку или скрипт по обычному HTTP, браузер может блокировать часть ресурсов или показывать предупреждения. Отдельно стоит выяснить, продлевается ли сертификат автоматически.
Если бренд использует адреса вида info@domain, почтовую часть лучше настроить до того, как такие контакты попадут на сайт, визитки и рекламные материалы. Минимальный набор — корректные MX, SPF и DKIM. DMARC можно добавлять следующим этапом, когда уже понятно, какие сервисы легально отправляют письма от имени домена.
Проверку нельзя заканчивать фразой «письмо пришло». Лучше отправить сообщение наружу и обратно, затем посмотреть его заголовки и убедиться, что SPF и DKIM проходят проверку для реальной отправки.
Backup нужен до публикации сайта, потому что первые дни после запуска обычно самые насыщенные изменениями. Правятся формы, плагины, шаблон, аналитика, тексты, DNS и серверные настройки. То, что сайт новый, не делает его менее уязвимым к неудачному обновлению или ошибке администратора.
Полноценная резервная копия должна включать как минимум файлы и базу данных. Важно и то, сколько версий хранится. Одна копия, которая каждый день перезаписывает предыдущую, мало поможет, если проблему заметили через несколько суток.
Три вопроса быстро отделяют рабочую схему резервирования от галочки в панели: когда создан последний backup, где он хранится и как из него восстановить сайт. Если ответ на третий вопрос неизвестен, резервная копия пока не стала планом восстановления.
Для крупных обновлений удобно иметь staging — тестовую копию сайта. На ней можно проверить новую версию CMS, плагин или изменение шаблона до переноса на рабочий проект. Staging не заменяет backup: первая мера уменьшает вероятность ошибки, вторая позволяет откатиться, если ошибка всё-таки произошла.
Перед запуском нужно отдельно проверить три вещи: работают ли пользовательские сценарии, нет ли технических ошибок и открыт ли сайт для поисковых систем. Особенно внимательной проверки требуют проекты, которые разрабатывались на временном домене или были закрыты от индексации через noindex.
Формы проверяют реальной отправкой. Телефонные номера и email — нажатием. Меню и кнопки — переходом на конечную страницу. Для 404 нужно открыть заведомо несуществующий адрес и убедиться, что посетителю показывается понятная страница ошибки, а сервер действительно возвращает HTTP 404, а не 200.
Если сайт переехал со старой структуры URL, проверяются 301-редиректы. Хороший редирект ведёт сразу на конечную страницу. Цепочка из старого URL на промежуточный, а затем ещё на новый адрес работает, но создаёт лишний запрос и усложняет диагностику.
DevTools Network быстро показывает тяжёлые изображения, большое количество запросов и ресурсы, которые дольше всего задерживают страницу. Lighthouse или PageSpeed Insights полезны как диагностический ориентир, но итоговая цифра сама по себе мало объясняет.
Если основной баннер весит несколько мегабайт, шрифты приходят с внешнего сервиса с задержкой или сторонний JavaScript блокирует отрисовку, нужно устранять конкретную причину. Для изображений полезно сверить фактические размеры и формат, для статических ресурсов — работу кеширования и сжатия.
На основных страницах проверяют уникальные title и description, логичный H1, canonical, robots.txt, sitemap.xml и meta robots. Один из самых неприятных сценариев запуска — забытый noindex после разработки: сайт уже открыт пользователям, но поисковым системам всё ещё запрещено индексировать страницы.
В sitemap не должны оставаться технические и временные URL. Canonical должен указывать на рабочую версию страницы. Содержательным изображениям нужен осмысленный alt там, где он действительно описывает изображение, а не механически повторяет ключевую фразу.
| Что проверить | Типичная проблема | Как проверить |
|---|---|---|
| HTTPS | Часть ресурсов загружается по HTTP | Console и Network |
| Формы | Интерфейс сообщает об отправке, но письмо не приходит | Реальная тестовая отправка |
| 404 | Несуществующий URL отдаёт код 200 | Открыть ошибочный адрес и проверить HTTP-код |
| Title и H1 | Дубли между страницами | Проверить HTML ключевых страниц |
| robots.txt | Закрыт нужный раздел сайта | Открыть /robots.txt |
| noindex | Остался после staging | Проверить meta robots и заголовки |
| sitemap.xml | Содержит тестовые URL | Открыть карту и выборочно проверить адреса |
| Редиректы | Несколько переходов вместо одного | Проверить HTTP-коды по цепочке |
| Изображения | Загружаются исходники по несколько мегабайт | Network |
| Мобильная версия | Ломается меню, форма или всплывающее окно | DevTools и реальный смартфон |
Сайт бренда готов к запуску не в тот момент, когда дизайнер утвердил последний экран, а когда дизайн, контент и техническая инфраструктура работают как одна система. После публикации всё равно появятся небольшие правки — это нормальный рабочий процесс. Разница в том, будут ли это косметические изменения или внезапный ремонт DNS, почты, редиректов и резервного копирования уже на работающем проекте.