Кнопки команд в Windows 7

Примечание

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

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

Снимок экрана: кнопка

Типичная кнопка команды.

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

Примечание

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

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

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

  • Используется ли кнопка команды для запуска немедленного действия? Если нет — используйте другой элемент управления.
  • Будет ли ссылка лучшим выбором? Используйте ссылку, если:
    • Действие заключается в переходе к другой странице, окну или разделу справки. Исключение: в навигации мастера используются кнопки "Назад" и "Далее".
    • Команда внедрена в текст.
    • Команда является вторичной по своей природе. То есть он не связан с основным назначением окна. В этом случае подойдет либо упрощенная кнопка команды, либо ссылка.
    • Команда является частью меню или группы связанных ссылок.
    • Метка длинная, состоящая из пяти или более слов, что придает кнопке команды неудобный вид.
  • Будет ли сочетание переключателей и универсальных командных кнопок лучше? Часто переключатели используются в сочетании с универсальными кнопками (ОК, Отмена) вместо набора определенных кнопок, если выполняются следующие условия:
    • Существует пять или более возможных действий.

    • Перед принятием решения пользователям необходимо просмотреть дополнительные сведения.

    • Пользователи должны взаимодействовать с выбором (возможно, чтобы увидеть дополнительную информацию), прежде чем принимать решение.

    • Пользователи видят варианты в качестве параметров вместо различных команд.

      Правильно:снимок экрана диалогового окна, переключателей и текста

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

      Неправильно:снимок экрана сообщения с кнопками команд

      В этом примере только кнопки команд затрудняют принятие пользователями обоснованного решения.

Принципы проектирования

Использование многоточия

Хотя кнопки команд используются для немедленных действий, для выполнения действия могут потребоваться дополнительные сведения. Укажите команду, требующую дополнительных сведений (включая подтверждение), добавив многоточие в конце метки кнопки.

Снимок экрана: кнопка печати с многоточием

В этом примере выполняется печать... Отображает диалоговое окно Печать для сбора дополнительных сведений.

снимок экрана: кнопка печати без многоточия

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

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

Это не означает, что вы должны использовать многоточие всякий раз, когда действие отображает другое окно. Используйте многоточие, только если для выполнения действия требуются дополнительные сведения. Следовательно, любая кнопка с неявным глаголом "показать другое окно" не имеет многоточия, например команды About, Advanced, Help (или любая другая команда, связанная с разделом справки), Параметры, Свойства или Параметры.

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

Примечание: При определении того, требуется ли кнопка с многоточием, не используйте необходимость повышения привилегий в качестве фактора. Повышение прав не является информацией, необходимой для выполнения команды (скорее, для разрешения), и необходимость повышения уровня указывается с помощью щита безопасности.

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

Варианты использования

У кнопок есть несколько шаблонов использования:

