Чекбоксы и радиокнопки: 3 приема для облегчения жизни ваших покупателей

Чекбоксы и радиокнопки: 3 приема для облегчения жизни ваших покупателей

Эти небольшие советы из статьи 3 Ways to Make Checkboxes, Radio Buttons Easier to Clickс uxmovement.com

Чекбоксы и радиокнопки – неотъемлемая часть форм. Но в большинстве случаев кликать по ним не так-то просто. Причина в том, что «цель» клика слишком мала. А чем меньше зона для клика, тем сложнее прицелиться в нее указателем мыши. К счастью, есть три приема, позволяющие облегчить задачу попадания в чекбокс/радиокнопку.

1. Использование тэга label

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

2. Эффекты при наведении указателя мыши

Это чисто визуальное подтверждение того, что с данным объектом на экране можно что-то сделать. Да, браузеры зачастую самостоятельно подсвечивают кнопку/чекбокс при наведении указателя, но об описании, (правильно) введенном с помощью label, такого не скажешь. Добавьте свои эффекты при наведении указателя, чтобы полностью устранить препятствия на пути посетителя.

3. Выделение области кнопки/чекбокса

Заключите чекбокс/кнопку с описанием в рамку, или подложите под него цветной прямоугольник, и сделайте всю эту область кликабельной. Проще уже некуда, такие визуальные «намеки» не должны оставить у посетителя вопросов о том, куда кликать и к какому эффекту этот клик приведет. Также можно менять цвет рамки/подложки после выбора варианта. Так вы сообщите посетителю, что действие принято, все в порядке.

Чекаут

Чекаут – типичная форма в интернет-магазине. Кроме того, чекаут часто подразумевает достаточно большое количество полей и чекбоксов/радиокнопок, и поэтому эта часть интернет-магазина нередко становится «точкой выхода». Столкнувшись с необходимостью приложить усилия и что-то там заполнить/выбрать, некоторые пользователи плюют на покупку и уходят в оффлайн (на рынок, в ближайший магазин). Помогите им все-таки сделать правильный выбор и купить товар у вас. Сделайте ваш магазин удобней и проще для восприятия.

Автор: anton Terekhov Anton

Подписаться на новости

Читайте также

25 октября / Комментарии

11 принципов веб-дизайна, которые повышают конверсию

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

далее →

26 сентября / Комментарии

Разбор юзабилити интернет-магазина Ulmart.ru и его преобразования за 2016 год

Изначально статья планировалась как одно целое, где я хотел рассмотреть возможные ошибки в юзабилити топа российских интернет-магазинов. Но после нескольких дней обзора, понял, что каждый сайт заслуживает отдельного разбора. Кроме того, мне захотелось не только осветить проблему, но и предложить своё видение ее решения. В связи с этим вся статья строится по схеме: Гипотеза о проблеме > Причина и Обоснование > Решение.
Поскольку статья начата еще в ноябре 2015 года, а закончена только сейчас, Ulmart успел исправить часть проблем,  обозначенных в статье. Об этом я дополнительно говорю в примечаниях . И сейчас мы можем отследить те преобразования, которые были сделаны.

далее →

6 сентября / Комментарии

Комфорт покупателей как залог успешного бизнеса. Основные ошибки в юзабилити интернет-магазинов

Четыре года назад была опубликована статья «22 ошибки в юзабилити интернет-магазинов, а также работающие варианты по их исправлению». Мы решили, что настала пора освежить данную информацию и задали разработчикам сайтов и CMS следующие вопросы: «Какие указанные в данном материале ошибки по-прежнему актуальны?», «С какими юзабилити-ошибками интернет-магазинов вам приходится встречаться чаще всего?», «Какие юзабилити-советы вы можете дать заказчикам?». И вот что мы узнали.

далее →

11 августа / Комментарии

Чек-лист юзабилити интернет-магазина

По-настоящему проверить удобство интернет-магазина без подтверждения данными веб-аналитики, не получится. Контекст взаимодействия; задачи, опыт и мотивы пользователей; устройства, с которых пользователи просматривают магазин — всё это влияет на конверсию и не может быть оценено чек-листом.
При составлении чек-листа, я ориентировался на исследования института Baymard, Юзабилити Лаб, Mastercart и студии Сибирикс + некоторые собственные наблюдения.

далее →

Навигация как способ управления вниманием пользователя

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

далее →

X
Нажмите «Нравится»,
чтобы читать Shopolog.ru в Facebook