Веб-студия Laweb

г.Киев, ул. Драгоманова, 4а

Наши Статьи

Делимся своим опытом и размышлениями.

Навигация: Вы находитесь здесь

НАВИГАЦИЯ

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

17.12.2018
151

Навигация должна показывать не только куда вы можете идти, но и где вы находитесь сейчас. Каждая страница на веб-сайте может быть первой страницей, которую видят посетители вашего веб-сайта, поэтому важно передать достаточно контекста, чтобы люди могли немедленно приступить к достижению своих целей. В мире, где поисковые системы могут оставлять посетителей вашего сайта в любом месте, важно указать, где находятся пользователи в информационном пространстве, чтобы они могли успешно перемещаться оттуда. Даже когда посетители приходят через домашнюю страницу, им может понадобиться ориентация при прохождении сайта.
Сделайте так, чтобы посетители могли быстро определить и веб-сайт, и тему страницы. В сети передача сигналов «вы здесь» часто осуществляется путем изменения внешнего вида панели навигации, значков или меню. Эта навигационная сигнализация подкрепляется хлебными крошками и заголовками. Оформление покупок и процедуры подачи заявок (мастера), как правило, также используют имена шагов и номера.


Типичные механизмы «Вы здесь»

  • логотип и брендинг. Представление логотипа показывает право собственности на контент. Логотипы должны быть связаны с домашней страницей. Другие брендинги, такие как товарные знаки, цветовые палитры и шрифты для подписи, могут использоваться для того, чтобы вызвать признание авторитета организации. Обычно эти усилия сосредоточены в верхнем левом углу веб-сайтов, которые, скорее всего, будут в первую очередь на экране, независимо от размера устройства.
  • изменение навигации: ссылка или графический элемент (вкладка, кнопка, метка и т. Д.), связанные с навигацией, становятся более заметными, когда пользователь выбирает эту тему. Часто это выдающееся положение достигается за счет выделенной окраски или смещения элемента в пространстве или обоих (для лучшей доступности).
  • заголовки: выровненные по левому краю заголовки помогают читателям с левого языка направо быстро сканировать значимые слова. Несколько уровней заголовка могут быть выставлены одновременно, чтобы показать больше информации о контексте и пути.
  • URL: Правильно подобранные, удобочитаемые веб-адреса важны для обмена, доверия, распознавания и отзыва.
  • хлебные крошки: информационная иерархия представлена ​​в связанном пути. Как и в случае с URL-адресами, структура «хлебных крошек» может помочь раскрыть близлежащий контент, но более удобным способом.
  • контекстные подсказки: дата, теги, значки и другие символы и знаки могут использоваться для размещения информации в правильном контексте, как во времени, так и в информационной архитектуре сайта.
  • визуальные изменения дизайна. Цветовая кодировка, изменения в брендинге и другие видимые различия могут сигнализировать об изменении местоположения. Цветовое кодирование (где преобладающий цвет меняется в зависимости от раздела сайта) обычно встречается на сайтах с резко различающимися типами контента. Например, журналы, новостные сайты и многие организации используют изменения цвета и бренда, чтобы различать функции, отделы и семейства продуктов.
  • шаги: шаги проверки или другие последовательные потоки задач обычно обозначаются и нумеруются на индикаторах хода выполнения. Эти индикаторы шага обычно располагаются горизонтально над страницами приложения или отображаются в виде вертикального списка слева. Они показывают как всю последовательность шагов, так и какой шаг вы выполняете сейчас, чтобы помочь правильно установить ожидания.

Тест для эффективной сигнализации местоположения

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


Как проверить эффективность сигнала местоположения

Покажите людям разные страницы на разных уровнях вашего сайта, по одному, без перехода к ним.
Скажите: «Представьте, что вы только что пришли на эту веб-страницу. Где ты на сайте?
Если они дают ответ (правильный или неправильный), спросите: «Как вы можете сказать?»
Если они говорят, что не уверены, спросите: «Что вы ожидаете увидеть здесь, чтобы помочь вам узнать, где вы находитесь?»
Если они все еще не уверены, где они находятся, спросите: «Что бы вы обычно делали, чтобы узнать?»