Как удержать клиентов на своём сайте
Поговорим о юзабилити сайта
Привести трафик на свой сайт — это только раз.
Посетителя нужно удержать на сайте — это два.
Довести покупателя до покупки — вот конечная цель!
А сделать покупателя Постоянным Покупателем с большой суммой среднего чека — это уже высший пилотаж!
Первый закон маркетинга: «Человек ленив»
Если сайт сложно использовать — посетитель его закроет.
Если информацию на сайте сложно воспринять и прочесть — посетитель уйдет на сайт конкурентов.
Если главная страница не отвечает на вопросы «что именно тут предлагают?» и «это похоже на то, что я искал?», то посетителя вы сразу потеряли.
Человек не будет прилагать усилия, пытаясь разобраться в интерфейсе.
У него в соседних вкладках уже открыты другие сайты такой же тематики.
Все просто: если пользователь не может легко и быстро найти, как купить товар — он его не купит.
При работе в сети человек воспринимает большинство информации через зрительный канал, т. е. визуально.
Поэтому при разработке сайтов очень важно учитывать правила и особенности взаимодействия пользователя с графическим (визуальным) интерфейсом:
1. Правило 7±2
По исследованиям, проведенным Джорджем Миллером, человек может воспринимать число объектов 7 плюс-минус 2. Если число объектов превышает это количество, то мозг будет стараться избегать решать задачу, либо откажется воспринимать всю информацию. Мозг как бы «экономит» свою батарейку, двигаясь по пути наименьшего сопротивления и решая задачу самым экономичным способом.
Поэтому важно не перегружать основное меню сайта большим количеством пунктов.
В порядке воспринимаемости информации правильно расположить разные типы информации так:
- числа
- цвета
- буквы
- фигуры
- слова
2. Геометрическая память
Человеку свойственно группировать, объединять близкие и сходные объекты, дополнять и заканчивать незавершенные фигуры. И все это должно активно применяться как в графическом, так и в веб-дизайне.
Т.е. когда мы выстраиваем объекты по какому-то геометрическому закону, мы опять же упрощаем задачу пользователю. Человек визуально запоминает, где находится нужный ему объект и автоматически ищет его в том самом месте, уже не активируя другие зоны мозга.
А мозг, как мы помним, как раз и стремится к упрощению задачи.
Например, когда пользователю нужно быстро найти приложение в своем гаджете, он вспоминает, что на экране иконка была «где-то внизу слева» и автоматически устремляет свое внимание в эту область.
Смена экранов — это тоже один из способов геометрической навигации. В данном случае, пользователь визуально запоминает, на каком экране находится то или иное приложение.
3. Группировка объектов
Основные блоки информации должны быть четко сгруппированы. Т.е. легко должны соотноситься:
- картинка и подпись к ней
- заголовки разного уровня
- заголовок и основной текст
- разные параграфы одного и того же раздела
Для чего это нужно? Опять же для того, чтобы пользователь тратил как можно меньше ресурсов мозга на обобщение и абстрагирование информации.
4. Контрасты
Основные приемы:
- Контраст формы. Дизайнеры направляют внимание пользователя на сложную форму, убирая менее сложные объекты на второй план.
- Лицо и взгляд. Зрителей привлекают лица людей — эта одна из особенностей человеческого восприятия. А направление взгляда помогает сконцентрировать внимание на нужном объекте. Например, у нас есть 2 объекта на макете: изображение девушки и кнопка «купить». Конверсия будет зависеть от их расположения: девушка рядом с кнопкой — конверсия слабая; девушка смотрит на кнопку — конверсия растет; девушка смотрит и указывает на кнопку — конверсия растет еще больше.
- Контраст цвета и размера. Контрастный цвет используется для выделения основного действия в интерфейсе (например, кнопка «купить» на сайте). Контраст размера подчеркивает важность объекта и привлекает внимание в первую очередь (все обращали внимание, что кнопка «подписаться» на сайтах гораздо больше, чем соседняя с ней «нет, спасибо»). Контраст размера так же необходимо соблюдать и при отделении заголовков от основного текста.
- Контраст движения. Естественно, движущиеся объекты привлекают внимание в первую очередь.
5. Изображения и текст
Основные приемы:
- Привычный для всех способ чтения это слева направо и сверху вниз будет наиболее естественен для восприятия.
- Мозг сначала концентрирует внимание на картинке, а затем переключается на текст. Т.е. картинку хорошо использовать как идентификатор текста.
- Пиктограммы — упрощенные символы, которые можно использовать для кнопок, не прибегая к текстовой информации.
- Контраст фона. Текст должен хорошо выделяться на фоне и самый максимальный контраст — это черный на белом.
- Длина строки. Очень важно найти оптимальное соотношение: слишком длинные строки вынуждают дополнительно двигать головой и вызывают проблемы с началом следующей строки; слишком короткие строки так же утомляют взгляд при чтении.
- Оформление текста. Сюда входит междустрочный интервал, наличие четкой структуры (заголовки и подзаголовки, абзацы и параграфы, списки и выделение акцентов).
- Важная информация — в левом углу. Посетители просматривают web страницу по F-образному шаблону: внимание концентрируется в верхнем левом углу и ограничивается первыми несколькими абзацами текста в убывающем порядке. Поэтому при распределении важной информации использование такой схему увеличит вероятность того, что посетитель быстро найдет нужные данные, увидит самое важное, бегло пробежавшись по разделу взглядом.
- Пирамида текста: от самого важного к деталям. Т.е. суть можно понять из заголовка, основное содержание прочитать в вводном блоке, а детали узнать уже в основном тексте. Так легче воспринимать информацию