Использование Пример
Стандартные кнопки команд Вы можете использовать стандартные кнопки для запуска немедленного действия.
Снимок экрана: кнопка стандартной (серой) команды
Стандартная кнопка команды.
Кнопки команд по умолчанию Кнопка команды по умолчанию в окне указывает кнопку, которая будет активирована при нажатии клавиши ВВОД.
Снимок экрана: кнопка команды по умолчанию (синяя)
Кнопка команды по умолчанию.
Любая кнопка становится кнопкой по умолчанию, когда пользователи переходит к ней. Если фокус ввода находится на элементе управления, который не является кнопкой команды, кнопка с атрибутом кнопки по умолчанию становится кнопкой по умолчанию. По умолчанию может быть только одна кнопка в окне.
Упрощенные кнопки команд Упрощенная кнопка команды похожа на стандартную кнопку, за исключением того, что ее рамка кнопки отображается только при наведении указателя мыши.
Снимок экрана: одна из двух выбранных кнопок печати
В этом примере команда имеет очень упрощенный внешний вид (как ссылка), пока пользователь не наведите указатель мыши на команду, после чего она будет нарисована с помощью рамки кнопки.
Вы можете использовать упрощенные кнопки команд в ситуациях, когда вы используете стандартную кнопку, но не хотите всегда отображать рамку кнопки. Упрощенные кнопки команд идеально подходят для команд, которые нужно недооценивать, и использование ссылки не подходит.
Кнопки меню Используйте кнопку меню, если вам нужно меню для небольшого набора связанных команд.
Снимок экрана: кнопка меню
Кнопка меню с небольшим набором связанных команд.
Используйте кнопку меню, если строка меню является нежелательной, например в диалоговом окне, на панели инструментов или в другом окне без строки меню. Один треугольник, указывающий вниз, указывает на то, что при нажатии кнопки будет раскрываться меню.
Кнопки разделения Используйте кнопку разделения для консолидации набора вариантов команды, особенно если одна из команд используется большую часть времени.
Снимок экрана: кнопка
свернутая кнопка разделения.
Как и кнопка меню, один треугольник, указывающий вниз, указывает, что при щелчке крайней правой части кнопки будет раскрываться меню.
Снимок экрана: кнопка
отброшенная кнопка разделения.
В этом примере кнопка разделения используется для консолидации шести вариантов открытой команды. Обычная открытая команда используется большую часть времени, поэтому пользователям обычно не нужно видеть другие команды. Использование кнопки разделения позволяет сэкономить значительное количество места на экране, а также предоставляет широкие возможности выбора.
в отличие от кнопки меню, при нажатии левой части кнопки выполняется действие непосредственно с меткой. Кнопки разделения эффективны в ситуациях, когда следующее действие с определенным инструментом, скорее всего, будет таким же, как и последнее действие. В этом случае метка меняется на последнее действие, как в случае с палитрой цветов:
Снимок экрана: кнопка разделения заливки без команд
В этом примере метка изменяется на последнее действие.
Кнопки обзора Используйте кнопку обзора, чтобы отобразить диалоговое окно, которое поможет пользователям выбрать допустимое значение.
Диалоговые окна, запускаемые кнопкой обзора, помогают пользователям выбирать файлы, папки, компьютеры, пользователей, цвета и т. д. Обычно они объединяются с неограниченным элементом управления, например текстовым полем. они обычно помечены как обзор, другие или более, и всегда имеют многоточие, чтобы указать, что требуются дополнительные сведения.
Снимок экрана: текстовое поле с кнопкой
текстовое поле с кнопкой обзора.
Для окон с множеством кнопок обзора можно использовать короткую версию:
Снимок экрана: короткая кнопка обзора с многоточием
Короткая кнопка обзора.
Кнопки прогрессивного раскрытия Используйте кнопку прогрессивного раскрытия для отображения или скрытия редко используемых параметров.
Скрытие редко используемых параметров до тех пор, пока они не потребуются, называется прогрессивным раскрытием. Двойные шевроны используются для обозначения прогрессивного раскрытия и указывают на направление, в котором будет происходить выявление или скрытие:
Снимок экрана: кнопка со стрелками
После нажатия кнопки ее метка изменится, чтобы указать, что следующий щелчок будет иметь противоположный эффект:
Снимок экрана: кнопка со стрелками
Дополнительные сведения и примеры см. в разделе Прогрессивные средства управления раскрытием информации.
Кнопки направления Используйте кнопку направления, чтобы указать направление, в котором будет выполняться действие.
в этом случае вместо двойного шеврона используется одна угловая скобка:
Снимок экрана: кнопки со стрелками вправо и влево
Кнопка направления указывает направление действия.

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

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

  • Отображение указателя занято, если результат нажатия кнопки команды не является мгновенным. Без обратной связи пользователи могут предположить, что щелчка не произошло, и щелкнуть снова.
  • Если одна и та же кнопка команды отображается в нескольких окнах, попробуйте использовать один и тот же текст метки и клавишу доступа и найдите их примерно в том же месте в каждом окне, когда это возможно.
  • Для кнопок с текстовыми метками используйте минимальную ширину кнопки и стандартную высоту кнопки. Дополнительные сведения см. в разделе Рекомендуемые размеры и интервалы.
  • Для каждого окна сделайте кнопки одинаковой ширины. Если это нецелесообразно, ограничьте количество разных ширин для кнопок с текстовыми метками до двух.
  • Когда другой элемент управления взаимодействует с кнопкой командной строки, например текстовое поле с кнопкой Обзор, укажите связь, разместив кнопку в одном из трех мест:
    • Справа от другого элемента управления и по верхнему краю.
    • Снизу и по левому краю выровнены по левому краю с другим элементом управления.
    • По вертикали между элементами управления, которые взаимодействуют (например, кнопки "Добавить" и "Удалить" между двумя полями взаимодействующих списков).
  • Если несколько кнопок команд взаимодействуют с тем же элементом управления, вертикально сложите их справа от другого элемента управления и по верхнему краю или по горизонтали по левому краю под элементом управления.
  • Если кнопки являются подчиненными другим элементам управления, используйте указанное выше расположение и отключите кнопку подчиненной команды, пока не будет выбран верхний элемент управления.
  • Не используйте узкие, короткие или высокие кнопки с текстовыми метками, так как они, как правило, выглядят непрофессионально. Попробуйте использовать ширину и высоту по умолчанию.

Правильно:снимок экрана кнопки ОК по умолчанию

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

Неправильно:снимок экрана с короткой кнопкой

В этом примере кнопка слишком мала.

Неправильно:снимок экрана: большая квадратная кнопка ОК

В этом примере на кнопке слишком много места вокруг метки.

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

Правильно:снимок экрана: команда поворота с изогнутой стрелкой

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

Правильно:снимок экрана адресной строки со значками и текстом

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

Неправильно:снимок экрана кнопки со значком x и отменой

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

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

Кнопки разделения

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

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

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

схема размеров кнопок в пикселях и dlus

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

