Сайт «ДокАвто»: техосмотр, ОСАГО и ДКП в одном сервисе

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

Клиент и контекст

«ДокАвто» — крупная сеть станций технического осмотра и офисов в Санкт-Петербурге. Помимо техосмотра компания оказывает страховые услуги (ОСАГО, КАСКО) и оформляет договоры купли-продажи автомобилей.

Техосмотр, страхование и ДКП обслуживают разные запросы одной аудитории: автовладельцев, которым нужно быстро и без лишних поездок решить формальности. А сайт должен был работать как единая точка входа для всех трёх направлений.

Задача

• Устаревший сайт. Отсутствие адаптива и современного дизайна отталкивало пользователей, которые ищут услугу с телефона.
• Запись только по звонку. Человек, готовый записаться онлайн, уходил к конкуренту.
• Данные в Excel. Расписание, адреса и услуги станций хранились в таблицах: их нельзя было связать с сайтом.
• Структура не под поиск. Разделы строились исторически, а не под запросы, по которым люди ищут техосмотр и страховку.
• Нет интеграций. Внутренние сервисы компании жили отдельно от сайта.

Как мы подошли к решению

Проект строился по трём принципам, которые заказчик сформулировал на старте: скорость, кастомизация и удобство. Мы добавили четвёртый принцип — SEO-first. Структура разделов проектировалась под поисковый спрос с самого начала, а не переделывалась после запуска.

Перестраивать структуру на работающем сайте — значит терять позиции и переклеивать переадресации. Заложить её правильно на этапе проектирования дешевле в разы.

Дизайн под быстрый сценарий

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

Разработка на WordPress

Сайт собран на WordPress: заказчику нужна была возможность менять контент самостоятельно, без глубоких технических знаний. Адаптивную вёрстку построили на Bootstrap 5, слайдеры собрали на Swiper.js, галереи подключили через Fancybox, для дат взяли DatePicker.

Произвольные поля реализованы через Carbon Fields: адреса станций, режим работы, услуги и цены редактируются как обычный контент. Всё упаковано в Docker: разворачивание и поддержка проекта не зависят от окружения конкретного сервера, версии кода контролируются через Git.

Из Excel — в реляционную базу

Миграция стала отдельной частью проекта. Данные о станциях, услугах и расписании жили в таблицах Excel. Мы перенесли их в реляционную базу данных, связали между собой и вывели управление в админку.

Для загрузки данных из таблиц использовали PhpSpreadsheet, письма с форм отправляет PHPMailer, переменными окружения управляет phpdotenv.

Интеграции

Два направления интеграций:

• Яндекс.Карты. Интерактивная карта показывает станции и офисы, а информация о точке (адрес, режим работы, услуги) открывается в модальном окне прямо на карте.
• Внутренние сервисы компании по REST API. Через API работают запись на техосмотр, получение дубликата диагностической карты и управление категориями, городами и доступным временем.

Оба направления используют REST API как основу взаимодействия клиентской и серверной части: это дало гибкость при доработках и позволило добавлять новые сценарии без переписывания интерфейса.

Метод разработки по блокам

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

По этой же причине в проекте почти не было правок: задачи и требования были сформулированы однозначно, и мы сразу начали работу.

SEO и результат

Оптимизацию закладывали на этапе проектирования структуры: разделы выстраивались под поисковые кластеры автоуслуг. На сайте используется The SEO Framework, настроены метатеги, заголовки, внутренние ссылки и скорость загрузки.

Проект вышел в лидеры рынка Санкт-Петербурга по ключевым кластерам автоуслуг: техосмотр, оформление ДКП и автострахование. Позиции удерживаются и продолжают расти.

Пользовательская часть тоже изменилась: запись на услугу теперь занимает меньше шагов, ближайшая станция находится на карте сразу, а сайт корректно работает на смартфоне, где и ищут техосмотр в момент, когда он понадобился.

Показатели: до и после

Метрики из проекта — «до» и «после», с источником замера. Данные те же, что в кейсе ниже.

Что не сработало

• Данные в Excel не работали. Пока расписание, адреса и услуги жили в таблицах, сайт не мог с ними работать — потребовался перенос в реляционную базу.
• Структура строилась не под спрос. Разделы накапливались исторически; переделывать их на работающем сайте — значит терять позиции и переклеивать переадресации, поэтому структуру заложили заново.
• Запись только по звонку теряла клиентов. Человек, готовый записаться онлайн, уходил к конкуренту.

Что забрали в другие проекты

• Структура под спрос — до запуска. Переделывать её потом дороже: теряются позиции и накопленные адреса.
• Excel — это не база. Пока данные живут в таблицах, сайт не сможет с ними работать: перенос в реляционную базу — отдельная задача.
• Метод блоков. Заказчик видит прогресс раньше, а команда не переделывает поля под уже залитый контент.

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

Как сделать сайт для сети станций техосмотра, чтобы его находили в поиске?

Ключевое — структура. Разделы проектируются под поисковые кластеры (техосмотр, страхование, ДКП, города и районы) ещё до запуска, а не подгоняются после. В проекте «ДокАвто» это дало лидерство по ключевым кластерам автоуслуг в Санкт-Петербурге.

Можно ли записывать на техосмотр прямо на сайте?

Да, через интеграцию с внутренними сервисами компании по REST API: пользователь выбирает станцию на карте, услугу и удобное время, а данные уходят в систему компании. Дополнительно через API работает получение дубликата диагностической карты.

Зачем переносить данные из Excel в базу данных?

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

Проект сделан в рамках услуг «Создание сайтов под ключ» и «SEO-продвижение сайтов».