Навигация на сайте

Что такое навигация

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

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

Задача навигации — помочь пользователю быстро найти нужный раздел и обеспечить комфортный переход между страницами.

Схематичный интерфейс сайта изображен на мониторе ноутбука и на экране смартфона.

Виды навигации

Основная

К этому виду относятся ссылки на важные разделы сайта, которые размещаются в главном меню.

Глобальная

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

Текстовая

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

Языковая

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

Рекламная

Привлекает клиентов через графические и текстовые ссылки, которые ведут на разделы с рекламой каких-либо услуг или товаров.

Тематическая

Помогает перемещаться по статьям, дополняющим друг друга по смыслу. Здесь размещены ссылки на блоки, близкие по тематике.

Указательная

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

Поисковая

Помогает найти интересующую информацию на сайте или в поисковике. Достаточно ввести слово или фразу и система сама выдаст результат.

Основные элементы удобной навигации

Перечень элементов, которые являются основой качественной навигации. Рекомендуется размещать на каждом сайте.

Логотип компании

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

Интерфейс школы дизайна UPROCK, курсор мыши в виде руки наведен на логотип.

Главное меню

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

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

Интерфейс сайта UPROCK, курсор мыши наведен на главное меню, где 4 вкладки: студия, школа, медиа, контакты.

Окно поиска

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

Интерфейс сайта lamoda, курсор мыши наведен на поисковую строку, расположенную над главным меню.

Подвал сайта или футер

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

Дополнительные элементы

Эти элементы нужны не всегда, но порой являются решающими деталями, благодаря которым сайт становится интереснее и удобнее для посетителей.

Хлебные крошки

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

Термин «Хлебные крошки» произошёл от сказки «Гензель и Гретель», где хлебные крошки указывали персонажам путь.

Боковое меню

В нем размещаются подразделы или категории, которые не вошли в главное меню. Элемент располагается в левой части основной страницы.

Иконки

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

Главное не переборщить и не запутать посетителя — использовать только привычные иконки.

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

URL-адрес страницы

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

Сортировка и фильтры

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

Интерфейс сайта lamoda, курсор наведен на фильтры и сортировку интернет-магазина.

Карта сайта

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

Перелинковка

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

Внутренняя перелинковка — проставление ссылок с одного раздела на другой в рамках одного сайта, внешняя объединяет разные сайты.

Кнопка возврата наверх

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

Полезные рекомендации:

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

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

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

Пункты меню необходимо разместить так, чтобы важные блоки были первыми, а менее значительные — ближе к концу.

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

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

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

Ошибка 404. Страница нужна для того, чтобы у пользователя была возможность вернуться в предыдущий раздел, если он что-то сделал не так: кликнул по некорректной ссылке или совершил неверное действие.

Заключение

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

Особенно важно соответствовать ожиданиям посетителей — не изобретать сложные и неординарные элементы, а максимально упростить существующие.

Чем легче, проще и минималистичнее сайт, тем выше вероятность его продвижения.

Что такое навигация Основные элементы удобной навигации Дополнительные элементы Заключение