Выбрать главу

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

 

Виды ошибок usability

 

Технические.

Дизайн.

Контент.

 

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

 

Чек-лист юзабилити

 

Хорошая скорость загрузки страниц.

Оптимизация под каждый регион.

Простое переключение на другой язык (при необходимости).

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

Мобильная версия веб-ресурса.

Избавление от горизонтальной прокрутки.

Кнопки заказа - в видимой части.

Понятные иконки.

Один стиль дизайна на всех документах.  

Ясность тематики веб-ресурса в любом месте навигации.

Нахождение популярных элементов на привычных местах (лого - слева вверху и т.п.).

Минимальное число контактов. 

Активный логотип, ссылка ведет на главную.

Наличие карты сайта, желательно в футере. 

Запоминающийся фавикон. 

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

Русский язык на кнопках в меню. Только понятные термины.

Полная страница “О нас”: Фото сотрудников компании, офиса, рабочего процесса.

Обработка 404 страницы. 

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

Нет всплывающих окон, или они имеют ярко выраженную кнопку закрытия. 

Быстрый возврат наверх. Кнопка быстрого скроллинга на длинных страницах.

Минимум действий от пользователя. Почти все делается скриптами (к примеру, город доставки выставляется по указанному индексу и т.п.).

 

Дизайн и навигация

Нет - ярким цветам, огромным или мизерным шрифтам, навязчивой анимации. 

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

Нет перегруженности анимацией.

Нет нагромождения элементов. 

Оптимальные размеры. Все кликабельные элементы не должны рассматриваться под микроскопом. Но переусердствовать тоже не нужно.

Кликабельность/некликабельность. При наведении на активный элемент курсор видоизменяется на руку. 

Избавление от лишних элементов. 

‍​‌‌​​‌‌‌​​‌​‌‌​‌​​​‌​‌‌‌​‌‌​​​‌‌​​‌‌​‌​‌​​​‌​‌‌‍

Всплывающее окно с пояснениями для неактивных элементов. 

Главный контент - слева, потому что мы читаем слева направо.

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

Удобное расположение блоков. Они должны говорить посетителю, что под прокруткой тоже есть интересные блоки.

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

Правильные честные кнопки и ссылки. Если ссылка  “Заказать” отправляет клиента на “О компании” - это плохо. 

Нет ссылок с непонятными названиями: “Продолжить”, “Далее”,  “Назад” и т.п.

Отменяющие кнопки. Размещаются в отдалении от кнопок подтверждения, заметно отличаясь от них. 

Стандартизация ссылок. Все активные ссылки подчеркнутые, выделенные цветом, который меняется после клика.

Ссылки на скрытый контент - оформляются подчеркиванием пунктиром.

Анкоры ссылок. В тексте гиперссылки явно указано название объекта. 

Удобство кликов. Короткие ссылки и кнопки неудобны для клика. 

Кликабельная строка навигации «хлебные крошки» - в верхней контентной части документа. 

Заголовок на каждой странице.

Раздел «Вы смотрели»  предусмотрен.

Грамотная внутренняя перелинковка.

Главное меню должно быть сквозным и доступным.

Стандартные названия пунктов меню.