Карта сайта перед проектированием - это схема страниц, разделов и связей между ними. Чтобы составить структуру сайта, зафиксируйте цели и аудиторию, соберите страницы из доступных данных, сгруппируйте их по пользовательским задачам и проверьте иерархию. Для работы подойдут таблица, доска или программа для создания карты сайта - выбирайте формат, который удобно обсуждать и обновлять.
Что карта сайта должна прояснить до начала макетов
- Какие задачи решает сайт и для кого он создаётся.
- Какие страницы нужны пользователям и бизнесу.
- Как посетитель перейдёт от раздела к нужной информации или действию.
- Где находятся повторяющиеся страницы, пробелы и спорные элементы.
- Какие требования и пояснения дизайнеру нужны вместе со схемой.
Задайте границы проекта и зафиксируйте цели сайта
Такой подход подходит для нового сайта, крупного обновления или пересмотра навигации. Не обязательно строить карту заново, если нужно изменить одну страницу или исправить локальную ошибку: в этом случае достаточно отметить затронутый участок текущей структуры.
До сбора страниц запишите тип проекта, его аудиторию, основные пользовательские задачи и желаемые действия на сайте. Отдельно обозначьте, что входит в работу: например, весь сайт, только каталог или отдельная посадочная страница.
Проверка границ: команда может коротко объяснить, для кого создаётся сайт и какие части входят в карту. Если ответы расходятся, сначала согласуйте рамки проекта.
Соберите страницы из аналитики, поиска и материалов бизнеса
Подготовьте материалы, которые помогут выявить действующие и потенциальные страницы. Используйте только те данные и доступы, на которые у команды есть разрешение.
- Текущую структуру сайта, список URL и материалы прежних проектов, если они доступны.
- Аналитику посещений и поисковые данные, если настроен доступ.
- Каталог товаров или услуг, документы о направлениях бизнеса и описание процессов.
- Запросы поддержки, частые вопросы клиентов и обратную связь от сотрудников, если их можно использовать.
- Рабочее пространство для схемы: таблицу, онлайн-доску или сервис для диаграмм.
Сервисы для создания карты сайта и инструменты для проектирования структуры сайта выбирайте по задаче: для небольшого проекта может хватить таблицы, а для совместного обсуждения - общей доски. Перед загрузкой данных проверьте правила доступа и не размещайте в общедоступном сервисе конфиденциальную информацию.
Сгруппируйте контент по задачам и намерениям пользователей
Обработайте собранные материалы и превратите их в перечень страниц. Не переносите все найденные URL в будущую структуру автоматически: часть страниц может быть устаревшей, дублирующейся или не отвечать задачам проекта.
-
Составьте общий список кандидатов.
Запишите существующие страницы, необходимые новые материалы и страницы, потребность в которых подтверждают задачи пользователей или бизнеса. -
Сформулируйте назначение каждой страницы.
Для каждого пункта укажите, какую информацию он даёт или какое действие помогает выполнить. Если назначение нельзя объяснить кратко, оставьте страницу на проверку. -
Объедините близкие задачи.
Сгруппируйте страницы, которые помогают пользователю решить одну связанную задачу. Не смешивайте разные намерения только потому, что темы похожи. -
Назначьте рабочие названия группам.
Используйте формулировки, понятные пользователям и команде. Названия разделов можно уточнить позже, но смысл группы должен быть ясен уже на этом этапе. -
Отметьте спорные элементы.
Пометьте страницы, для которых неясны владелец, содержание или необходимость. Решение по ним зафиксируйте отдельно, чтобы сомнительный пункт не выглядел согласованным.
Быстрый режим для небольшого проекта
- Запишите цель сайта, аудиторию и границы проекта.
- Соберите текущие страницы и подтверждённые потребности в новых.
- Для каждой страницы укажите задачу пользователя.
- Сгруппируйте страницы, обозначьте спорные пункты и передайте схему на проверку.
Проверка группировки: человек, не участвовавший в сборе материалов, должен понимать по названию страницы и раздела, какую задачу они решают.
Выстройте иерархию разделов и связи между страницами
Разместите группы в последовательности, которая помогает посетителю ориентироваться: от разделов верхнего уровня к конкретным страницам. Покажите связи между страницами, если переход между ними важен для выполнения задачи.
- Можно ли понять назначение каждого раздела по его названию?
- Находится ли каждая страница в логичном для пользователя месте?
- Понятно ли, как перейти от общего раздела к нужной странице?
- Отмечены ли важные связи между страницами, которые не видны из одной иерархии?
- Не попали ли в один раздел страницы с несовместимыми задачами?
- Можно ли найти ключевые страницы без знания внутренней терминологии команды?
- Обозначены ли страницы, которые требуют отдельного решения по навигации?
Критерий готовности: схему можно прочитать сверху вниз и объяснить путь к важным страницам без устных пояснений автора.
Проверьте карту на пробелы, дубли и лишние уровни
Проведите отдельную проверку перечня и связей. Она помогает найти ошибки, которые не заметны при обсуждении только названий разделов.
- Страницы без задачи. Удалите их из основного варианта или уточните, какую потребность они закрывают.
- Повторяющиеся страницы. Проверьте, не описывают ли два пункта один материал или одну пользовательскую задачу.
- Пропущенные этапы. Посмотрите, хватает ли информации для перехода от первого знакомства к нужному действию.
- Слишком глубокая вложенность. Если страницу трудно обнаружить по схеме, пересмотрите расположение разделов и связи.
- Неясные названия. Замените внутренние сокращения и профессиональный жаргон на понятные формулировки.
- Смешение разных сущностей. Не объединяйте в одной группе страницы с разными задачами только ради компактности карты.
- Непроверенные предположения. Отделите подтверждённые требования от гипотез, которые ещё нужно согласовать.
Проверка результата: у каждого элемента есть назначение, место в структуре и понятный статус - согласован, требует проверки или исключён.
Передайте структуру в проектирование с нужными пометками
Передайте дизайнеру саму карту и пояснения, необходимые для работы. Выберите формат по способу взаимодействия команды:
- Таблица - когда важно быстро сортировать страницы, назначать ответственных и отслеживать статус.
- Схема или онлайн-доска - когда нужно обсуждать иерархию и связи между страницами.
- Специализированный сервис - когда команда уже использует его для совместного проектирования и знает, как поддерживать схему в актуальном состоянии.
В передаваемом файле отметьте рабочие названия, назначение страниц, важные переходы, спорные решения и открытые вопросы. Добавьте версию схемы и дату обновления, чтобы участники не работали с разными вариантами.
Финальная проверка: дизайнер может определить состав страниц, их отношения и вопросы, требующие уточнения, без поиска пояснений в нескольких несвязанных документах.
Разбор сложных решений при построении структуры сайта
Можно ли создать карту сайта онлайн без специального сервиса?
Да. Для небольшой структуры достаточно таблицы или доступной команде онлайн-доски, если в них понятны иерархия, связи и статус решений. Специализированный сервис полезен, когда команда уже работает в нём или требуется поддерживать схему совместно.
Как понять, что отдельной теме нужна своя страница?
Проверьте, решает ли тема самостоятельную задачу и требует ли отдельного содержания. Если это лишь часть ответа на соседней странице, отдельный пункт может усложнить структуру без пользы для пользователя.
Нужно ли включать в карту все страницы существующего сайта?
Зафиксируйте их при аудите, но не переносите автоматически в будущую схему. Для каждой страницы проверьте актуальность, назначение и соответствие целям проекта.
Что делать, если участники команды не согласны с названием раздела?
Сначала согласуйте задачу и содержание группы, затем выбирайте формулировку. До решения оставьте рабочее название и отметьте вопрос как открытый.
Чем карта сайта отличается от пользовательского пути?
Карта показывает страницы, их иерархию и связи. Пользовательский путь описывает последовательность действий человека; его можно использовать для проверки того, хватает ли страниц для выполнения задачи.
Когда структура готова к передаче дизайнеру?
Когда у страниц есть понятные назначения и места в иерархии, важные связи обозначены, а спорные решения и открытые вопросы явно помечены. Детали визуального оформления для этого этапа не требуются.