S-p.su

Антикризисные новости
2 просмотров
Рейтинг статьи
1 звезда2 звезды3 звезды4 звезды5 звезд
Загрузка...

Usability анализ сайта

Анализ юзабилити сайта: что в него входит

Содержание

Что оценивается при анализе юзабилити

Логотип

  • наличие уникального логотипа;
  • наличие ссылки на главную страницу.

Навигация

  • структура разделов меню сайта;

Пример неудачного вертикального меню и удачно сделанного меню (рис.1,2)

Меню (рис. 1) тяжело воспринимается пользователями. Сходные по назначению товарные категории лучше объединять в группы.

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

Информация о ценах

  • доступность прайс-листа;
  • использование на сайте единой валюты.

Поиск по сайту

  • наличие строки поиска по сайту;
  • удобство формы поиска (рис. 3 и 4).

Изображения

  • соблюдение пропорций картинок;
  • правильная цветовая передачи (использование форматов jpg или png; не gif);
  • информативность картинок и соответствие их тематике сайта;
  • подписи к изображениям;
  • удобство навигации по галереям;
  • возможность при необходимости увеличить изображения при нажатии.

Контакты

  • заметность страницы с контактными данными;
  • заметность номеров телефонов и адресов в шапке;
  • наличие схемы проезда;
  • наличие формы отправки сообщения;
  • наличие формы для быстрой связи на всех страницах сайта;
  • наличие информации о часах работы.

Пример неудобного и незаметного раздела «Контакты» (рис. 5);

Вёрстка

  • отображение сайта одинаково и без искажений во всех браузерах.

Пример. В течение нескольких лет посетители сайта, использующие Google Chrome, видели искаженную форму авторизации (Рис. 6).

Социальные сети

  • наличие кнопки «поделиться в социальных сетях»;
  • наличие ссылок на собственные группы в социальных сетях.

Длинные страницы

  • наличие кнопки «вернуться к началу страницы» для всех страниц с большим объёмом текста.
  • названия разделов;
  • иерархия.

Пример. На этом сайте «хлебные крошки» показывают посетителю, в каком разделе сайта он находится в данный момент (рис. 7)

Видимость полезной информации

Пример сайта, в котором из-за большой шапки посетитель видит полезную информацию в нижней половине экрана (рис. 8, 9)

Подача информации

  • разбит ли текст на абзацы;
  • наличие заголовков в статьях;
  • размер шрифта;
  • иллюстрации на сайте;
  • цвет фона и шрифта
Читать еще:  Как узнать позицию сайта по поисковому запросу

Анализ дизайна страниц

Правильное расположение основных элементов на сайте

1. Контент страницы должен соответствовать заголовкам страницы (Title);

2. Контент на странице сайта должен совпадать с информацией в рекламном объявлении, по которому пользователь перешёл на сайт;

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

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

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

5. На сайте обязательно должны присутствовать кнопки социальных сетей, а также кнопки «лайк» и «поделиться».

Юзабилити анализ сайта. 5 важных элементов главной страницы с примерами.

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

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

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

Анализ юзабилити сайта

Любые изменения следует начинать с анализа текущей ситуации.

С чего начать анализ юзабилити сайта?

Для начала определите портрет своей ЦА. Это важно для выбора формата подачи информации. Чем подробнее будет портрет, тем лучше. Вот отличный пример портрета ЦА, который мне как-то прислали:

Портрет покупателя (писался по данным опросов операторов колл-центра, курьеров компании):

“Женщина, 33 года, замужем, один ребенок, в ближайший год-два появится второй (как минимум они будут с мужем стараться). Живет почти на окрайне Москвы (метро войковская) на семью есть одна машина, есть собака. Она русская, православная. Доход на семью около 80-100 т.р.. У нее часто болит спина (после родов особенно) она недовольна своими волосами (они выпадают и секутся), у нее есть проблемы со здоровьем по женской части.Она очень хочет выспаться, хочет секса, хочет быть хорошей женой, матерью и дочкой, хочет чтобы ей завидовали и мечтает переехать в свой дом или большую квартиру. Она боится остаться одна и боится старости, она переживает за детей и мужа и боится остаться без денег, еще она боится растолстеть, остаться без денег и сглаза, когда она делает покупки — она боится что ее обманут. Она позитивная (часто проявляет позитивные эмоции, воспринимает шутки), не скандальная (ей проще уйти, чем доказывать свою правоту), в целом, она не обращает слишком пристального внимания на товар перед покупкой (по крайней мере не лезет вовнутрь), она увлекается рукоделием (или хотя бы ей это интересно), имеет профили в соцсетях и активно ими пользуется. (Особенно после 21-30, после того как укладывает ребенка спать.) Ее часто можно встретить в ТЦ, поликлинике и на детских шоу (например «Фиксики» в Крокусе)”
Читать еще:  Проверить контрагента на сайте налоговой по названию

Сразу становится ясно, в какой форме лучше всего преподнести УТП для данной аудитории, да?

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

Постарайтесь ответить на следующие вопросы:

  • Почему люди приходят к вам на сайт?
  • Что они ожидают найти на нем?
  • И, наконец, что нужно сделать, чтобы им было проще это найти?

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

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

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

Навигационное меню, пример оформления.

  • Расположите корректно следующие 5 элементов на главной странице сайта:

1. Уникальное торговое предложение

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

Как правильно составить и разместить УТП на сайте

2. Обзоры популярных товаров/услуг

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

Так же, эта подборка ориентирована на заботливого потребителя — тип для которого важны отзывы, рейтинг товара, тут отлично работает элемент: «Этот товар здесь не просто так, ведь многие уже купили его!»

Читать еще:  Красное белое официальный сайт аренда помещения

Не заставляйте покупателя думать!

3. Корзина

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

Тут есть всего два правила:

  1. Она должна находиться в правом верхнем углу страницы.
  2. Она должна быть контрастной.

Пример оформления кнопки «корзина» на сайте

4. Контактная информация

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

Что нужно учесть:

  • Не используйте разный цвет и размер шрифта при написании номера.
  • Располагайте контакты в правом верхнем углу экрана.
  • Укажите время для звонка.

Код города указан шрифтом меньшего размера, это затрудняет восприятие

Код города и основной телефон хорошо читаются

5. Поиск по сайту

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

Добавьте поле поиска по сайту для логической персоны!

С помощью этих нехитрых рекомендаций вы сможете влиять на основные KPI главной страницы:

  • Снизится процент отказов
  • Увеличится время проведенное пользователем на сайте
  • Вырастет количество просмотренных страниц

Меняйте сайт, упрощайте навигацию, тестируйте и делитесь результатами в комментариях!

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

Ссылка на основную публикацию
ВсеИнструменты 220 Вольт
Adblock
detector