Аудит от независимых экспертов

поможет выявить проблемы на вашем сайте


 

 
 
 

Самые важные галочки юзабилити: краткий чеклист

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

Вначале пункты, применимые практически для всех сайтов.
• Логотип расположен вверху слева.
• Ссылки подчёркнуты, имеют свой цвет (отличающийся от цвета любого другого текста), при наведении указателя мыши он принимает форму руки, а сама ссылка реагирует.
• Цвета шрифтов и фона контрастны.
• Текущий пункт меню всегда выделен, а ссылка не активна.
• Если навигация многоступенчатая (есть разделы, подразделы, субподразделы и т.д.) — используются «хлебные крошки».
• Любая страница имеет не более 3-х «ярких пятен». Яркими пятнами являются любые картинки, баннеры, слишком яркие цвета какой-либо области. Если яркие пятна одного типа размещены подряд (блок для баннеров с несколькими баннерами, картинки друг за другом) — они считаются одним пятном.
• Каждый текст или страница имеет заголовок.
• Элементы, сформированные по одному принципу/принадлежащие к одной категории, оформлены одинаково.
• Текст разделён на абзацы по 5-6 строчек.
• В вертикальном меню пункты не склеиваются между собой, их легко читать. Внедрены способы выделения: текущего раздела, раздела, на который наведён указатель мыши.
• Важные элементы должны быть всегда на виду. Чем важнее элемент — тем он должен быть заметнее. 
 
И пункты в основном для интернет-магазинов.
• Меню основной навигации расположено горизонтально, а меню каталога — вертикально (возможны исключения).
• Указан номер телефона и заметен в первые секунды просмотра (для этого его лучше всего помещать в шапке).
• Любая страница сайта содержит товарное предложение. Особенно актуально для главной: несколько товаров на ней, заметные в первые секунды просмотра, значительно повышают конверсию.
• Блок корзины заметный; на всех страницах находится на одном месте; расположен как можно выше.
• При добавлении товара в корзину по кнопке «купить»/«в корзину» не перекидывает на другую страницу. Но появляется надпись рядом с кнопкой или всплывающее сообщение о добавлении товара в корзину и ссылкой на неё, а сам блок корзины обновляется.
• Страница корзины и оформления заказа не содержит лишней информации — всё внимание максимально концентрируется на покупке.
• Оформление заказа не прерывается, если пользователь не зарегистрирован — для покупки регистрация не нужна вообще.
• УТП видно сразу.
• Кнопка покупки находится внизу, после всех описаний и характеристик товара, выровнена по правому краю. Но можно и продублировать её вверху, где-нибудь рядом с фотографией товара.
• На карточке товара отсутствуют отвлекающие элементы (баннеры, флэш и т.п.)
• Блок товара содержит:
• Название товара.
• Изображение товара.
• Описание товара.
• Цену товара.
• Значки акций и скидок.
• Кнопку добавления в корзину.
• Рекламные тексты завершаются точкой принятия решения (ссылка подробнее/купить/в каталог).
• Важная информация о доставке и гарантии размещена на странице товара.
• Когда большой выбор и/или покупка требует определённых познаний (ситуация аналитического выбора), например, цифровая техника, — в поиске должен присутствовать фильтр характеристик (например, как на сайте eldorado.ru).

Автор: Al.exe-y

 
Голосов: 8
Баллы рейтинга: 39

enyt пишет:
12.03.2011 09:09
Это скорей пункты практически идеального сайта, например если взять пункт из интернет-магазинов: "При добавлении товара в корзину по кнопке «купить»/«в корзину» не перекидывает на другую страницу."-  в протестированных нами сайтов в 40-60% было наоборот, перебрасывало в корзину...
linyli пишет:
12.03.2011 11:18
Это вообще сомнительный пункт: например, если посетитель приобретает крупную бытовую технику или что-то в этом духе, его вполне можно сразу перекидывать в корзину и уже там, перед самым оформлением заказа, предлагать сопутствующие товары.
Alexey пишет:
12.03.2011 18:19
Тут возможны и другие варианты... Да и я думаю это более привычно и правильно, так сказать "морально". И кстати при покупки крупной техники тоже бывают случаи, например, когда купил блок для компьютера - нужен ещё монитор, клавиатура, колонки, мышь.
Но согласен с вами, пункт сомнительный. Но сомнительны и остальные - ведь можно создать такой вариант, в котором уникальный дизайн, и не работают некоторые пункты отсюда. В этом и состоит важное качество хорошего юзабилиста: нужно каждый сайт рассматривать в отдельности и смотреть, что применимо именно для него.
Владимир Шупляков пишет:
07.05.2011 13:58
Я опрашивал около 200 пользователей своего магазина. Практически все из них сказали, что принудительный перброс в корзину воспринимают с раздражением или как насилие над личностью. Не слово в слово конечно, но смысл был таков.
Alexey пишет:
12.03.2011 18:10
Ну дак а нам и нужно стремиться создать из сайта заказчика идеальный сайт ;)
Владимир Шупляков пишет:
07.05.2011 13:55
И это есть жесточайшая ошибка интерфейса. Перекидывать не должно, но вместе с тем, пользователь должен всегда иметь возможность перейти в корзину в один клик.
linyli пишет:
12.03.2011 11:25
Al.exe-y, спасибо за статью! Начинающим будет особенно полезно!
Ася Мигунова пишет:
14.03.2011 12:10
А мне понравился список! Многое из него как раз и проверяется в первую очередь, как шаблон. А дальше идут уже особенности и исключения из правил ))
finking пишет:
19.03.2011 18:17
"• Любая страница имеет не более 3-х «ярких пятен»."
А если страница длинная, более трех подзаголовков/разделов? То же только 3 картинки?
Alexey пишет:
13.04.2011 21:18
думаю нет, для каждого сайта ситуация разная (вот какая у нас творческая работа :)). Это общий принцип. Допустим если это статья, то в ней может быть много картинок, но на одном экране не более 3. Нужно просто смотреть, чтобы они не отвлекали от основной страницы.
Владимир Шупляков пишет:
07.05.2011 14:02
Статья замечательная. От себя хотелось бы заменить предложение "Изображение товара" на "Высококачественные изображения товара в различных ракурсах". Это создает у потенциального покупателя иллюзию осмотра товара, как при офлайн-покупке.
maximvar пишет:
24.03.2011 22:33
Всё познавательно и интересно, в сочетании с комментариями, для новичка это целое пособие получается, спасибо.