Переключатели

Примечание

Это руководство по проектированию было создано для Windows 7 и не было обновлено для более новых версий Windows. Большая часть рекомендаций по-прежнему применяется в принципе, но презентация и примеры не отражают наше текущее руководство по проектированию.

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

screen shot of three radio buttons

Типичная группа переключателей.

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

Примечание

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

 

Выбор правильного элемента управления

Чтобы определиться, ответьте на вопросы:

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

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

  • Будет ли флажок лучшим выбором? Если есть только два варианта, можно использовать один флажок . Однако флажки подходят только для включения или выключения одного параметра, тогда как переключатели можно использовать для совершенно различных вариантов. Если возможны оба решения:

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

      Неправильно:

      screen shot of landscape check box

      Правильно:

      screen shot of landscape/portrait radio buttons

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

    • Используйте переключатели на страницах мастера, чтобы сделать альтернативные варианты понятными, даже если флажок в противном случае является приемлемым.

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

      Неправильно:

      screen shot of show/don't show radio buttons

      В этом примере параметры недостаточно важны для использования переключателей.

      Правильно:

      screen shot of don't show this message check box

      В этом примере флажок — эффективное использование пространства экрана для этого периферийного устройства.

    • Используйте флажок, если на странице есть другие флажки.

  • Будет ли раскрывающийся список лучшим выбором? Если для большинства пользователей в большинстве случаев рекомендуется использовать параметр по умолчанию, переключатели могут привлечь больше внимания к параметрам, чем это необходимо.

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

      screen shot of highest quality as default button

      В этом примере раскрывающийся список посвящен текущему выбору и запрещает пользователям вносить изменения.

    • Рассмотрим раскрывающийся список, если на странице есть другие раскрывающийся список.

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

  • Доступны ли параметры программы, а не данные? Значения параметров не должны основываться на контексте или других данных. Для данных используйте раскрывающийся список или список с одним выбором.

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

  • Являются ли значения нечисловыми? Для числовых данных используйте текстовые поля, раскрывающиеся списки или ползунки.

Рекомендации

Общие сведения

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

  • Если ни один из параметров не является допустимым вариантом, добавьте другой вариант, чтобы отразить этот выбор, например None или Does not apply.

  • Предпочитайте выравнивать переключатели по вертикали вместо горизонтального выравнивания. Горизонтальное выравнивание сложнее читать и локализовать.

    Правильно:

    screen shot of vertical radio-button alignment

    В этом примере переключатели выравниваются по вертикали.

    Неправильно:

    screen shot of horizontal radio-button alignment

    В этом примере выравнивание по горизонтали сложнее читать.

  • Пересматривайте использование групповых полей для организации групп переключателей— это часто приводит к ненужным загромождениям экрана.

  • Не используйте метки переключателей в качестве меток для полей группы.

  • Не используйте выбор переключателя, чтобы:

    • Выполнение команд.
    • Отображение других окон, таких как диалоговое окно для сбора дополнительных входных данных.
    • Динамическое отображение или скрытие других элементов управления, связанных с выбранным элементом управления (средства чтения с экрана не могут обнаруживать такие события). Однако вы можете динамически изменять текст в зависимости от выделенного фрагмента.

Подчиненные элементы управления

  • Поместите подчиненные элементы управления справа или ниже (с отступом, с меткой переключателя) переключатель и ее метку. Завершите метку переключателя двоеточием.

    screen shot of control to the right of its label

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

  • Оставьте зависимые редактируемые текстовые поля и раскрывающиеся списки включенными, если они совместно используют метку переключателя. Когда пользователи вводит или вставляет все данные в поле, автоматически выберите соответствующий параметр. Это упрощает взаимодействие.

    screen shot of page range dialog box with text box

    В этом примере при вводе номера страниц автоматически выбирается Pages.

  • Избегайте вложения переключателей с другими переключателями или флажками. По возможности сохраните все параметры на одном уровне.

    Правильно:

    screen shot of left-aligned radio buttons

    В этом примере параметры находятся на одном уровне.

    Неправильно:

    screen shot of nested radio buttons

    В этом примере использование вложенных параметров повышает сложность.

  • Если вы вложите переключатели с другими переключателями или флажками, отключите эти подчиненные элементы управления, пока не будет выбран параметр высокого уровня. Это позволяет избежать путаницы о значении подчиненных элементов управления.

