Навигация на сайте: как ее правильно построить?

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

Что такое навигация по сайту

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

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

Источник: shutterstock.com

Итак, какой должна быть хорошая навигация на сайте? Вот ее основные характеристики:

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

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

• Продуманное визуальное оформление. Элементы навигации должны контрастировать с фоном и основным текстом, но не выбиваться из общего цветового решения веб-ресурса.

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

Виды навигации сайта и типы ее реализации

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

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

Навигация на сайте может быть реализована в 4 формах:

• Текстовая. Ссылки на разделы веб-ресурса или внешние площадки выглядят как простой текст.

• Графическая. При таком оформлении навигация выглядит более привлекательно. Чтобы создать графическую навигацию, используют прорисованные элементы меню и кнопки.

• Навигация по сайту HTML. Разнообразные формы позволяют скрыть обширное меню так, чтобы его было видно, только когда пользователь наводит курсор на корневую папку. Используя такую навигацию, вы экономите много места на странице.

• Java- и flash-технологии. Такое меню можно сделать более интерактивным и при наведении курсора или нажатии на ссылку предусмотреть определенные эффекты. Навигацию этого вида реализовать сложнее всего, но при этом она выглядит эффектнее остальных.

Структура навигации сайта

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

Навигация — карта сайта может быть представлена в следующих формах:

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

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

1. Меню

При разработке навигации основным элементом является меню. Это панель с размещенными на ней ссылками к главным разделам веб-ресурса. Существуют разные виды меню.

Кейс: VT-metall
Узнай как мы снизили стоимость привлечения заявки в 13 раз для металлообрабатывающей компании в Москве
Узнать как

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

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

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



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

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

2. Логотип и прочие пометки главной страницы

Очень часто на логотип фирмы добавляют ссылку к главной странице веб-ресурса. Так, пользователь, нажимая на логотип, сразу переходит на главную. Интернет-аудитория уже привыкла к такому приему. Кроме того, на веб-сайтах часто используют иконку дома для перехода на главную страницу. Реже применяют раздел «Главная» в меню.

Читайте также!

«Структура сайта: схемы, советы по разработке, примеры» Подробнее

3. Раздел «О нас»

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

4. Иконки

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




Источник: shutterstock.com

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

5. Текстовые ссылки

В навигации сайта присутствует еще один элемент — ссылки на страницы, которые встроены в текст.

Существуют некоторые правила оформления гиперссылок:

• ссылки должны быть заметны в тексте. Чаще всего их выделяют цветом и подчеркивают;

• ссылки в активном состоянии, при наведении или нажатии должны быть разных цветов;

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

• ссылку лучше оформлять не как прямой URL, а скрывать ее в текстовом контенте, понятном пользователю.

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

6. Футер

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



Оформляют данный элемент отдельно, и иногда его дизайн выбивается из общего стиля сайта.

7. «Хлебные крошки»

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

8. Призывы к действию

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

9. Оформление заказа / Корзина

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

10. Кнопка для возврата

При скроллинге появляется сложность: как клиенту скорее вернуться в начало страницы и не прокручивать ее по новой? Для устранения этой проблемы предусматривают кнопки возврата. Они выглядят как стрелки в положении «вверх».

Этот прием — идеальное решение для таких площадок, как информационные сайты, длинные лендинги, сайты с бесконечной лентой.

11. Страница 404

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

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

Как сделать удобную навигацию по сайту

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

Шапка

Ее необходимо зрительно отделить от других элементов страницы и включить туда:

• Логотип. Рекомендуем разместить его вверху слева, поскольку это привычно для пользователей.

• Наименование фирмы и небольшое описание деятельности — теглайн (если этой информации нет в логотипе). Также можете указать свое уникальное торговое предложение.

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

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

• Возле номера телефона непременно добавьте график работы, чтобы клиенты знали, когда вам можно позвонить.

• Ссылка на страницу корзины при наличии у вас интернет-магазина.

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

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

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

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

• Каталог товаров или услуг (выпадающий пункт меню).

• Страница о компании.

• Варианты оплаты и доставки (для сайтов электронной коммерции).

