Когда вашему клиенту обязательно нужно выбрать одно из предлагаемых вами значений, например частоту получения писем при подписке, вы можете использовать раскрывающийся список или группу радиокнопок. Сегодня мы поговорим про радиокнопки.
Радиокнопки используются в ситуациях, когда пользователю нужно выбрать один из исключающих друг друга ответов. Не выбрать ничего нельзя. В нашей статье мы объясним, почему при использовании радиокнопок нужно заранее выбирать ответ за пользователя.
Что такое радиокнопка
Радиокнопка представляет собой разновидность флажка. Это элемент интерфейса, который позволяет пользователю выбрать одну опцию из определенного набора.
Элемент был назван по аналогии с кнопками, которые использовались в автомобильных радиоприемниках для выбора определенной радиостанции. Аналогичное решение в СССР широко применялось в телевизорах.
Особенности
Поведение радиокнопок является взаимоисключающим, то есть когда выбирается один вариант, то выбор прежнего автоматически аннулируется. Радиокнопки традиционно имеют круглую форму, поэтому не стоит отходить от этого правила, чтобы не путать пользователя. Рядом с кнопкой располагается описание выбираемого элемента. Радиокнопки располагают группами по несколько штук, причем в любой момент выбрана может быть только одна кнопка из группы.
Радиокнопки предоставляют возможность взаимоисключающего выбора одного значения из многих.
Поведение единственной радиокнопки в группе не определено – в такой ситуации, она должна действовать как чекбокс.
В подобных случаях, когда необходимо предоставить выбор независимых друг от друга вариантов, следует использовать чекбоксы или подобные им элементы управления.
Внутри группы радиокнопок одна обязательно должна быть установлена по умолчанию.
Преимущества:
- Радиокнопки незаменимы для выбора единственного значения из нескольких вариантов
- Радиокнопки хорошо подходят для нужд обучения
Недостатки:
- В смысле занимаемого экранного пространства, радиокнопки менее экономны, чем чекбоксы. Они занимают столько же места, но имеют смысл только объединившись в группу, поэтому занимают большую площадь.
Советы, как сделать радиокнопки максимально эффективными:
1. Внутри группы радиокнопок одна обязательно установлена по умолчанию.
✓ Удачный пример с сайта Dropbox
Выбор радиокнопки по умолчанию — это хорошо с точки зрения юзабилити и дизайна. Плюсы такого решения не в его традиционности, а в том, что оно позволяет дать пользователям больше контроля над своими действиями, ускорить решение задачи и облегчает выбор.
✘ Неудачный пример – отсутствие кнопки по умолчанию
2. Если радиокнопок в группе более 7, используйте раскрывающийся список или комбинированный список.
✓ Удачный пример с использованием раскрывающегося списка
3. Флажки и радиокнопки внутри своих групп расставлены по вертикали.
✘ Неудачный пример с горизонтальным расположением списка с сайта EDF
4. Если в окне, помимо терминационных кнопок, есть только набор радиокнопок, то двойной щелчок по радиокнопке устанавливает ее и закрывает окно.
Радиокнопки-значки
Радиокнопки-значки работают точно так же, как и радиокнопки: одна кнопка всегда нажата и каждый раз, когда нажимается другая кнопка, первая возвращается в исходное состояние. Отличный пример – элементы, управляющие выравниванием текста в Word.
Радиокнопки-значки предоставляют возможность единственного выбора из списка возможных альтернатив.
Преимущества:
- Занимают мало места, управляя при этом взаимоисключающими состояниями единственного элемента управления.
Недостатки:
- Подвержены той же самой проблеме, что и обычные кнопки-значки – изображения на них не всегда однозначны и могут быть интерпретированы по-разному.
Вывод: выбор радиокнопки по-умолчанию — это хорошо с точки зрения юзабилити и элегантности дизайна. Плюсы такого решения не в его традиционности, а в том, что оно позволяет дать пользователям больше контроля над своими действиями, ускорить решение задачи и облегчит выбор.
Проверьте эффективность радиокнопок на вашем сайте прямо сейчас → Обратитесь к нашим экспертам прямо сейчас!
