Юзабилити сайта
Простота, удобство и польза сайта - основа его совершенства успеха среди пользователей и поисковиков. Хотите в ТОП - забирайте подробный чек-лист основных принципов usability на пути к идеальному
сайту!
Конкуренция в интернет-пространстве с каждым годом становится все выше. Чтобы зацепить пользователя на сайте, нужно сделать ресурс максимально удобным: посетитель должен быстро найти нужную информацию и при этом качество контента не
должно вызывать у него вопросов.
Оценить, насколько сайт удобен для пользователей помогает показатель юзабилити.
Юзабилити (usability) сайта это - показатель, с помощью которого можно оценить простоту и комфортность работы с ресурсом.
Юзабилити влияет на:
- Посещаемость. Посетитель будет возвращаться на сайт только в том случае, если ему будет на нем интересно, комфортно и полезно. Например, если он уже совершил заказ и у него не возникло нареканий в процессе оформления покупки, он
вернётся на сайт снова.
- Конверсия. Если на сайте будет продуманная навигация, то это подтолкнет посетителя совершить целевое действие, например оставить заявку, заказать товар, заказать сопутствующую услугу или позицию по каталогу и тд.
Грамотно выстроенная структура сайта, точки захвата посетителей не дадут потенциальному покупателю время на сомнения.
Например, если на нужный ему товар не будет подробного описания и у него возникнут вопросы, он не будет ждать, пока ему перезвонят, а пойдет на другой сайт и закажет товар там.
Принципы юзабилити
Для того, чтобы у сайта был хороший показатель юзабилити, нужно знать основные принципы, на которых он базируется:
- Структурированный и логичный контент.
При написании материала нужно чтобы:
- текст был полезным и информативным;
- статья должна быть грамотно структурирована по смысловым блокам;
- текст должен быть хорошо оформлен (разбивка на абзацы, наличие списков, выделение главной мысли цветом или размером шрифта);
- в статье не должно быть грамматических, пунктуационных и стилистических ошибок.
Если информации слишком много - можно сделать оглавление в виде ссылок, чтобы пользователь сразу мог переходить в нужный блок.
- Лаконичный дизайн. Чтобы посетитель не отвлекался от основной информации, не нужно перегружать сайт слишком броскими и яркими элементами.Принципы оформления сайта должны исходить из основной деятельности компании. Дизайн должен быть
уместным и оформленным в фирменном стиле компании. Например, у сайта агентства по оформлению праздников должен быть яркий интерфейс, а сайт юридической конторы наоборот лучше сделать в минималистичном дизайне.
- Расположение важной информации. Следует выделять основную информацию, что пользователь мог сразу увидеть ее. Желательно вывести важный текст на главную страницу. Можно также дублировать его всплывающим окном в других разделах.
Например, информацию о графике работы в праздники нужно вывести на главную страницу, и во вкладке “Покупка товара” сделать ссылку-напоминание.
Пример: при оформлении заказа, обратите внимание на наш график работы в праздники (ссылка на “Главную” или страницу “Контакты”).
- Общение с пользователем. Потребителю должна быть предоставлена вся подробная информация: как оформить заказ, что будет после покупки товара, как зарегистрироваться, что делать, если страница не открылась и тд.
- Возможность отменить действие. У пользователя может появится причина отказаться от услуги, либо изменить параметры (количество товара, время доставки и тд). Нужно предоставить покупателю возможность изменить или отменить покупку
максимально комфортно и с минимальными потерями. Это положительно влияет на улучшение юзабилити сайта. Например: бесплатная отмена бронирования за 48 часов до заселения, возможность самостоятельно поменять дату и время доставки в
личном кабинете и тд.
- Помощь.Наличие чатов, форм обратной связи. Помощь в выборе не должна быть навязчивой. Например, при выборе товара может всплывать диалоговое окно с консультантом, которое можно свернуть. Так же помощь должна быть своевременной.
Например, если пользователь пишет в диалоге, ответ должен поступить сразу, а не через пару часов, когда потенциальный клиент уже закроет форму.
- Доступность разделов.Все разделы и категории должны быть на виду у пользователя, чтобы он мог лучше ориентироваться, куда ему перейти. Вложенность страниц не должна превышать двух. То есть с главной страницы сайта, пользователь мог
бы перейти на любую другую одним нажатием мышки. Если разделов много - можно добавить карту сайта и обязательно установить навигационную цепочку (хлебные крошки).
- Удобная форма регистрации заказа.Пользователь не захочет заполнять много информации, поэтому лучше всего оставить минимум вопросов, либо выделить обязательные поля. Также желательно, чтобы присутствовали подсказки, для того, чтобы
посетитель все верно заполнил. Например, в каком формате должен быть телефон, какими буквами пишется адрес и тд. В идеале устанавливается только одно поле для номера телефона. Получение остальных данных - первостепенная задача
менеджера.
- Заметный поиск по сайту.Чаще всего, первым делом пользователи ищут кнопку или строку поиска. Поиск - это главный помощник посетителя сайта. Поэтому поиск нужно разместить на видном месте, как правило, в правом верхнем углу. Кроме
этого, необходимо поработать над ключевыми словами, чтобы при вводе запроса клиент сразу находил необходимую информацию.
- Свободное пространство. Если на странице заполнено все свободное пространство, это будет раздражать и запутает пользователя. Например, в разделе о товаре можно скрыть описание товара, и, если клиент захочет, он может нажать на
стрелку и описание откроется для изучения.Исключение - лендинги, там на одной странице нужно вместить максимум полезной информации.
- Отображение сайта на различных устройствах. Посетитель должен легко зайти на сайт как с браузера, так и с мобильного устройства. Можно сделать мобильное приложение, которое пользователь скачает и будет им пользоваться при оформлении
заявок. Это приведет к повышению посещаемости ресурса и росту лидогенерации.
- Гарантия надежности. Наличие вкладки о компании, контактных данных, адреса офиса, схемы проезда, сертификатов, отзывов, банковских реквизитов – позволяет посетителю увериться в том, что компания реально существует, имеет свой статус
и компетентность.
Ошибки юзабилити
При создании и ведении сайта чаще всего допускаются ошибки, из-за которых юзабилити снижается и пользователь быстро теряет интерес к ресурсу:
- Медленная скорость загрузки.
- Сайт не адаптирован под мобильные устройства.
- Непонятная навигация.
- Навязчивый сервис (постоянно вылетают кнопки помощи, которые сложно закрыть).
- Страница перегружена текстом.
- Сайт переспамлен ключевыми словами.
- Использование некачественных фотографий.
- Контент скопирован из других источников.
- Информация написана неграмотно, с опечатками.
- Рядом с товаром не написана цена.
- Долгий ответ в чатах.
Чек-лист проверки параметров юзабилити
Для того, чтобы проверить, насколько web-ресурс удовлетворяет запросам пользователей, проводится юзабилити аудит сайта.
Чек-лист проверки:
Основные параметры
- Сайт и все его разделы загружаются за 1-2 секунды.
- Есть мобильное приложение.
- Сайт можно открыть с браузера и с мобильных устройств.
- На сайте установлен SSL-сертификат.
- Корректно отображается регион в зависимости от местоположения пользователя, есть возможность сменить регион.
- Для каждой страницы прописаны заголовки, отражающие ее содержание.
- У сайта есть иконка, которая отличает его от других ресурсов и с помощью которой сайт можно легко найти среди вкладок.
- Есть Личный кабинет, можно зарегистрироваться или войти с помощью социальных сетей.
- Проработана страница ошибки (404). На странице размещены рекомендации для пользователя. Например: обновить страницу, перейти в другой раздел и тд.
- Пустые страницы отсутствуют.
- Настроен 301 редирект с несуществующих и дублирующих страниц.
Навигация
- Номер телефона и e-mail размечены как ссылки с параметрами «tel:» и «mailto».
- В меню до 8 ссылок на основные разделы.
- Главная страница открывается по клику на логотип.
- В шапке и подвале сайта расположено основное навигационное меню.
- Пункты меню названы понятно для посетителей. Например: регистрация, авторизация и тд.
- Логичный порядок пунктов в меню. Вначале отображена самая важная информация.
Навигация по страницам
- Настроена навигационная цепочка, посетитель может легко переходить из раздела в раздел. В мобильной версии есть кнопка “назад” или “вернуться”.
- С каждой страницы можно перейти на другую страницу.
- На длинных страницах есть плавающая кнопка “Вверх”.
Поиск
- Поиск хорошо виден и присутствует на каждой странице.
- Поиск можно запустить по клику на кнопку и при нажатии enter.
- Поиск автоматически подсказывает результаты при введении текста.
- При допущении ошибок в процессе ввода искомого товара или услуги в строке поиска (грамматических, опечаток) настроено автоматическое исправление слов.
- Есть возможность отсортировать полученные результаты (по цене, по популярности и тд).
- Предложены альтернативные товары или услуги, если по заданным критериям пользователь ничего не находит.
Дизайн
- Все иконки в интерфейсе понятны для посетителей.
- У всех страниц единый стиль, шрифт и формат оформления текстов.
- Все элементы сайта легко считываются и находятся в привычных местах.
- Контент размещен логически, по принципу читаемости: слева-направо или сверху-вниз.
- Крупные кликабельные элементы навигации и инфографики.
Доступность
- Все элементы имеют хорошую контрастность (видны пользователям).
- Можно перемещаться по сайту с помощью клавиатуры.
- Размеры шрифта комфортны для прочтения.
- Есть версия для слабовидящих.
Кнопки
- На каждой странице можно совершить целевое действие (купить, перейти, заполнить, позвонить).
- По названию кнопок понятно ее целевое значение.
Ссылки
- Ссылки используются для перехода между страницами.
- Все ссылки оформлены в едином стиле и отличаются от текста (подсвечены альтернативным цветом, подчёркнуты, отображают кликабельный статус - был ли по ней совершен переход пользователем или она пока еще не отработана).
- Ссылки не ведут на текущую страницу.
- Название ссылок отражает то, куда по ним можно перейти.
Контакты и обратная связь
- Указан правильный формат номера телефона в соответствии с регионом.
- Контакты распределены по смысловым блокам. Например: отдел маркетинга, отдел сбыта, технические специалисты.
- Офисы компании можно посмотреть списком и на карте.
- На сайте легко можно найти форму обратной связи.
- Вкладку с онлайн-консультантом легко скрыть.
Формы
- Формы содержат минимум обязательных полей для заполнения.
- Поля организованы в логичном порядке.
- Длинные формы разбиты на шаги.
- Есть подсказки для заполнения.
- Есть информация, что произойдёт после отправки данных. (Придёт чек, свяжется менеджер и тд).
- Выделены обязательные поля.
- Переключаться между полями можно с помощью клавиши tab.
- Есть проверка корректности введенных данных.
- Кнопка отправки формы неактивна, пока все данные не будут введены верно.
- Перед отправкой формы появляется окно о согласии обработки персональных данных пользователя, с которыми он должен согласиться, отметив действие в чек-боксе.
- После отправки данных появляется окно об успешном оформлении заявки.
Текст
- Понятен и интересен пользователю (нет воды и переспама).
- Отсутствуют грамматические и пунктуационные ошибки.
- Текст структурирован, разбит на абзацы.
- Содержит в себе маркированные и нумерованные списки.
- Важная информация выделяется цветом, курсивом.
Изображения
- Картинки и инфографика представлены в хорошем качестве и разрешении.
- Приветствуется оригинальность изображений.
- Приписываются мета-данные к каждому (Alt, Title), которые не дублируются между собой.
- Соблюдаются нормы верстки изображений на всех страницах сайта.
- Все изображения можно увеличить, кликнув по ним мышкой или по экрану сенсора.
Зная, какие параметры улучшают юзабилити сайта, можно оптимизировать сайт под потребности пользователя. Перед улучшением, нужно провести технический анализ, выявить потребности целевой аудитории, рассмотреть конкурентов ниши. Без этих
работ, все мероприятия будут бесполезными, поскольку не учтены основные требования по отрасли. Лучше всего доверить проверку ресурса специалистам, у которых есть опыт в этой сфере. Они не только усовершенствуют сайт, но и расскажут
подробно обо всех ошибках и пропишут рекомендации по ведению. У нас можно заказать юзабилити аудит-сайта, который выявит сильные и слабые стороны компании.
Автор: Наталья Гилёва-Живых