Как разработать структуру сайта с помощью Sitemapping

  1. Притворись, что ты домостроитель на мгновение. Вы бы открыли новый дом, в котором не было утвержденных...
  2. Как спланировать и создать структуру сайта с картой сайта
  3. Шаг № 1 - подготовка к работе с картами сайта
  4. Вам может понравиться это видео
  5. Шаг № 2 - Мозговой штурм типов контента
  6. Шаг № 3 - Определить первичную навигацию
  7. Шаг № 4 - Уточнение структуры и содержания второго / третьего уровня
  8. Шаг № 5 - Не забывайте про служебные страницы
  9. Шаг № 6 - Создание заметок и высокоуровневых спецификаций для каждой страницы
  10. Шаг № 7 - Определите тип шаблона оформления
  11. Последний шаг - итерация. Итерация. Итерация.
  12. Инструменты Sitemapping
  13. Помните, что активность над инструментом
  14. Вам также может понравиться

Притворись, что ты домостроитель на мгновение.

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

(Если вы сказали «да», пожалуйста, придерживайтесь своей дневной работы!)

Аналогично тому, как планы этажей отражают структуру дома , карта сайта отображает структуру сайта.

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

Что такое карта сайта и зачем она нужна?

Карта сайта - это визуальный процесс определения структуры сайта, функциональности высокого уровня и схемы навигации. Конечный результат может быть эскизом, изображением, PDF или представленным в виде инструмента SlickPlan (мой полный список инструментов картирования сайта внизу).

Карта сайта должна быть определена на ранней стадии процесса планирования сайта. Этому шагу должен предшествовать лишь небольшой набор действий (например, бизнес-задачи, исследование пользователей).

Пример карты сайта ProtoFuse.com. Цвета используются для представления различных уровней навигации (например, синий = основная навигация)

Карта сайта является критически важной фазой в структуре веб-сайта, поскольку она представляет собой важный результат информационной архитектуры (IA) - основы для пять компетенций дизайна пользовательского опыта ,

Насколько критично? Ну плохая информационная архитектура вызывает большинство сбоев пользователей ,

Ну плохая информационная архитектура   вызывает большинство сбоев пользователей   ,

Карта сайта - это информационная архитектура.

Как спланировать и создать структуру сайта с картой сайта

Вот обзор:

  1. Подготовьтесь к деятельности по созданию сайтов
  2. Мозговой штурм типы контента
  3. Определить первичную навигацию
  4. Раскройте структуру и содержание второго и третьего уровней
  5. Не забывайте про служебные страницы
  6. Создавайте заметки и спецификации высокого уровня для каждой страницы
  7. Назначьте тип шаблона оформления
  8. Итерация. Итерация. Итерация.

Теперь давайте разберем каждый шаг.

Шаг № 1 - подготовка к работе с картами сайта

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

  1. Время - Сильная карта сайта не разработана за 20 минут. Есть ли у вашей организации необходимое время для совместной работы?
  2. Люди - ключевые заинтересованные стороны должны внести свой вклад в дизайн карты сайта. Кто эти люди? Они правильные люди?
  3. Исследования - Каковы цели сайта? Кто наши пользователи? Какая информация им нужна? Что говорит нам наша аналитика?

ПОЛЕЗНЫЙ СОВЕТ: не думайте, что отдел маркетинга и продаж знает все - задействуйте различные отделы. Разнообразие знаний о компании, отрасли, сфере услуг и продукции будет полезным.

Вам может понравиться это видео

Основатель Slickplan - Видеоинтервью с Яном Лоусоном

Мы взяли интервью у Иана Лоусона, основателя и менеджера по продукту Slickplan, супер-интуитивно понятного инструмента для создания карт сайтов для планирования сайтов.

Шаг № 2 - Мозговой штурм типов контента

Прежде чем вы начнете определять элементы навигации (Шаг № 3), вам нужно обсудить содержание вашего сайта. Какие услуги / продукты мы продаем? Сколько информации о компании будет представлено? У нас есть отзывы? Какие полезные ресурсы мы можем предоставить?