• Гарантии и возврат (для сайтов электронной коммерции).

• Портфолио (если есть чем похвастаться).

• Акции и скидки.

• Отзывы (для сайтов услуг).

• Блог (при наличии).

• Контактные данные.

Для каждого сайта перечень свой. Но чтобы информация легко воспринималась, не советуем размещать в меню больше 5–7 ссылок. Если этот показатель превышен, выделите над шапкой второе меню со ссылками на вспомогательные разделы — «сервисное меню». Кроме того, ссылки на дополнительные разделы, к примеру вакансии организации, можно показывать только в футере.

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

Форма поиска

Есть смысл сразу ответить на часто задаваемый вопрос: нужно отразить одну кнопку или показать форму целиком? Рекомендуем разместить поле ввода и кнопку запуска, чтобы избавить посетителя от необходимости выполнять лишние действия. Иногда такие кнопки трудно заметить.

Как визуально должна выглядеть форма поиска?

• Поле ввода. Его длина и высота обязаны быть удобны и позволять вводить поисковый запрос из 2-3 слов. Применяйте крупный размер шрифта, чтобы пользователям был хорошо виден их запрос и, если нужно, они могли бы его подправить.

• Кнопка запуска. Многие владельцы веб-ресурсов ее не предусматривают, и из-за этого посетители не понимают, как запустить поиск. Делайте заметную и удобную для клика кнопку. Вам лучше написать на ней слова «Найти» или «Искать» вместо мелкой и незаметной иконки лупы, на которую трудно навести курсор мышки.

• Выбор раздела поиска. При наличии большого количества разделов лучше предусмотреть возможность выбора, к примеру разделить поиск по каталогу и блогу.

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

Но можно разместить и в других областях веб-ресурса:

Снова отметим, что лучшим местом для размещения формы поиска является шапка, поскольку именно на нее посетитель обращает внимание в первую очередь.

Подвал сайта

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

Подвал должен включать в себя:

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

• Контактные данные. Укажите их более подробно, чем в шапке: добавьте адрес и реквизиты фирмы.

• Ссылки на социальные сети. Здесь они будут кстати.

• Форму заказа обратного звонка (при условии, что вы разместили ее в шапке.)

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

Дополнительные навигационные элементы на сайте

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

• Боковое меню.

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

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

• Хлебные крошки или локальная навигация.

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

Вот по каким правилам их нужно оформлять:

Не добавляйте на сайт ссылки, такие как «Вперед», «Назад», «Обратно в раздел» и т. д., только запутывающие посетителей. Хлебных крошек будет достаточно.

• Фильтрация и сортировка продукции

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

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

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

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

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

• Кнопка отмены фильтров. Сразу скажем, что без кнопки фильтров можно обойтись (если список товаров у вас обновляется автоматически). Но кнопка сброса фильтров должна быть во всех каталогах. Не размещайте кнопки запуска и отмены фильтров близко друг к другу, чтобы посетители меньше ошибались.

Ссылки в главной части веб-страницы

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

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

Вот еще 6 дополнительных рекомендаций:

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

Адреса ссылок должны быть простыми и понятными рядовому посетителю. Весь адрес веб-страницы пишите на латинице.

Создание навигации сайта на WordPress, по сути, не так трудно. Ниже приведена небольшая пошаговая инструкция.

• Настройка меню

Настройте на панели администрирования сайта меню:

Введите все веб-страницы, которые хотите показать в меню. Расположите все элементы в необходимом для себя порядке и обязательно сохраните все отредактированное под именем, выбранным для вашего меню. К примеру, Меню 1.

Далее закрепите все это в настройках темы.

Выберите наше Меню 1 и сохраните настройки.

• Постраничная навигация

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

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

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

• Вывод похожих публикаций

Можно установить еще один плагин — nRelate Related Content, который выводит после каждой публикации подобные статьи. Процесс установки плагина стандартный. После его активации необходимо провести еще несколько настроек. В меню панели администрирования появится отдельный блок — nRelate с двумя вкладками (Dashboard и Related Content). При первом обращении к плагину ему понадобится какое-то время для индексации всех страниц нашего веб-сайта.

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

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