Значения по умолчанию

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

  • Исключения: Если выбрано значение по умолчанию, не выбрано:

    • Допустимый вариант по умолчанию для безопасности, безопасности или юридических причин отсутствует, поэтому пользователь должен сделать явный выбор. Если пользователь не делает выбор, отобразится сообщение об ошибке, чтобы принудительно выполнить его.
    • Пользовательский интерфейс должен отражать текущее состояние и параметр еще не задан. Неправильное значение по умолчанию означает, что пользователю не нужно делать выбор.
    • Целью является сбор непредвзятых данных. Значения по умолчанию будут предвзято собирать данные.
    • Группа переключателей представляет свойство в смешанном состоянии, которое происходит при отображении свойства для нескольких объектов, которые не имеют одинаковых параметров. В этом случае не отображается сообщение об ошибке, так как каждый объект имеет допустимое состояние.
  • Сделайте первый вариант вариантом по умолчанию, так как пользователи часто ожидают, что, если этот порядок не является логическим. Для этого может потребоваться изменить метки параметров.

    Неправильно:

    screen shot of last radio button as default option

    В этом примере параметр по умолчанию не является первым.

    Правильно:

    screen shot of first radio button as default

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

screen shot of radio button sizing and spacing

Рекомендуемые размеры и интервалы для переключателей.

Подписи

Метки переключателя

  • Пометка всех переключателей.
  • Назначьте уникальный ключ доступа каждой метки. Рекомендации см. в разделе "Клавиатура".

  • Используйте прописную букву в стиле предложений.

  • Напишите метку как фразу, а не как предложение и не используйте конечные знаки препинания.

    • Исключение: Если метка переключателя также помечает подчиненный элемент управления, который следует за ним, завершите метку двоеточием.
  • Используйте параллельную фразу и попробуйте сохранить длину примерно одинаковой для всех меток.

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

  • Используйте положительное выражение. Например, используйте вместо этого не делать, а не печатать, а не печатать.

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

    screen shot of radio buttons with explanatory text

    В этом примере параметры объясняются с помощью отдельных статических текстовых элементов управления.

    Примечание

    Добавление объяснения к одной переключателю не означает, что необходимо предоставить объяснения для всех переключателей. Укажите соответствующие сведения в метке, если это возможно, и используйте объяснения только при необходимости. Не просто передавайте метку для согласованности.

     

  • Если параметр настоятельно рекомендуется, добавьте "(рекомендуется)" в метку. Не забудьте добавить в метку элемента управления, а не дополнительные заметки.

  • Если параметр предназначен только для расширенных пользователей, добавьте "(advanced)" в метку. Не забудьте добавить в метку элемента управления, а не дополнительные заметки.

  • Если необходимо использовать многострочный набор меток, выровняйте верхнюю часть метки с помощью переключателя.

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

Метки группы переключателей

  • Используйте метку группы, чтобы объяснить назначение группы, а не способ выбора. Предположим, что пользователи знают, как использовать переключатели. Например, не произнесите "Выбрать один из следующих вариантов".

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

    Исключение: Опустите метку, если это просто повторная инструкция диалогового окна. В этом случае основная инструкция принимает двоеточие (если это не вопрос) и ключ доступа (если таковой есть).

    Хорошо:

    screen shot of redundant radio-button group label

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

    Лучше:

    screen shot of radio button main instruction only

    В этом примере удаляется избыточная метка, поэтому основная инструкция принимает двоеточие.

  • Не присваивайте метку ключ доступа. Это не обязательно, и это затрудняет назначение других ключей доступа.

    • Исключение: Если не все элементы управления могут иметь уникальные ключи доступа, можно назначить метку вместо отдельных элементов управления. Дополнительные сведения см. в разделе "Клавиатура".

Документация

При обращении к переключателям:

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

Пример. Щелкните текущую страницу и нажмите кнопку "ОК".