Пока не сосредотачивайтесь на том, куда этот контент попадает в карту сайта (Шаг № 4). Дайте себе свободу мыслить открыто - даже дико! Плохие идеи контента со временем, естественно, сработают.

ПОЛЕЗНЫЙ СОВЕТ: Следуйте 80/20 правило содержания (80% ценного контента / 20% продвижения)

Шаг № 3 - Определить первичную навигацию

Основная навигация SafePlumbing.org включает в себя 8 лаконичных элементов в диапазоне от одного до четырех слов.

Также называемые «1-й уровень», «Основной», «Верхний уровень» или «Глобальный», основная навигация обычно находится в верхней части веб-сайта в горизонтальном дизайне. Хотя есть дело против вертикальной навигации некоторые сайты по-прежнему используют этот подход (например, Amazon).

Основная навигация по вашей карте сайта должна ...

  1. Будьте краткими - каждый элемент должен быть нацелен от 1 до 5 слов («О нас», «Свяжитесь с нами»), а не на полные предложения
  2. Используйте общий язык - избегайте именования навигации, которые имеют смысл только внутри. Используйте принцип ПОЦЕЛУЯ (Keep It Simple Stupid)
  3. Сообщите иерархию сверху вниз - может ли кто-нибудь легко просмотреть или найти информацию?
  4. Позвольте сайту расти - ваша первичная навигация не должна пересматриваться каждый раз, когда вы добавляете новый контент или функции

ПОЛЕЗНЫЙ СОВЕТ: Нет магического числа для того, сколько элементов живет в вашей основной навигации. Даже если 7 предметов или меньше - миф о UX все еще важно практиковать краткость. Если ваш дизайн карты сайта содержит более 10 элементов, возможно, есть возможность объединиться.

Шаг № 4 - Уточнение структуры и содержания второго / третьего уровня

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

Для большинства веб-сайтов объемом менее 50 страниц достаточно второго уровня структуры. Для более крупных сайтов, как правило, необходим третий уровень, чтобы поддерживать четкую иерархию. Я даже видел, как некоторые сайты углубляются на четыре уровня (это довольно типично для академических сайтов, где есть куча контента).

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

ПОЛЕЗНЫЙ СОВЕТ: По мере того, как вы расширяете страницу за страницей, ваша главная первичная навигация будет проверена. Не бойтесь подстраиваться, так как структура вашего сайта становится видимой.

Шаг № 5 - Не забывайте про служебные страницы

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

ПОЛЕЗНЫЙ СОВЕТ: Свяжитесь с вашим юридическим отделом раньше, чем позже.

Шаг № 6 - Создание заметок и высокоуровневых спецификаций для каждой страницы

«У нас будет просто базовый контент для этой страницы».

Нет нет. НЕТ!

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

Поставьте контент первым, потому что это сердце каждого сайта ,

ПОЛЕЗНЫЙ СОВЕТ: Если вам нужна хорошая отправная точка, приведите количество слов. Короткий и сладкий (до 100 слов) или богатый и сердечный (500+ слов)?

Короткий и сладкий (до 100 слов) или богатый и сердечный (500+ слов)

Документирование заметок и спецификаций для каждой страницы поможет вам сосредоточиться на специфике

Шаг № 7 - Определите тип шаблона оформления

Указание типа дизайна страницы нагревает движок для дизайна пользовательского интерфейса (пользовательского интерфейса)

Является ли эта страница фотогалереей? Форма конвертации? Оглавление? PDF?

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

Ключевым моментом здесь является то, что вы на самом деле не разрабатываете пользовательский интерфейс (UI), вы определяете тип контента . Эта идентификация помогает вести процесс курирования контента и прогревает движок для дизайна пользовательского интерфейса в будущем.

ПОЛЕЗНЫЙ СОВЕТ: Определите шаблон каждой страницы. Если вы еще этого не знаете, пометьте его как "TBD" и сгладьте, как вы повторяете.

Последний шаг - итерация. Итерация. Итерация.

Выберите инструмент картирования сайта с контролем версий

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

