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

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

Главные требования

Навигация должна соответствовать следующим требованиям:

• Дизайн. Следует отдавать предпочтение традиционным формам и обозначениям иконок. Основные разделы выделяются анимацией, цветом или шрифтом. Навигационные элементы не диссонируют с общим визуальным решением.
• Удобство. Навигация сайта обеспечивает быстрый возврат/переход к другому материалу без потери связи. Она должна быть удобной и не перегруженной лишними элементами.
• Структура. Используется логичная и предсказуемая структура сайта. Не рекомендуется наличие большого количества навигационных слоёв.
• Уровень вложенности. Отслеживается уровень вложенности страниц. Если страница находится близко к главной странице, она будет иметь большой ссылочный вес. Максимальный уровень вложенности — 3.
• Мобильные устройства. Рекомендуется адаптировать навигационные элементы для мобильных устройств.

Основные виды

К основным видам навигации сайта относятся:

1. Языковая. Подходит для мультиязычных ресурсов международных организаций, где посетитель может выбрать родной для себя язык. Можно не создавать идентичные ресурсы на разных языках.
2. Основная. Ссылки ведут на важные разделы сайта и располагаются в меню. Используется малыми проектами с ограниченным количеством страниц.
3. Глобальная. Используются ссылки, заметные с любой страницы сайта.
4. Рекламная. Ссылки ведут на другие проекты или страницы, что облегчает продажу продукции. Может быть реализована в текстовом или в графическом виде.
5. Тематическая. Ссылки ведут на тематические близкие разделы. Подобный тип обычно используется сайтами-новостниками.
6. Контентная. Предусмотрена внутренняя перелинковка страниц с гиперссылками. При нажатии на гиперссылку осуществляется переход на другую страницу/сайт.
7. Географическая. Здесь указывается страна, к которой принадлежит посещаемый раздел. Обычно используется туристическими сайтами. Может совмещаться с контентной навигацией.
8. Поисковая. Метод предполагает введение в поисковую строку слова/фразы, после чего выводятся соответствующие теме материалы. Используется интернет-магазинами и торговыми площадками.

Также выделяют несколько видов визуальной навигации:

• текстовая — осуществляется с помощью текста;
• графическая — используются прорисованные элементы;
• HTML — экономное использование страницы;
• Java и Flash — интерактивное меню с эффектами.

Навигационные элементы

Основными элементами навигации сайта являются:

• Главное меню. Это основной навигационный элемент. Наиболее привычно горизонтальное меню с количеством разделов до 7. Возможно создание раскрывающегося меню с подразделами. Оформляется с учётом общей стилистики сайта.
• Боковое меню. Используется для размещения подразделов. Размещается в левой части страницы. Количество разделов — до 10.
• Иконки. Повышают привлекательность меню. Представлены в виде иконок и значков (лупа, дом, сердечко). Рекомендуется использование привычных для пользователя иконок.
• Карта сайта. Облегчает переход посетителям на ту или иную страницу.
• Текстовые ссылки. Применяются для пояснения информации. Ссылки должны быть заметными в тексте (обычно выделяются цветом).
• Хлебные крошки. Это вспомогательные элементы, расположенные вверху страницы. Они кликабельны и позволяют вернуться назад на несколько шагов.
• Фильтры. Используются в электронной коммерции. Включают в себя категории продуктов, новинки, наличие товара.
• Футер (подвал). Это область в конце страницы, содержащая ссылки на разделы и контакты компании. Футер может контрастировать с остальными элементами ресурса.

Также в качестве элементов системы навигации сайта могут использоваться раздел «О компании», призывы к действию, кнопка для возврата, страница 404.

Размещение ссылок

При размещении ссылок необходимо придерживаться некоторых правил:

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

Нестандартные способы

При создании навигации используются различные нестандартные методики:

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

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

Заключение

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

Проверить сайт