Далее следует установить места размещения похожих публикаций — перед нашим постом или после, а также определить, будут ли показываться названия. Возможно выведение не только названий, но и некоторой части текста. Но, как правило, это уже не нужно. Затем, уже после сохранения всех настроек, под каждой статьей появятся картинки со ссылками на три подобные публикации.

Для реализации этого же функционала можно использовать и другие плагины, к примеру Contextual Related Posts.

• Карта сайта

Чтобы посетителям было удобно, можно выстроить карту сайта. Для этого необходимо использовать плагин Dagon Design Sitemap Generator. Если не удается найти его через админку WordPress, скачайте с официального сайта Dagon Design.

Источник: shutterstock.com

Установите и активируйте плагин, после чего выполните определенные настройки. Зайдите в меню Параметры — XML-Sitemap. Выберите все страницы, рубрики и статьи, которые вы хотели бы видеть на карте своего ресурса. И здесь же можете отказаться от всего, что не хотели бы показывать на карте сайта.

• Кнопка «Наверх»

Еще одна неотъемлемая часть навигации сайта — кнопка «Наверх». Когда пользователь вынужден бесконечно крутить колесо на мышке, чтобы вернуться назад после прочтения длинного материала, вряд ли ему это нравится. Кнопка «Наверх» существенно упростит задачу.

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

Редактировать файлы удобнее всего с помощью Notepad++. Так создается навигация сайта.

Необходимо скопировать и занести эти свойства в файл style.css темы WordPress (устройство темы WordPress). В итоге внизу справа должно появиться стандартное изображение кнопки «Наверх». Вы легко можете адаптировать ее к своему дизайну, изменив значение тех или иных свойств.

1. Глубина

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

2. Flash и Java-Script

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

3. Видимые переходы

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

4. Карта сайта

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




5. Источник: shutterstock.com

   Выделение примененных линков

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

Скачайте полезный документ:

Чек-лист: Как добиваться своих целей в переговорах с клиентами

6. Распознаваемость

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

Вы ведь согласны с тем, что пользователи не ищут общие для всех «Услуги» или раздел «О нас», а потому навигация с такими пунктами никак не поспособствует продвижению сайта в результатах поисковой выдачи? Меню и структуру веб-ресурса нужно оптимизировать для поисковиков, чтобы эти элементы говорили на понятном целевым пользователям языке.

Ошибка № 3. Выпадающее меню

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

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

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

Ошибка № 4. Чрезмерное количество пунктов меню

Иногда даже 7 пунктов — перебор. Пусть их будет меньше — не более 5. Чем меньше вторых по значимости пунктов, тем реже посетители станут обращать на них внимание и тем больше будут смотреть на важные.

Это правило также применимо не только к навигации, но и ко всему содержимому веб-ресурса. Благодаря каждому удаленному элементу остальные становятся более видимыми. Краткая навигация веб-сайта важна и для SEO. Так как пользователи обычно попадают по ссылке на домашнюю страницу, а не на внутренние, именно она наиболее значима для поисковых систем. Если в навигации по сайту слишком много ссылок, главная страница теряет свой авторитет, уступая другим.

Ошибка № 5. Нелогичное размещение пункта меню для оформления заказа

Результаты психологических исследований показали, что запомнить первые и последние пункты в любом списке проще — по сравнению с элементами, расположенными посередине. Это же относится и к пользователям Интернета. В начале списка (эффект первичности) и в конце (эффект новизны) внимание людей максимально сконцентрировано. Именно поэтому размещать важные элементы следует в начале навигации, а второстепенные — по центру.

Автор статьи

Дмитрий Свистунов

Руководитель SEO-отдела и разработки

Последние статьи этого автора:

• Адаптивная верстка сайта: гайд для начинающих
• Анкор ссылки: виды, правила составления, влияние на продвижение
• Белая раскрутка сайта без перехода на темную сторону

Забрать гарантированный подарок

Полезные
материалы
для руководителей

Скачать 3,2 MB