г. Киев, ул. Сверстюка 11А
+38 (044) 232-40-42
hello@seo2.ua

Разбираем алгоритм построения удобной навигационной структуры сайта в 2018 году

Разбираем алгоритм построения удобной навигационной структуры сайта в 2018 году

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

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

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

Ключевые принципы практичной навигации

Потенциальные покупатели всегда должны понимать:

  • как они оказались в том или ином разделе web-ресурса;
  • где именно они находятся в данный момент;
  • куда они могут отправиться дальше.

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

Разработка навигации: базовые составляющие

Приведенные ниже элементы должны:

  1. находиться в пределах всех страниц портала;
  2. создаваться на основе единого стилистического решения.

Шапка web-проекта

Ее следует визуально отсоединить от остальных компонентов web-документа. Шапка должна содержать в себе:

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

Важно! Не включайте в структуру шапки ссылочный материал на социальные сети.


Основное меню

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

Что должно в нем находиться:

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

Рекомендации по разработке основного меню:

  • старайтесь размещать в нем не более 6-8 ссылок (это поможет аудитории быстро сориентироваться при стартовом ознакомлении с маршрутом передвижения);
  • если нужно продемонстрировать клиентам большее количество ссылок, сформируйте дополнительное меню (с целью оптимизации визуального восприятия поступите так: основное меню расположите в верхней части шапки, вспомогательное – под информацией, о которой мы говорили в первом пункте);
  • учтите, что ссылочный материал на дополнительные страницы можно опубликовать в подвале web-площадки;
  • если в вашем/ваших меню имеются активные элементы, то стоит выделить их при помощи, например, другого цвета.

Внутренняя поисковая строка

Каждый интернет-магазин или информационный web-ресурс должен обладать этим инструментом вовлечения целевой аудитории. Советы по созданию и размещению формы поиска представлены ниже:

  • для того чтобы пользователи сразу смогли ее идентифицировать, отобразите не только значок поиска, но и поле для отправки текстовых запросов;
  • оптимальное место для локализации поискового элемента – шапка web-площадки;
  • при выводе результатов поиска обозначьте их количество;
  • обеспечьте показ релевантных тому или иному запросу поисковых подсказок.

Подвал

Далеко не все владельцы сайтов уделяют внимание заполнению этого информационного блока. И зря. Разъяснения:

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

Что должно присутствовать в нижней секции ресурса?

  1. Ссылки на все его структурные сегменты (просто скопируйте ссылки из заглавного меню + добавьте ссылки на второстепенные страницы; совет: расположите их в виде столбиков, указав при этом принадлежность к определенной логической категории).
  2. Контакты. В подвале лучше поместить развернутый вариант контактных данных (то есть не только телефон, но и адрес, e-mail, реквизиты организации и т. д.).
  3. Ссылочный материал на те социальные сети, которые активно вами используются в рамках расширения целевого потребительского сегмента.

Добавочные навигационные компоненты

К ним относятся:

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

На этом все. Надеемся, что наш материал поможет вам разработать удобную навигацию для сайта в 2018 году. Удачи.


Начал свою карьеру в интернет-маркетинге в 2012 году. Мой фокус - анализ технических аспектов проектов и улучшение их показателей. Я имею сертификаты от Google Analytics и Google AdWords. Верю, что использование эффективных инструментов помогает мне и моим клиентам достигать поставленных целей в интернет-маркетинге. Мой профессионализм подтвержден моим местом в ТОП-фрилансеров на украинской бирже Freelancehunt. Моя работа на фрилансе привела к множеству успешно завершенных проектов и средней оценке 9.83 из 10. Я горжусь своими достижениями и всегда стремлюсь к новым вершинам в своей профессиональной деятельности. Для меня интернет-маркетинг - это не просто работа, это увлекательное исследование возможностей и тенденций в этой области. Я всегда готов поделиться своими знаниями и помочь другим в достижении успеха в интернет-бизнесе.