Требования к навигации сайта

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

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

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

Каждая страница должна содержать:

  • логотип с ссылкой на главную страницу (исключая саму главную страницу);
  • системные иконки в виде пиктограмм: «домик» (ссылка на главную страницу), «лупа» (ссылка на поиск и карту сайта), «почтовый конверт» (ссылка на контактную информацию). Цвет иконки меняется в зависимости от того, является ли текущий раздел активным;
  • возможность выбора языка (украинский, русский, английский).

С любой страницы сайта перейти на главную можно будет несколькими способами:

  • кликнуть на логотип
  • на иконку домика или ссылку в дублирующей навигации.

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

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

Требования к навигации сайта

  1. Логична по структуре и оформлению.
  2. Наличие удобной основной и вспомогательной навигации с одинаковым позиционированием на всех страницах.
  3. Навигация сайта должна в любой момент предоставлять посетителю возможность быстро и безошибочно определить свое местонахождение на сайте и однозначно отвечать на три вопроса: «Где я нахожусь?», «Где я уже был?», «Куда я могу пойти?».
Статья по теме:  Как сделать фиксированный виджет в сайдбаре

Требования к гиперссылкам

  1. Все ссылки выделяются классически: цветом и подчеркиванием.
  2. Текущий пункт меню не должен быть кликабельным, а раздел, в котором он находится наооброт — кликабельным (ссылка с подчеркиванием).
  3. Цвет ссылок должен меняться: цвет неактивной, активной и посещенной ссылок (менее насыщенный цвет чем у активных ссылок, или цвет, более близкий к цвету основного текста и даже фона страницы) должен отличаться друг от друга.
  4. Наведение мышки на ссылку должно вызывать эффект подсветки (цвет должен быть светлее).
  5. Реакция при наведении — меняется цвет; допускается убирать подчеркивание.
  6. Адрес страницы (URL) должен быть по возможности коротким и понятным.
  7. Страницы должны именоваться так, чтобы было легко определить точное содержание этой страницы, без необходимости постоянно проверять, что же действительно содержится на страницах.
  8. Текстовые гиперссылки должны хорошо выделяться на фоне остального текста.
  9. Ссылки — относительные (за исключением внешних): от корневого каталога сайта до текущего документа (например: /ua/about/contacts/).
  10. Гиперссылки вызывающие неожиданные для пользователя действия должны об этом предупреждать, например: ссылки на файлы, ссылки, открывающие или закрывающие окна.
  11. Внешние ссылки, ведущие на другие ресурсы, должны отличаться наличием какого-либо графического значка и открывать новый сайт в новом окне.
  12. Ссылка на всплывающее окно должна сопровождаться соответствующим значком.
  13. Ссылки на различные документы должны четко различаться.
  14. Если ссылка ведет на файл для скачивания, необходимо обязательно указывать его размер.
  15. Ссылки, расположенные в тексте, не должны совпадать с ним по оформлению.
  16. Недопустимо использование циклических ссылок (ссылки, ведущей на ту же страницу, на которой эта ссылка установлена).

Навигация с помощью главного меню

Главное меню имеет многоуровневую иерархическую (вложенную) структуру, которая позволяет пользователю двигаться, как «от общего к частному», так и «от частного к общему».

Статья по теме:  Как подключить Яндекс.Спеллер к WordPress

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

Вспомогательная навигация

Вспомогательня навигация представляет собой путь по сайту от его «корня» до текущей страницы и располагается в верхней части страницы. Имеет следующий вид:

Главная страницаРазделПодраздел → Текущая страница

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

Навигация с помощью гиперссылок

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

Навигация с помощью прямого уникального адреса страницы (URL)

Каждая страница должна иметь постоянный URL, доступный, для индексации поисковыми системами. Динамические ссылки вида www.fortress-design.com/post.php?post=9658 должны быть преобразованы в статические.

Названия каталогов и файлов должны быть информативными, чтобы URL’ы сайта были удобны для пользователя. Помимо получения информации о структуре сайта, URL может использоваться для быстрого перехода к нужной странице. Например, удалив часть адреса до ближайшей косой черты, посетитель всегда должен получить осмысленное и предсказуемое содержимое.


Понравилась статья? Поделиться с друзьями:
Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: