Юзабилити Главной страницы сайта — Чеклист. Часть 1

Опубликовано 18.09.2017 · в Юзабилити

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

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

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

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

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

Логотип

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

Меню интернет-магазина

2. Интуитивно понятное расположение

  • Если меню содержит до 7 пунктов, оптимальный вариант – горизонтальное в шапке.
  • Если меню содержит более 7 пунктов, нужно разбить его на горизонтальное и вертикальное (левая колонка), либо на два горизонтальных, не мешающих работе друг друга.

3. Доступность информации о работе магазина. Как правило, она содержится в пунктах горизонтального меню: Доставка, Оплата, О компании, Контакты.

4. Доступность каталога товаров. В вертикальном меню содержатся категории товаров и так называемые разделы-мотиваторы: Распродажа, Новинки, Хиты продаж.

5. Простая структура. В оптимальном варианте – одно вложение, также допускается два подуровня.

6. Выделение пункта «Где я сейчас нахожусь». Этот пункт и подпункт меню всегда выделяется.

7. Выделение разделов-мотиваторов. Для увеличения продаж из разделов Распродажа, Новинки, Хиты их размещают перед списком каталога. В противном случае их размещают под списком и выделяют цветом.

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

Поиск

9. Стандартный размер поискового поля. Ширина поисковой строки не менее 30% ширины страницы сайта. Высота строки для поиска в два раза выше высоты применяемого шрифта.

10. Стандартное расположение поиска на странице. Строка поиска всегда располагается в шапке и по мере необходимости может быть продублирована в других блоках.

11. Функциональность поиска

  • Наличие выпадающего окна с подсказками
  • Автоматическое преобразование латинских букв в русские
  • Выделение искомой фразы в выпадающем списке
  • Рекомендуется отображать кроме названия, мини-изображение и цену товара
  • Отображение категорий, соответствующих запросу
  • Рекомендуется выводить до 10 товаров
  • Если ничего не найдено, предложите похожие товары

Баннер на главной

12. Адаптивность баннера. Высота и ширина баннер должна позволять просмотреть его в полном разрешении экрана 75% и более посетителей.

13. Соответствие общему стилю. Цветовые решения и шрифты должны соответствовать общему стилю магазина и его тематике. Не рекомендуется делать большие описания и использоваться яркие красные тона.

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

Витрина

15. Целесообразный выбор товаров для витрины. Отображаемые товары должны соответствовать ожиданиям целевого клиента.

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

17. Соответствие стиля

  • Цветовые решения и шрифты должны соответствовать общему стилю магазина и его тематике.
  • Не рекомендуется делать большие описания.
  • Опишите преимущества товара, его полезность и почему его стоит купить именно здесь.

Блок подписки

18. Цепляющее содержание. Объясните клиенту, что он получит, благодаря подписке.

19. Персонализация. Узнайте, чем интересуется клиент, и настройте рассылку конкретно под его интересы.

20. Мотивация подписаться

  • Бонусы за подписку
  • Укажите количество подписавшихся, чтобы заинтересовать пользователя
  • Гарантируйте безопасность данных

21. Минимизируйте количество полей. Достаточно поля для электронной почты и для имени, чтобы персонализировать рассылку.

Блок преимуществ

18. Лаконичный дизайн. Текст преимущества должен подаваться в максимально сжатой форме (до 40 символов) вместе с соответствующими иконками. Допускается полное отсутствие текста и только наличие подписи.

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

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