Днепр

Дмитрия Яворницкого, 101

По вопросам поступления:

Учебный отдел:

По вопросам оплаты:

Как не спугнуть посетителя сайта? Главные правила юзабилити

22 Aug. 2016

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

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

А сколько раз приходилось попадать на сайт, на котором не было ничего полезного, но покидать ресурс совершенно не хотелось?

Все потому, что юзабилити сайта учитывают не все владельцы ресурсов, дизайнеры и верстальщики.

Юзабилити сайта – удобство использования сайта, создание максимальных условий для того, чтобы посетитель смог найти все, что ему необходимо. Если сайт предназначен для получения заказов и продажи товаров, то хорошо, чтобы посетитель оформил заказ.  От того насколько удобно пользоваться сайтом зависит конверсия сайта и количество заказов, оставленные заявки и просьбы перезвонить. От юзабилити еще зависит станет ли посетитель сайта Клиентом компании.

Юзабилити и построение сайта, а также ведение посетителя к определенным целевым действиям – это целая наука. Разбираться в ней обязан каждый веб-дизайнер и верстальщик.

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

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

Главная страница

При входе на сайт, пользователь сразу же должен понимать, куда он попал, что ему предлагают и что он должен делать.

Тематика сайта должна быть прописана в понятной форме в верхней части сайта. Вроде как, само собой разумеется, но нет. Есть еще примеры сайтов, попадая на которые даже самые опытные пользователи не могут понять, где они оказались.

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

Визуальные эффекты

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

Типографика

Правильный подбор шрифтов и компоновка элементов на сайте играет далеко не последнюю роль. Шрифтов не должно быть слишком много. Подберите два шрифта, главное, чтобы они были удобочитаемыми и соответствовали тематике сайта. Не выбирайте Comic Sans или Gotica для сайта, который продает технику.

Теряетесь в большом выборе шрифтов? Для начала выберите два похожих шрифта одного стиля, например, PT Sans и PT Serif.

Текст

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

Касательно заголовков, то они должны быть емкими и рассказывать о выгоде. Подумайте сами, какой из этих заголовков подействует на вас:

«Аудит сайта компании Brand_name»

или

«Как управлять посетителями сайта?»

Восприятие информации с экрана

Пользователи воспринимают информацию по такой схеме: заголовок – картинка – остальной текст. Поэтому заголовок следует делать более крупным, чем основной текст.

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

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

Необходимо помнить о пользовательском опыте. Подчеркнутый текст – это ссылка. Именно так пользователь будет воспринимать его, поэтому не используйте подчеркивание для того, чтобы выделить слово.

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

Цветовые решения сайта

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

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

Перенасыщенность страниц информацией

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

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

Инструкции

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

Вывод

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

Хочешь научиться WEB-программированию? Поступай к нам → https://itstep.dp.ua/razrabotka-i-prodvizhenie-web-proektov/

Популярные статьи

Поиск

А хотите мы Вам вышлем набор демонстрационных электронных уроков
+
Книгу - "Как построить карьеру в IT"?


Да
Нет

Заполните пожалуйста форму


Введите sms-код для подтверждения


Получите книгу: «Как воспитывать ребенка. Советы известных людей»


Да
Нет