Мне нравится создавать новые версии для разных дней мозгового штурма. Новый день = новая версия.

ПОЛЕЗНЫЙ СОВЕТ: Стреляйте с точностью ~ 85% в соответствии со структурой вашего сайта макетирования или каркасные.

Инструменты Sitemapping

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

Вот почему мы перестали использовать Mindjet MindManager, никогда бы не порекомендовал раздутый софт, как Иллюстратор и влюбился в SlickPlan ( попробуйте 30-дневную бесплатную пробную версию Slickplan ).

Другие инструменты Sitemap, которые помогут вам спланировать структуру сайта:

Помните, что активность над инструментом

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

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

Какие шаги и инструменты для создания карты сайта вы используете для разработки структуры сайта? Я хотел бы услышать в комментариях ниже!

Вам также может понравиться

Как улучшить ваш сайт за 12 практических способов

Ищете простые для понимания, полезные советы по улучшению вашего сайта? Эти 12 практических способов детализируют больше, чем типичные общие советы, которые вы слышите.

Похожие

Конвергенция колес - что это такое и как это влияет на вождение?
Отсутствие выравнивания колес, к сожалению, является распространенной проблемой. Часто бывает, что водитель неосознанно использует автомобиль с таким дефектом. Чаще всего это вызвано не халатностью, а невежеством. Что такое конвергенция колес и как это влияет на нашу машину? Что такое схождение колес? Проще говоря, это значение, которое определяет положение передних или задних колес относительно
Новый водный закон
... сли проект будет принят в такой редакции, большинство положений Закона вступит в силу 1 января 2018 года. Новые правила должны соответствовать предварительным условиям Водной рамочной директивы, которая позволит использовать, в частности, 3,5 млрд. Евро из европейских фондов. для предотвращения наводнений. Однако, чтобы не потерять субсидии ЕС, Сенат должен принять его как можно скорее, потому что Европейский союз поставил условие, чтобы все государства-члены приняли новые правила
Как определить, какая у вас модель iPad?
Обновление 26.04.19: включены последние номера моделей iPad, а также некоторые дополнительные номера только для Китая. Вы можете подумать, что знаете, какой у вас iPad. Новый. Большая. больше. Один из розового золота. Мини. Но когда вам нужно точно знать , какая у вас модель или, еще лучше, какое поколение, это может стать немного сложнее. Вам не нужно быть гением Apple Store, чтобы понять это, хотя вы должны знать, где искать
Как заказать курьер DPD
... ие услуг дешевого курьера DPD не требует множества действий"> Использование услуг дешевого курьера DPD не требует множества действий. Благодаря онлайн-формам на SzybkiKurier.eu вы можете быстро и качественно отправить посылку, проверить ее где наш груз и найти связаться с офисом обслуживания DPD
Как украсить современный зал?
Хотите знать, как должен выглядеть идеальный зал в семейной квартире? Вы хотите изменить расположение ваших шкафов и полок? Black Red White предлагает, в какую мебель стоит инвестировать и на что обратить особое внимание при обустройстве современного прихожей. Коридор - это первая комната, которую вы видите сразу после пересечения порога дома. Здесь вы приветствуете и прощаетесь со своими гостями. Зал должен выглядеть хорошо и современно,
КАЖДЫЙ ДЕНЬ ТОННА: Как не одурачить в компании?
Иногда, когда мы находимся в общественных местах, нас раздражает поведение других людей . Это раздражает отсутствием культуры и культуры. Каждый из нас хотел бы жить в обществе, которое знает основные принципы хороших манер. Однако, оценивая других людей, мы часто не уделяем большого внимания своему поведению . Возможно, мы не всегда действуем в соответствии с правилами повседневной жизни. Итак, давайте познакомимся с основными правилами хороших
Что означает слово «лазер»?
... силение света за счет вынужденного излучения. Но прежде чем мы начнем говорить о будущем лазеров (привет фазеры ), давайте посмотрим, где все это началось. Его развитие в 1960 году до сих пор считается одним из главных прорывов 20-го века. Знаете ли вы, что основание для лазера было сделано в начале 1950-х годов с MASER; AFOSR поддерживается
29 евро замена аккумулятора: как только на iPhone можно, вот как это работает
Как именно работает замена батареи? У нас есть важная информация для вас. Разработчики Geekbench имеют
Что такое почвенный профиль?
... иль почвы Если бы кто-то мог вырыть массивную траншею (яму), примерно на 50-100 футов вертикально вниз, в землю, вы заметите, что вы бы пробили различные слои почвы. Взгляд на слои с расстояния дает поперечное сечение земли (под поверхностью) и вида почв и камней, из которых она состоит. Это поперечное сечение называется профилем почвы. Профиль состоит из слоев, проходящих параллельно поверхности, называемых горизонтами почвы. Каждый горизонт может немного или
Данные - это новая бизнес-валюта
13,5 млрд. Долл. США - это стоимость глобальных данных в 2017 году, оцененная в отчете «Global Data Market Size», разработанном OnAudience. Аналитики также ожидают быстрого роста рынка в Польше. Спрос на цифровую информацию растет быстрыми темпами. В прошлом году в глобальном масштабе было зафиксировано 40-процентное увеличение расходов на ежегодные данные. И, по оценкам, стоимость рынка данных на конец 2018 года уже достигнет уровня 18,2 миллиарда долларов, - указывает отчет OnAudience,
6 профессиональных типов личности по Голландии
Задумывались ли вы, почему вы выбрали это, а не другое занятие? По образованию, образу действия, характеру, случайности или отсутствию другого занятия? Может быть, вы иногда думаете, если вы были в другой профессии? Или вы только начинаете искать свой карьерный путь? Во всем этом помогут 6 типов профессиональных личностей по мнению Голландии. Я, или социальный тип, говорит: проверь себя 🙂 Психолог и социолог Джон Л. Холланд выделил шесть типов профессиональной личности. Они различаются

