Как отделу разработки и SEO работать вместе, чтобы создать крутой сайт

Разработка нового сайта — это не просто техническая задача. Это настоящее командное приключение, в котором должны слаженно работать разработчики и специалисты по SEO. Цель — создать сайт, который будет и красивым, и функциональным, и ранжируемым в поисковых системах. Дмитрий Андреев, руководитель группы оптимизаторов в ГК Webit, разбирается в том, как происходит взаимодействие отделов SEO и разработки в рамках одного проекта.

Этап 1: Планирование и подготовка

Взаимодействие SEO-специалиста и разработчиков начинается еще на этапе планирования. Обычно один специалист по SEO курирует проект и участвует во всех этапах работы над сайтом.

Подготовительный этап

1. Анализ конкурентов – изучение успешных сайтов в нише.

2. Аудит текущего сайта – определение структуры, контента, текущей оптимизации и ссылочной массы.

3. Оценка дизайна:

- Если дизайн уже готов — SEO-специалист дает рекомендации по его улучшению.

- Если дизайн создается с нуля — работа начинается с прототипов, которые затем превращаются в макеты с учетом SEO-требований.

4. Совещания с клиентом – участие в обсуждениях требований к новому сайту.

5. Выдача общих рекомендаций – на основе анализа конкурентов и текущего сайта.

Взаимодействие на этапе разработки

Процесс координирует менеджер отдела разработки. Основные шаги:

1. Постановка задачи – объявление старта аналитического этапа.

2. SEO-анализ и подготовка рекомендаций:

- определение идеальной структуры сайта;

- формирование списка ключевых типов страниц;

- выделение главных элементов каталога для меню и разделов;

- оптимизация целевых страниц по направлениям.

3. Формирование финального заключения – перечня страниц, которые должны быть реализованы в первых релизах.

Такой процесс позволяет учесть SEO-аспекты еще на этапе проектирования, что повышает эффективность сайта в поисковых системах с момента запуска.

Разработка рекомендаций

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

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

Пример общих рекомендаций по основным типам страниц

Технические требования

- Добавить коды аналитики (Яндекс.Метрика, Google Analytics).
- Настроить 301-редиректы
- Все внутренние ссылки должны использовать https:// или быть относительными.
- Исключить дублирование страниц из-за изменения порядка параметров в URL.
- Все несуществующие страницы должны отдавать код 404 и иметь оформленную страницу ошибки.
- Исключить дублирование контента внутри сайта и копирование со сторонних ресурсов.
- Внешние ссылки должны закрываться тегами <noindex> и rel="nofollow".
- Заголовки h1-h6 нельзя использовать для оформления меню, логотипов и шаблонных элементов.
- Критически важный текстовый контент не должен зависеть от JavaScript – он должен быть доступен для индексации.
- Добавить sitemap.xml с указанием всех страниц (разрешено разделение на несколько файлов).
- Оптимизировать скорость загрузки сайта (ориентир – «зеленая» зона в PageSpeed Insights).

Рекомендации

- Если в листинге закончились товары, страница должна оставаться доступной – отдавать 200 ОК. Ссылку на пустой листинг можно убирать из меню. 

- На сайте обязательно указать юридическую информацию и банковские реквизиты.

- На сайте обязательна страница «О компании». Страница «О компании» нужна, чтобы познакомить пользователя с историей компании, рассказать о сотрудниках и партнерах.

- На сайте желателен раздел о «лицах компании».

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

- На сайте обязательны детали о гарантиях и возврате товара.

- На сайте желательна информация об акциях и скидках. Следует завести раздел с информацией о текущих и будущих акциях. Выводить блок о них на главной странице и продающих страницах.

- На сайте должны быть ссылки на соцсети. Подкрепите сайт социальными сигналами – на всех страницах сайта должны быть кнопки перехода на актуальные аккаунты в соцсетях и кнопки «Поделиться».

- На сайте желательно добавление онлайн-консультанта.

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

- На сайте желательно добавить функционал обратного звонка.

- Регистрация на сайте должна обеспечивать ценность для пользователя. Не нужно делать форму для галочки.

- Страницы сайта не должны обновляться автоматически, без желания пользователя.

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

- При наличии геолокации должны работать персонализированные функции (цены, варианты доставки). Регион определяется по IP. Пользователи должны иметь возможность менять регион пользователем.

- В случае сбора информации о пользователях, должна существовать политика конфиденциальности.

- У всех товаров должны быть изображения. Еще лучше видео и изображения 360гр. Важно хорошее качество, большой размер и достоверность.

- На сайте обязательно должна быть панель поиска.

- Поиск должен быть доступен на каждой странице сайта, не только на главной.

