Сначала определим: навигация при редизайне должна решать задачи «находимости» и «соответствия»
При редизайне сайта управление навигацией часто воспринимают как часть дизайна: дизайнер рисует меню, фронтенд-разработчик его реализует — и на этом работа считается завершённой. Однако после запуска проблемы обычно связаны не со стилем, а с двумя вещами: клиенты не могут найти прежний контент в новой навигации, а старые адреса, на которые ссылаются поисковые системы и внешние ресурсы, перестают работать. Поэтому управление навигацией при редизайне следует рассматривать как отдельную задачу. На практике это означает: сначала провести инвентаризацию старой структуры, затем определить новую структуру и, наконец, поочерёдно проверить адреса и точки входа.
Далее шаги описаны в порядке реального продвижения редизайна. Для каждого этапа приведены выполнимые действия и критерии оценки. Примеры в статье являются гипотетическими и служат для иллюстрации методов.
Шаг 1. Составьте таблицу старой навигации и старого контента
Перед редизайном не стоит сразу обсуждать, как будет выглядеть новое меню. Сначала выгрузите текущее состояние. Конкретно: откройте старый сайт, начиная с главной навигации, последовательно переходите по уровням и записывайте в таблицу название каждого раздела, уровень, соответствующий адрес страницы и заголовок страницы. Разделы первого, второго и третьего уровней обозначайте разными столбцами или отступами, чтобы иерархия не потерялась в таблице.
Таблица должна содержать как минимум следующие поля:
- Название раздела (текст, отображаемый на старом сайте)
- Уровень (первый / второй / третий)
- Адрес страницы (старый URL)
- Тип страницы (страница раздела, список статей, отдельная страница, страница с формой и т. д.)
- Актуален ли контент (есть контент / контент устарел / пустой раздел)
- Планируемое действие после редизайна (сохранить / объединить / удалить / добавить)
Критерий оценки прост: если в разделе давно всего одна-две записи или контент явно устарел, на этом редизайне нужно решить, объединить его с другим разделом или удалить, а не переносить в новый сайт как есть. Пустой раздел в навигации, при переходе в который клиент видит пустую страницу, наносит больший ущерб, чем отсутствие одной точки входа.
Помимо внутренней навигации, следует по возможности собрать внешние адреса, ведущие на сайт: например, уже размещённые рекламные ссылки, ссылки на страницах партнёров, адреса из прошлых писем или материалов. Если после редизайна такие адреса перестанут открываться, клиенты сразу решат, что с сайтом что-то не так.
Шаг 2. Определите группировку и названия новой навигации
После инвентаризации можно подумать о том, как разделить новую навигацию. Основой для группировки должен быть путь клиента к информации, а не внутреннее деление компании на отделы. Предположим, компания занимается промышленным оборудованием. Старая навигация была построена по принципу «Продукция / Решения / Новости / О нас». Если при редизайне отдел продаж сообщает, что клиенты часто спрашивают «в каких отраслях вы работаете», можно вынести отраслевые сценарии на первый уровень, а прежний раздел продукции сделать параллельным.
При именовании есть несколько конкретных критериев:
- Названия разделов первого уровня должны быть понятны клиенту с первого взгляда. Избегайте внутренних сокращений, например «производственная линия», «бизнес-единица» — слов, знакомых только сотрудникам.
- Стиль названий на одном уровне должен быть единообразным: не так, чтобы половина была существительными, а половина — глагольными фразами.
- Если два названия близки по смыслу, их нужно либо объединить, либо в названии отразить различие, иначе клиент будет переключаться туда-сюда.
Глубину уровней также следует определить на этом этапе. На корпоративном сайте навигация обычно легче воспринимается, если ограничена двумя уровнями. Три и более уровня подходят для сайтов с действительно большим объёмом контента. Увеличение числа уровней означает, что клиенту требуется больше кликов для достижения целевой страницы. При редизайне стоит оценить, оправданы ли эти затраты.
Шаг 3. Обработайте соответствие старых и новых адресов
После определения новой структуры навигации старые адреса не изменятся автоматически. На этом шаге нужно сопоставить старые URL из таблицы инвентаризации с новой структурой и составить таблицу соответствия, в которой для каждого старого адреса указано, какой странице нового сайта он соответствует.
Соответствие можно разделить на три случая:
- Контент сохранён, расположение не изменилось: старый адрес можно оставить без изменений — минимальные правки.
- Контент сохранён, расположение изменилось: нужно направить старый адрес на новый, чтобы клиенты, переходящие по старым ссылкам, по-прежнему попадали на контент.
- Контент объединён или удалён: нужно решить, направлять ли старый адрес на целевую страницу после объединения или на страницу с пояснением, чтобы клиент не видел стандартную страницу ошибки.
В таблице соответствия рекомендуется сохранить три столбца: старый URL, новый URL, способ обработки. Перед запуском редизайна проверьте каждую строку. Насколько тщательно выполнен этот шаг, напрямую определяет, сколько старых ссылок перестанет работать после редизайна. Что касается конкретной технической реализации перенаправлений — это относится к области технической настройки. Задача операционной команды — чётко подтвердить соответствие и передать техническим специалистам таблицу для исполнения.
Шаг 4. Чек-лист проверки навигации перед запуском
Сделать навигацию — не значит сделать правильно. Перед запуском рекомендуется пройти по следующему порядку действий вручную, а не просто просмотреть настройки в админке:
- Начиная с главной страницы, поочерёдно откройте каждый раздел первого уровня и убедитесь, что все они正常 открываются, нет пустых или ошибочных страниц.
- Внутри каждого раздела первого уровня откройте подразделы второго уровня и убедитесь, что иерархия соответствует настройкам в админке.
- На любой внутренней странице проверьте, что навигация по-прежнему видна и кликабельна, чтобы не было ситуации, когда навигация есть только на главной.
- Поочерёдно перейдите по старым адресам из таблицы соответствия и убедитесь, что все они ведут на ожидаемые страницы, а не на главную или страницу ошибки.
- Повторите тот же путь в мобильной ширине экрана и убедитесь, что выпадающее меню正常 раскрывается и не перекрывает контент.
- Проверьте текст навигации на опечатки и на несоответствие названий разделов фактическому содержанию страниц.
Из этих шести пунктов четвёртый чаще всего пропускают, и именно по нему после редизайна чаще всего поступают замечания от клиентов или партнёров. Рекомендуется выделить как минимум одного человека для проверки старых адресов и ещё одного — для проверки кликов по новой навигации, чтобы избежать пропущенных проблем при самопроверке.
Шаг 5. Постоянная поддержка после запуска
Навигация не остаётся неизменной после запуска. После завершения редизайна в процессе работы постепенно появляются новые разделы, контент в разделах сокращается, меняются направления бизнеса. Рекомендуется включить изменения навигации в регулярный процесс поддержки: при добавлении раздела сразу определять, на каком уровне он находится и не дублирует ли он существующие; при закрытии раздела сразу обрабатывать перенаправление старых адресов, а не просто удалять страницу.
Если у сайта есть несколько языковых версий или отдельные точки входа для мобильных устройств, при изменении навигации нужно проверять их все, чтобы не получилось, что изменён только основной сайт, а другие точки входа по-прежнему ведут на старую структуру. Такие несоответствия обычно обнаруживаются только при реальном использовании клиентами, и затраты на их устранение значительно выше, чем на проверку перед запуском.
Управление навигацией — это, по сути, постоянно поддерживаемый набор соответствий: где находится старый контент, где новая точка входа, по какому пути клиент может дойти. Если привести эти связи в порядок до редизайна, количество доработок после него значительно сократится.