Метки

  • Пометка каждой кнопки команды.

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

    Снимок экрана: кнопки

    В этом примере показаны графические кнопки; Внутри эти кнопки имеют метки Назад, Далее и Копировать.

  • Для коротких кнопок обзора (с меткой "...") внутренняя метка должна иметь значение Обзор.

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

    Исключения:

    • Не назначайте клавиши доступа для кнопок ОК и Отмена, так как ВВОД — это клавиша доступа для кнопки по умолчанию (обычно это кнопка ОК), а ESC — это клавиша доступа для отмены. Это упрощает назначение других ключей доступа.
    • Не назначайте клавиши доступа коротким кнопкам обзора (с меткой "..."), так как они не могут быть назначены уникальным образом.
  • Предпочитать определенные метки универсальным. В идеале пользователям не нужно читать что-либо еще, чтобы понять метку. Пользователи гораздо чаще считывают метки кнопок, чем статический текст.

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

    Хорошо:

    Снимок экрана: кнопки

    В этом примере ОК и Отмена являются допустимыми, но неуказанными метками.

    Лучше:

    Снимок экрана с кнопками записи cd и отмены

    В этом примере запись компакт-диска более специфична, чем ОК.

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

    Снимок экрана: кнопки записи компакт-диска и не записывать компакт-диск

    В этом примере вместо параметра Не записывать компакт-диск следует использовать отмену.

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

    • Исключение: Без глаголов допустимы следующие стандартные метки: "Дополнительно", "Назад", "Сведения", "Вперед", "Меньше", "Больше", "Новый", "Нет", "ОК", "Параметры", "Назад", "Свойства", "Параметры" и "Да".
  • Хотя короткие метки предпочтительнее, используйте достаточно текста, чтобы достаточно объяснить команду. Используйте прямой объект (существительное после глагола), если объект не является очевидным из контекста. В идеале пользователям не нужно читать что-либо еще, чтобы понять метку.

    Хорошо:

    Снимок экрана: кнопка с добавлением метки

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

    Лучше: (если добавить не ясно)

    Снимок экрана: кнопка с меткой

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

    Лучший вариант: (если добавить или добавить элементы не ясно)

    Снимок экрана: кнопка с добавлением выбранных элементов

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

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

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

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

    Снимок экрана: кнопка с меткой для скачивания

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

    Снимок экрана: кнопка с меткой

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

    Только одна команда в потоке задач должна быть помечена как now. Таким образом, например, за командой "Скачать сейчас " никогда не должна следовать другая команда "Скачать сейчас ".

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

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

    Снимок экрана: перезагрузка сейчас и перезагрузка позже

    В этом примере параметр Restart Later (Перезапустить позже) неправильно подразумевает, что команда автоматически перезапускается позже.

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

    Неправильно: (если параметры действительно не являются расширенными)

    Снимок экрана: кнопка с расширенной меткой

    В этом примере advanced вводит в заблуждение.

    Правильно:

    Снимок экрана: кнопка с меткой

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

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

  • При запросе вопроса используйте метки, соответствующие вопросу. Не используйте кнопку ОК или Отмена, чтобы ответить на вопросы "Да" или "Нет".

    Правильно:

    Снимок экрана: кнопки

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

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

    Снимок экрана: кнопки

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

  • Завершите метку многоточием, если для выполнения команды требуются дополнительные сведения.

    • Исключение: Графические метки не принимают многоточие.

    Правильно: (если отображается диалоговое окно параметров печати)

    снимок экрана: кнопка печати с многоточием

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

  • Не используйте многоточие, если успешное выполнение действия заключается в том, чтобы просто отобразить другое окно. Следующие команды никогда не принимают многоточие: About, Advanced, Options, Properties, Help.

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

    Снимок экрана: кнопка

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

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

    Правильно:

    Другие цвета...

    Сведения о версии

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

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

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

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

Метка кнопки Значение Ключ доступа
Назад
В мастерах и потоках задач перейдите на предыдущую страницу.
'B'
Обзор...
Отображение диалогового окна для поиска файла или объекта.
"B" или "r"
Параметры
Отображение доступных пользователям вариантов настройки программы.
'O'
Пауза
При выполнении диалоговых окон приостановите задачу.
"P"
Personalize
Настройка основного интерфейса, который имеет решающее значение для личной идентификации пользователя с помощью программы.
"P"
Параметры
Не используйте. Вместо этого используйте параметры.
Не применяется
Свойства
Отображение атрибутов и параметров для объекта .
"P" или первый "r"
Сохранить
Сохраните группу параметров или сохраните файл или объект, используя его текущее имя.
"S"
Сохранить как...
Сохраните файл или объект, используя указанное имя.
Второй "a"
Параметры
Не используйте. Вместо этого используйте параметры.
Не применяется
Устранение неполадок
Не используйте. Вместо этого используйте определенную ссылку на справку.
Не применяется

Рекомендации по подписям кнопок фиксации ("ОК", "Отмена", "Да/Нет", "Закрыть", "Остановить", "Применить", "Далее", "Готово") см. в разделе Текст пользовательского интерфейса.

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

При ссылке на кнопки команд:

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

Пример. Нажмите кнопку Печать , чтобы распечатать документ.