- Ссылки внутри сайта должны быть легко узнаваемы. Они должны выглядеть интерактивными. Элементы, не являющиеся ссылками, должны выглядеть не кликабельным.

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

Важная задача для SEO-специалиста — постараться сохранить преемственность со старым сайтом. Например, нужно сохранить старые URL-адреса или настроить 301 редиректы, чтобы не потерять трафик. Важно создать логичную структуру страниц, добавить карту сайта, файл robots.txt и другие необходимые элементы.

«Если мы делаем новый сайт, он может быть совершенно другим — у страниц будут другие адреса, каталоги, и все старые страницы перестанут существовать, начнут выдавать ошибки. На месте старого сайта вдруг появился новый. Поэтому поисковику нужно заново все это переиндексировать, обойти. Вся старая статистика, которую он накопил, слетит. Момент переезда на новый сайт проходит болезненно именно для SEO, для его трафика из поиска», — Дмитрий Андреев, SEO-оптимизатор.

Также SEO-специалисты парсят весь старый сайт, чтобы у них был список всех страниц и контент. У каждой страницы есть не только адрес, но и H1, title, description и остальные тексты. Это необходимо, чтобы, когда разработчики создадут новый сайт, SEO-специалисты нашли пересечение между старыми и новыми страницами, а затем перенесли всю оптимизацию. Данные хранятся до того, как зарелизится новый сайт.

Этап 2: Прототипы

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

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

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

Когда дизайнеры завершают работу над прототипами, менеджер проекта или руководитель разработки создает задачу в системе управления проектами (например, Битрикс24), уведомляя SEO-специалистов о необходимости их проверки. Оптимизатор открывает макеты и детально анализирует их. Например, в карточке товара он проверяет наличие заголовка H1, блока с характеристиками для перелинковки, а также соответствие структуры страницы SEO-требованиям. Если что-то отсутствует или реализовано не совсем корректно, специалист отмечает это и прописывает замечания в задаче.

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

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

Этап 3: Проработка дизайнерских макетов

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

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

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

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

Этап 4: Тестирование и отладка

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

Разработанный сайт сначала разворачивается на тестовом домене, который закрыт от индексации. SEO-оптимизатор проверяет, учтены ли все рекомендации, присутствуют ли все запланированные страницы, корректно ли реализована оптимизация.

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

Если URL-адрес страницы изменился, настраивается 301-редирект со старого адреса на новый. Это критически важно, чтобы сохранить позиции сайта в поисковой выдаче и не потерять накопленный вес страниц.

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

Этап 5: Запуск и мониторинг

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

После запуска проводится финальная проверка склейки версий сайта. Это касается не только редиректов со старых URL-адресов на новые, но и внутренних настроек: корректности работы WWW- и без WWW-версий, наличия или отсутствия слэшей в конце URL, использования HTTPS вместо HTTP, правильности настройки пагинации.

Следующий шаг — подача обновленной карты сайта в панели вебмастеров поисковых систем. Это ускоряет процесс переобхода и помогает поисковым роботам быстрее зафиксировать изменения.

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

Конфликты и их решение

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

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

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

Все работы отделов разработки и SEO ведутся не параллельно, а последовательно. Поэтому коллеги чаще всего друг другу не мешают. Но иногда бывает так, что видение прекрасного у дизайнера и у оптимизатора не совпадает.

“Даже если на первый взгляд SEO-оптимизация выглядит как-то неуместно архаично для текущего дизайна, это не значит, что ее не нужно внедрять. Иногда оптимизатор не может визуализировать все макеты, как дизайнер, в силу своих компетенций, но просит добавить какой-то элемент перелинковки, показывая, как это сделано у других. Это не значит, что нужно сделать точь-в-точь как он показывает. Необходимо взять сам смысл этой правки, но визуализировать ее можно как угодно, исходя из текущего дизайна сайта. Не всегда это понимает дизайнер и верстальщик. Все можно модифицировать. В таких вопросах стоит искать общий язык” — отмечает SEO-оптимизатор Дмитрий Андреев.

Роль SEO-оптимизатора в проекте

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

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

На примере кейса оператора цифрового телевидения рассмотрим, как благодаря работе SEO-специалиста при переезде удалось избежать потери трафика.

Сразу после миграции наблюдался всплеск трафика, потом незначительное снижение, связанное с переиндексацией и переучетом. Затем трафик опять пошел в рост и в Яндексе, и в Google. 

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

Еще один кейс продавца алкогольной продукции. В мае клиент переехал на новый сайт. Сразу после переезда, трафик из Яндекса немного снизился, а из Google — существенно просел. 

К концу июня проект подхватил SEO-специалист и прекратил просадку. Сайт вернулся к показателям до переезда. С июля начинается рост.

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

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