Поведенческие привычки пользователя на сайте: как создать кнопки в соответствии с ними.
28 декабря 2020
Автор: Некстайп Веб-студия
Юзабилити, то есть удобство интерфейса для пользователей, касается в первую очередь технической стороны, дизайна и оформления значимых деталей. В число последних входят кнопки, позволяющие совершать целевое действие.
Существует несколько принципов их профессионального оформления:
- Лёгкий поиск: кликабельные, равно как и некликабельные, элементы должны располагаться там, где их ожидают видеть пользователи. Чтобы не создавать стрессовую ситуацию, не нужно креативить — корзина традиционно должна быть в правом верхнем углу, кнопка покупки — под описанием товара и т.п. На длинных страницах уместно расположить одну «плавающую» кнопку или разместить несколько.
- Порядок расположения: последовательность элементов также должна соответствовать представлениям пользователей. Поэтому кнопка «Отмена» должна находиться, например, левее или ниже кнопки «Отправить».
- Последовательность, также важна для юзабилити. То есть кнопки должны быть похожи между собой формой. По цветовой гамме допускаются отличия в ряде случаев, которые рассмотрим позже. Нелишним будет придание «объёма» кнопке с помощью тени.
- Надпись: кнопка должна оснащаться понятным ёмким текстом не длиннее четырёх слов: «Перейти к каталогу», «Скачать бесплатно», «Оформить подписку».
- Вектор действия: кнопка должна чётко указывать, что наступает при её нажатии, какая задача решается. Мотивирующая кнопка создаёт комфорт для пользователя, поэтому рекомендуется не ограничиваться общими словами типа «Отправить данные». Если после введения данных в форму обещан подарок, то кнопка должна гласить: «Получить подарок». Необходимо избегать приказного тона при оформлении.
- Использование формы первого лица: «Подключить мой бесплатный доступ» вместо «Подключить ваш бесплатный доступ».
- Принцип срочности предложения усиливает спрос: текст кнопки должен выглядеть, например, так: «Заказать сейчас за полцены».
- Пояснения при необходимости: рядом с ориентированной на срочность кнопкой «Купить за 50% стоимости» — должна быть фраза, что акция действует, например, до полудня 31 октября.
- Размер имеет значение: крупные значки легче заметить, нежели мелкие. Между интерактивными фрагментами обязательно должны быть и отступы, параметры которых не позволяют пользователю промахнуться.
- Кнопка должна «нажиматься», то есть состояние элемента по умолчанию должно отличаться от активной позиции, иначе пользователи не поймёт, что действие произошло.
- Регулярный контроль: без постоянного тестирования и улучшения невозможен прогресс. Отслеживайте поведение пользователей, анализируйте конкурирующие сайты.
Нельзя забывать, что грамотно оформленные кнопки помогают посетителю сайта осуществить целевое действие, на разработке их не стоит экономить.