Комментарии

Не ошибся ли Джон Барт, когда написал двадцать лет назад, что традиционное чтение достаточно интерактивно, что оно является своеобразным представлением, которое позволяет ему расти?
Не ошибся ли Джон Барт, когда написал двадцать лет назад, что традиционное чтение достаточно интерактивно, что оно является своеобразным представлением, которое позволяет ему расти? Возможно, маргинальный характер этого типа практики доказывает, что Барт, однако, был прав и неправ Лобин, писавший об исчезновении деления на автора и читателя в галактике Энгельбарта. Возможно, огромный успех романа «Девушка онлайн» Зои Сугг - как выяснилось, на самом деле был написан командой, создающей
У тебя темные волосы и глаза, но ты не совсем уверен, что ты тип весенней или осенней красоты?
У тебя темные волосы и глаза, но ты не совсем уверен, что ты тип весенней или осенней красоты? Сделайте легкий тест! Вам нужны серебряные и золотые украшения для этого. Встаньте перед зеркалом и нанесите на лицо сначала золотые, а затем серебряные украшения. Какого цвета ваше лицо сияет и свежее? Если ты зимой с серебром! Цвета, которые идеально подчеркивают красоту
Если бы вы занялись своим интернет-магазином сейчас, что бы вы сделали по-другому?
Если бы вы занялись своим интернет-магазином сейчас, что бы вы сделали по-другому? Прежде всего, я бы начал продвигать его раньше, и я бы также знал, какой путь и чего следует избегать. Вначале я много нащупывал, проверял различные формы продвижения, некоторые с хорошими результатами, другие были пустой тратой денег. Еще один вопрос - я уже знаю, насколько важно интегрироваться со складом или складом и выбрать платформу для магазина, я бы выбрал ту, которая
Мы находим это немного странным, особенно учитывая, что у Moto Z Play есть новый разъем USC типа C - мы считаем, что это здорово, но у кого есть кабель для передачи данных для Type-C?
Мы находим это немного странным, особенно учитывая, что у Moto Z Play есть новый разъем USC типа C - мы считаем, что это здорово, но у кого есть кабель для передачи данных для Type-C?! Это должно быть на самом деле, дорогие люди Lenovo. Но: это в значительной степени единственная критика, все остальное довольно убедительно, как показывает следующий тест. СОДЕРЖАНИЕ 1. Обработка / Валентность 2. Дисплей / операция
Что это значит, что их изменение со временем важнее уровня цен?
Что это значит, что их изменение со временем важнее уровня цен? Имея данные о поведении цены в прошлом, можно попытаться предсказать, как поведет себя временной ряд в будущем. Это лучше всего видно на примере сезонных продуктов, например, когда клубника только что показана, она самая дорогая, а затем постепенно становится дешевле. Конечно, вам также необходимо учитывать погоду и размер урожая. Значит, у вас должна быть хорошая база цен, и тогда это чистая
Если бы я точно знал, почему я гладил кошку в данный момент и почему я сделал это именно так, а не иначе, я бы назвал это прикосновение жестом свободной воли?
Если бы я точно знал, почему я гладил кошку в данный момент и почему я сделал это именно так, а не иначе, я бы назвал это прикосновение жестом свободной воли? Тот факт, что мальчик отказывается от выбора, является синонимом уничтожения мира. Никто День
Итак, как вы можете убедиться, что купленный вами светодиод не заставит субъектов выглядеть так, будто у них грипп?
Итак, как вы можете убедиться, что купленный вами светодиод не заставит субъектов выглядеть так, будто у них грипп? Единственный способ убедиться в этом - протестировать камеру, на которой вы планируете ее использовать. Во-первых, исключите все источники света с общим значением CRI ниже 90, а затем ищите рейтинги R9 в середине и в начале 90-х годов. Числа будут различаться при разных цветовых температурах, поэтому проверьте значения R9 для всех температур, если вы смотрите на переменные цвета
Вы все еще платить за Microsoft Word Да, получить Microsoft Word бесплатно: вот как Да, получить Microsoft Word бесплатно: вот как Не хотите платить за полный опыт Microsoft Word?
Итак, как вы можете убедиться, что купленный вами светодиод не заставит субъектов выглядеть так, будто у них грипп? Единственный способ убедиться в этом - протестировать камеру, на которой вы планируете ее использовать. Во-первых, исключите все источники света с общим значением CRI ниже 90, а затем ищите рейтинги R9 в середине и в начале 90-х годов. Числа будут различаться при разных цветовых температурах, поэтому проверьте значения R9 для всех температур, если вы смотрите на переменные цвета
Вы уже знаете, что это единственный, кого вы нашли любовь всей своей жизни?
Вы уже знаете, что это единственный, кого вы нашли любовь всей своей жизни? Поздравляем! Пора начинать готовимся к свадьбе ! Но ... с чего начать? Очень хороший вопрос Ну что ж ... Свадьба очень важна как для вас, так и для ваших друзей и близких. Вы несете большую ответственность, потому что вы должны заботиться о каждой детали, но не будьте сумасшедшими! Разбирайтесь
Или, может быть, вы хотите проникнуть глубоко внутрь, что вы улыбаетесь и выглядите глупо?
Или, может быть, вы хотите проникнуть глубоко внутрь, что вы улыбаетесь и выглядите глупо? «Секс не самое главное, Боже, за кого я женился!» Хуже всего то, что женщины, безусловно, отказываются от секса, что, к сожалению, показывает, что многие женщины ассоциируются с непривлекательными
Как вы помните это время?
Как вы помните это время? Повар может многому научиться за 6 лет. Станислав Бобовский : Очень хорошо, хотя это было сложно. За это время я работал над шестью контрактами, каждый из которых длился 8-9 месяцев. Это была тяжелая работа, потому что она требовала обслуживания

Вы бы открыли новый дом, в котором не было утвержденных планов?
Ты в порядке с импровизацией в течение следующих нескольких месяцев?
Будет ли ваша команда подрядчиков уверена в конечном результате?
Что такое карта сайта и зачем она нужна?
Есть ли у вашей организации необходимое время для совместной работы?
Кто эти люди?
Они правильные люди?
Кто наши пользователи?
Какая информация им нужна?
Что говорит нам наша аналитика?