Аспекты пользовательского опыта (UX) Питера Морвилла. Используется с разрешения.
“Навигационные ссылки вредны для пользовательского опыта!” - объявляют члены команды дизайна/разработки веб-сайта из компании коллеги, скрестив руки на груди и глядя в глаза, способные растопить несколько айсбергов.
Я признаю, что подобные ситуации сложны, потому что: (A) команда дизайна/разработчиков явно не заинтересована в обсуждении этой темы, и (B) команда дизайна/разработчиков может иметь другое восприятие пользователя опыт (UX), чем у меня.
Я предпочитаю «Соту пользовательского опыта» Питера Морвилля, потому что оно не умаляет важности доступности. Его UX Honeycomb также включает в себя концепцию удовольствия. Желаемый контент также может порадовать пользователей.
Но, как мне кажется, восприятие пользовательского опыта было неправильно истолковано, чтобы исключить элементы, которые очень важны для пользователей. Люди не могут использовать то, чего не могут найти. Желаемый контент также должен быть заслуживающим доверия и заслуживающим доверия. Каждый элемент интерфейса, который не поддерживает последовательную кликабельность (или возможность нажатия), оказывает негативное влияние на доверие.
И это возвращает меня к теме навигационных ссылок. Специалисты по юзабилити и пользовательскому опыту обсуждают их использование уже много лет. Далее следует мой вклад в эту дискуссию.
Что такое навигационные ссылки?
Ссылки «хлебные крошки», или навигационная цепочка, представляют собой набор контекстных ссылок, которые служат помощником в навигации по веб-сайтам. Существует три типа навигационных ссылок:
Навигационные ссылки на основе местоположения
Это текстовое представление структуры веб-сайта. Они помогают посетителям сайта понимать и ориентироваться в иерархии вашего сайта. Навигационная цепочка на основе местоположения должна начинаться со ссылки на домашнюю страницу веб-сайта и заканчиваться текущей страницей. Последний элемент в навигационной цепочке не должен быть ссылкой, на которую можно нажать или нажать.
Рис. 1: Хлебные ссылки на основе местоположения особенно полезны в качестве дополнительной навигации. Они могут сообщать как людям (пользователям), так и технологиям (поисковым системам) о содержании страницы..
Преимущество использования навигационных ссылок на основе местоположения заключается в том, что они стимулируют просмотр и могут снизить показатель отказов страницы. Например, на сайте электронной коммерции пользователи могут попасть на страницу продукта. Продукт может не подходить, и пользователи могут захотеть просмотреть другие продукты (для сравнения или дополнительных покупок). Пользователи могут использовать навигационные ссылки, чтобы беспрепятственно перемещаться по иерархии сайта и просматривать больше вариантов продуктов.
Следовательно, этот тип навигационной навигации поддерживает аспекты удобства использования, поиска, доступности и достоверности пользовательского опыта.
Навигационные ссылки на основе пути
Также известный как «исторический след», он показывает пользователям шаги, которые они предприняли, чтобы попасть на данную страницу. Этот тип навигационной ссылки обычно создается динамически. Как многие уже знают, профессионалы в области юзабилити не рекомендуют их использование по ряду причин:
- Они дублируют функциональность кнопки «Назад» в браузере.
- Они могут сбить с толку пользователей, которые могут перейти не в те разделы веб-сайта.
- След истории бесполезен для пользователей, которые попадают непосредственно на веб-страницу, расположенную глубоко в иерархии веб-сайта, например на страницу продукта. (Например, пользователь может попасть на страницу продукта через Google.)
- Они могут привести к доставке дублированного контента в поисковые системы. Доставка дублированного контента в поисковые системы уменьшает количество страниц, доступных для ранжирования.
Ниже приведен пример навигационных ссылок на основе пути, которые ясно показывают, что пользователь теряется на веб-сайте (примечание: ссылки в следующем навигационном маршруте показаны только для визуального выделения и не являются функциональными).
О нас > Пресса и СМИ > Новости > Домашняя страница сотрудников > Индекс от А до Я > Исследовательские центры > Исследования > Здоровье
Навигационные ссылки на основе атрибутов
Эти навигационные ссылки, которые обычно используются на веб-сайтах электронной торговли, реализующих фасетную классификацию, отображают атрибуты определенного элемента на веб-странице. По данным Лаборатории исследования юзабилити программного обеспечения Университета штата Уичито, навигационные ссылки на основе атрибутов отображают метаинформацию, показывающую множество различных маршрутов, представляющих несколько возможных путей достижения страницы.
Навигационные ссылки на основе атрибутов также могут вызывать проблемы с доставкой дублированного контента в поисковые системы. Чтобы справиться с этим, я настоятельно рекомендую обратиться к квалифицированному специалисту по технической поисковой оптимизации (SEO), который поможет вам рассмотреть различные варианты.
Рис. 2: На одной странице могут появляться как навигационные ссылки, основанные на местоположении, так и атрибуции.
На рисунке 2 обратите внимание, как дизайнер пользовательского интерфейса уделил пристальное внимание форматированию. Возможность щелчка (и/или возможность нажатия) последовательно сообщается и реализуется, а символы используются для различения различных типов хлебных крошек.
Навигационные ссылки на основе местоположения имеют разные цвета посещенных и непосещенных ссылок. Отдельные элементы разделяются знаком «меньше» (<). Текст навигационной навигации на основе атрибуции не доступен для кликов, но его можно удалить из содержимого страницы, щелкнув X на синем фоне. Отдельные элементы атрибуции разделены вертикальной чертой.
Преимущества навигационных ссылок
Я склонен поддерживать либо только навигационные ссылки на основе местоположения, как показано на рисунке 1, либо комбинацию навигационных ссылок на основе местоположения и атрибуции, как показано на рисунке 2. Как специалист по пользовательскому опыту, я реализовать эту контекстную навигацию по нескольким причинам.
1. Хлебные ссылки поддерживают навигацию по сайту
Основная цель навигации по веб-сайту - обеспечить выполнение задач. Навигационные ссылки на основе местоположения поддерживают выполнение задач, предоставляя удобный способ просмотра дополнительных параметров, когда пользователи попадают на веб-страницу, расположенную ниже по иерархии сайта. Другими словами, внедрение навигационных ссылок на основе местоположения часто сокращает количество действий, которые посетитель веб-сайта должен выполнить, чтобы попасть на страницу более высокого уровня.
2. Хлебные крошки поддерживают удобство использования веб-сайта
В своей серии статей «Оптимизация конверсии: измерение юзабилити в пользовательском опыте» (UX) я показал критические аспекты юзабилити веб-сайта. Два из этих важных аспектов:
- Эффективность (выполнение задачи): Могут ли пользователи достичь желаемых целей на вашем сайте?
- Эффективность (быстро и просто): Насколько быстро пользователи смогут достичь своих целей на вашем сайте?
Поддерживая выполнение задач при навигации по веб-сайту, навигационные ссылки на основе местоположения также повышают удобство использования веб-сайта.
Некоторые веб-дизайнеры/разработчики часто используют пути кликов и аналитические данные в качестве доказательства того, что пользователи не используют навигационные ссылки. Однако то, что люди не нажимают на навигационную ссылку, не означает, что они ее не используют.
Я часто провожу тесты на удобство использования каркасов, чтобы определить, эффективна ли система маркировки веб-сайта, учитывая, что пользователи не всегда заходят на веб-сайт через домашнюю страницу. Фактически, один из способов измерить успех SEO веб-сайта - это видеть все меньше и меньше переходов на домашнюю страницу веб-сайта (если только это не навигационный запрос на официальный сайт компании) и все больше и больше переходов на внутренние страницы веб-сайта.
Рисунок 3: Пирамида Инцептора. Целью поисковой оптимизации является увеличение квалифицированного поискового трафика на большинство страниц веб-сайта. Эффективное SEO позволяет пользователям напрямую переходить к желаемому контенту.
Во время юзабилити-тестов производительности я периодически спрашиваю участников теста, какую страницу или контент они просматривают на веб-сайте.
В большинстве случаев участники тестирования определяют заголовок основной страницы и навигационные ссылки на основе местоположения (если они используются) как причины, по которым можно узнать, какую страницу они просматривают. Несмотря на то, что исследования отслеживания взгляда не показывают, что пользователи фокусируются на навигационных ссылках как на вспомогательном средстве навигации, пользователи часто видят навигационные ссылки периферийным зрением, особенно если они расположены рядом с заголовком основной страницы.
Рис. 4: По словам гуру юзабилити Якоба Нильсена и его соавтора Кары Пернис в их книге Eyetracking Web Usability, люди просматривают навигационные ссылки 30% времени.
Помните, число без контекста - это просто число. Я считаю, что тестирование и исследования юзабилити помогают представить аналитические данные в правильном свете. Контент может быть королём, но контекст - королевой.
3. Хлебные ссылки поддерживают поиск контента
Навигационные ссылки на основе местоположения не только поддерживают и поощряют просмотр, но и поддерживают поиск. В течение некоторого времени поисковые системы отображали в результатах поиска навигационные ссылки с привязкой к местоположению, предлагая пользователям множество способов перехода на ваш сайт.
Другими словами, навигационные ссылки на основе местоположения помогают как пользователям, так и поисковым системам понять структуру вашего сайта.
Рис. 5: Хлебные крошки, отображаемые в результатах веб-поиска. В настоящее время в этом списке «Напитки», «Чай» и «Пробоотборники чая» ведут на разные страницы веб-сайта.
Чтобы просмотреть подробную информацию об отображении навигационных ссылок в результатах веб-поиска, см. Расширенные фрагменты кода - Хлебные крошки.
4. Ссылки на хлебные крошки предоставляют информацию Scent
Информационный аромат состоит из текстовых и визуальных подсказок, которые:
- Облегчить навигацию (куда я могу пойти?)
- Разрешить быструю ориентацию (где я?) и
- Сообщайте о ценности контента (стоит ли мне нажать на эту ссылку?)
Если навигационные метки понятны и понятны пользователям, навигационные ссылки на основе местоположения могут обеспечить мощный и заманчивый информационный аромат для большего количества контента на вашем сайте до и после того, как люди перейдут на ваш сайт, как я проиллюстрировал на предыдущих примерах..
На рисунке 5 выше показано несколько вариантов информации в списке веб-поиска, которые пользователи могут просмотреть до того, как они перейдут на ваш сайт. А после того, как люди приедут? Независимо от того, попали ли пользователи на наиболее подходящую страницу продукта, услуги или контента, навигационные ссылки на основе местоположения предоставляют возможность безупречного перемещения вверх по иерархии сайта для просмотра большего количества вариантов. Кроме того, дизайнеры/разработчики веб-сайтов могут сопоставлять текст гиперссылки с заголовком целевой страницы, придавая дополнительный аромат и информативность.
Для тех из вас, кто заинтересован в чтении подробной информации о запахе информации, пожалуйста, прочитайте больше о Питере Пиролли и теории поиска информации.
5. Хлебные крошки Ссылки для обмена контентом О компании
Как я уже упоминал ранее, навигационная цепочка на основе местоположения должна начинаться со ссылки на домашнюю страницу веб-сайта и заканчиваться текущей страницей. Содержание навигационных ссылок должно становиться более конкретным по мере того, как пользователи перемещаются вниз по иерархии сайта.
Все слова в иерархии сайта, включая заголовок страницы, сообщают как пользователям, так и поисковым системам, о чем содержание вашей страницы. Намеренная информация описывает значение документа (например, веб-страницы, PDF-файла, графического изображения или видео) с точки зрения автора.
Другими словами, навигационные ссылки предоставляют дополнительную возможность донести информацию и контекст до людей и поисковых систем. Поисковые системы используют текст и ссылки в навигационной цепочке для определения релевантности.
Подробную информацию о теме можно найти в разделе «Ключевые слова, информация и SEO».
Что можно и чего нельзя делать со ссылками на хлебные крошки
Хлебные крошки
- Начните навигационную цепочку с учетом местоположения со ссылкой на домашнюю страницу. Завершите цепочку навигации текущей страницей.
- Используйте простой разделитель между уровнями навигационных ссылок. Косая черта (/), знак «меньше» (<) или двойной знак «меньше» являются ожидаемыми и приемлемыми.
- Убедитесь, что ваши навигационные ссылки выглядят кликабельными и на них можно щелкнуть. Для мобильных устройств: если вы используете навигационные ссылки на основе местоположения, убедитесь, что ваши навигационные ссылки выглядят доступными и доступны для нажатия.
- Ссылки на хлебные крошки должны размещаться над заголовком веб-страницы в формате h1, чтобы стимулировать использование (для ментальных моделей пользователей и дальнейшего изучения сайта).
Что нельзя делать с хлебными крошками
- Не используйте обратную навигационную ссылку для тега заголовка (X)HTML вашего сайта. Продуманные заголовки должны писать люди, а не программы.
- Не используйте структуру ссылок для структуры вашего URL-адреса. Помните, что URL-адреса должны легко набираться и легко запоминаться.
- Не делайте размер текста навигационной навигации настолько маленьким, чтобы пользователям было трудно его прочитать. Помните, что люди смотрят на хлебные крошки 30% времени. Если пользователи решат, что ваш контент слишком сложен для чтения, они могут не просматривать контент на остальной части вашего сайта.
- Убедитесь, что навигационные ссылки не доминируют на странице. Они не должны быть отформатированы так, чтобы отвлекать посетителей сайта от чтения: (A) заголовка контента и (B) глобальной и локальной навигации.
- Не используйте навигационные ссылки без поддержки глобальной и локальной (если используется) навигации. Ссылки «хлебные крошки» - это дополнительный контекстный тип навигационного средства. Они не должны быть основным средством просмотра веб-сайта.