Windows 7 中的命令按钮

注意

此设计指南是为 Windows 7 创建的,尚未针对更高版本的 Windows 进行更新。 原则上大部分准则仍适用,但演示和示例没有反映我们的当前设计准则

使用 Windows 7 中的命令按钮,用户可以立即启动操作。

确定命令按钮的屏幕截图

典型的命令按钮。

当用户按下 Enter 键时,将调用默认命令按钮。 它由开发人员分配的,但在用户选择它时,任何命令按钮都会成为默认按钮。

注意

与布局相关的指南将在单独的文章中介绍。

这是正确的控件吗?

在决定之前,请考虑以下问题:

  • 命令按钮是否用于启动即时操作? 如果没有,请使用另一个控件。
  • 链接会是更好的选择吗? 在下列情况中,请使用链接:
    • 该操作用于导航到另一个页面、窗口或帮助主题。 例外:向导导航使用“后退”和“下一步”命令按钮。
    • 该命令嵌入在文本正文中。
    • 该命令本质上是辅助命令。 也就是说,它与窗口的主要用途无关。 在这种情况下,轻量级命令按钮或链接都是合适的。
    • 该命令是菜单或相关链接组的一部分。
    • 标签很长,由五个或更多个单词组成,从而使命令按钮看起来不协调。
  • 单选按钮和通用命令按钮的组合会是更好的选择吗? 如果存在以下任一情况,单选按钮与通用命令按钮(确定、取消)通常会结合使用,以代替一组特定的命令按钮:
    • 有五个或更多可能的操作。

    • 在做出决策之前,用户需要查看其他信息。

    • 在做出决策之前,用户需要与选项进行交互(可能要查看其他信息)。

    • 用户将选项视为选项,而不是不同的命令。

      正确:对话框、单选按钮和文本的屏幕截图

      在此示例中,单选按钮与“确定”和“取消”按钮相结合,提供有关选项的其他信息。

      不正确:带有命令按钮的消息屏幕截图

      在此示例中,仅靠命令按钮很难让用户做出明智的决策。

设计概念

使用省略号

虽然命令按钮用于即时操作,但执行操作可能需要更多信息。 通过添加按钮标签末尾的省略号来指示需要其他信息的命令(包括确认)。

带省略号的打印命令按钮的屏幕截图

在此示例中,打印...命令显示“打印”对话框以收集详细信息。

不带省略号的打印命令按钮的屏幕截图

相比之下,在此示例中,Print 命令将文档的单个副本打印到默认打印机,而无需进一步的用户交互。

正确使用省略号非常重要,表明用户可以在执行操作之前做出进一步的选择,甚至完全取消该操作。 省略号提供的视觉指示可以让用户毫无顾虑地浏览软件。

这并不意味着每当操作显示另一个窗口时,都应使用省略号。 仅当需要其他信息来执行该操作时,才使用省略号。 因此,隐式谓词为“显示另一个窗口”的任何命令按钮都不需要省略号,例如使用“关于”、“高级”、“帮助”(或任何链接到帮助主题的命令)、“选项”、“属性”或“设置”命令。

通常,用户界面中使用省略号表示不完整。 显示其他窗口的命令不完整;它们必须显示另一个窗口,并且不需要其他信息来执行其操作。 在省略号几乎没有价值的情况下,此方法可以消除屏幕混乱的问题。

注意:在确定命令按钮是否需要省略号时,不要将提升权限的需要作为因素。 提升不是执行命令所需的信息(而是用于权限),并且需要提升时会用安全防护表示。

如果你只做一件事...使用简洁、具体、自我解释的标签,明确描述命令按钮执行的操作,并在适当时使用省略号。

使用模式

命令按钮有多个使用模式:

使用情况 示例
标准命令按钮可以使用标准命令按钮启动即时操作。
标准(灰色)命令按钮的屏幕截图
标准命令按钮。
默认命令按钮 窗口中的默认命令按钮指示用户按下 Enter 键时将激活的命令按钮。
默认(蓝色)命令按钮的屏幕截图
默认命令按钮。
当用户选定时,任何命令按钮都将成为默认按钮。 如果输入焦点位于不是命令按钮的控件上,则具有默认按钮属性的命令按钮将成为默认值。 一个窗口中只能有一个命令按钮是默认值。
轻型命令按钮 轻量级命令按钮类似于标准命令按钮,但其按钮帧仅在鼠标悬停时显示。
所选两个打印按钮之一的屏幕截图
在此示例中,命令具有非常轻量的外观(类似 链接),直到用户将鼠标悬停在命令上,此时该命令使用按钮框绘制。
可以在使用标准命令按钮但又希望避免始终显示按钮框的情况下使用轻型命令按钮。 轻量级命令按钮非常适合想要淡化强调但又不适合使用链接的命令。
菜单按钮 需要一个菜单来显示一小组相关命令时,使用菜单按钮。
格式菜单按钮及其命令的屏幕截图
一个菜单按钮,其中包含一小组相关的命令。
当不需要菜单栏时,例如在对话框、工具栏或其他没有菜单栏的窗口中,使用菜单按钮。 单个向下的三角形表示单击该按钮将会下拉菜单。
拆分按钮 使用拆分按钮合并命令的一组变体,尤其是在大部分时间使用其中一个命令时。
没有命令的打开拆分按钮的屏幕截图
折叠的拆分按钮。
与菜单按钮类似,单个向下三角形表示单击按钮的最右侧部分会下拉菜单。
带命令的打开拆分按钮的屏幕截图
一个下拉拆分按钮。
在此示例中,拆分按钮用于合并打开命令的六个变体。 大多数时间都使用常规打开命令,因此用户通常不需要查看其他命令。 使用拆分按钮可节省大量屏幕空间,同时提供强大的选择。
与菜单按钮不同,单击按钮的左侧部分可直接对标签执行操作。 在具有特定工具的下一步操作可能与上一步操作相同的情况下,拆分按钮有效。 在这种情况下,标签将更改为最后一个操作,就像使用颜色选取器一样:
没有命令的填充拆分按钮的屏幕截图
在此示例中,标签更改为最后一个操作。
浏览按钮 使用浏览按钮显示对话框,以帮助用户选择有效值。
浏览按钮启动的对话框可帮助用户选择文件、文件夹、计算机、用户、颜色等。它们通常与不受约束的控件(如文本框)组合在一起。 它们通常标记为浏览、其他或更多,并且始终用省略号来表示需要更多信息。
带有浏览按钮的文本框屏幕截图
包含浏览按钮的文本框。
对于拥有许多浏览按钮的窗口,可以使用一个短版本:
带省略号的短浏览按钮屏幕截图
短浏览按钮。
渐进式披露按钮 使用渐进式披露按钮显示或隐藏不经常使用的选项。
隐藏不常使用的选项直到需要时才显示,这称为渐进式披露。 双 V 形用于表示渐进式披露,它们指向将要显示或隐藏的方向:
按钮的屏幕截图,其中包含“更多”和向右箭头
单击按钮后,其标签将更改,表示下一次单击将产生相反的效果:
带有“less”和向左箭头的按钮屏幕截图
有关详细信息和示例,请参阅渐进式披露控制
方向按钮 使用方向按钮指示将执行操作的方向。
在这种情况下,使用单个尖括号而不是双 V 形:
向右键和向左键按钮的屏幕截图
方向按钮指示操作方向。

准则

常规

  • 如果单击命令按钮的结果不是即时的,则显示繁忙指针。 如果没有反馈,用户可能会假设单击未发生,然后再次单击。
  • 如果多个窗口中显示相同的命令按钮,请尽量使用相同的标签文本和访问密钥,并在可行的情况下将其放置在每个窗口中大致相同的位置。
  • 对于带有文本标签的命令按钮,请使用最小按钮宽度和标准命令按钮高度。 有关详细信息,请参阅建议的大小和间距
  • 为每个窗口设置相同宽度的命令按钮。 如果这是不切实际的,请将带有文本标签的命令按钮的不同宽度数限制为两种。
  • 当另一个控件与命令按钮(如带有“浏览”按钮的文本框)互操作时,通过将命令按钮置于三个位置之一来表示关系:
    • 与另一个控件的右侧和顶部对齐。
    • 与另一个控件的下方和左侧对齐。
    • 在互操作的控件之间垂直居中(如两个互操作列表框之间的“添加”和“删除”按钮)。
  • 如果多个命令按钮与同一控件互操作,请将它们垂直堆叠到其他控件的右侧并与其顶部对齐,或将它们水平放在控件下方左对齐。
  • 当命令按钮从属于其他控件时,请使用上述放置并禁用从属命令按钮,直到选择了上级控件。
  • 不要对文本标签使用窄、短或高命令按钮,因为它们往往看起来不专业。 尝试使用默认宽度和高度。

正确:默认大小确定按钮的屏幕截图

在此示例中,按钮大小是标准的,并且看起来很专业。

不正确:短确定按钮的屏幕截图

在此示例中,按钮太小。

不正确:大方形确定按钮的屏幕截图

在此示例中,标签周围的按钮空间太多。

  • 避免在命令按钮上组合文本标签和图形。 将文字和图形结合在一起通常会增加不必要的视觉干扰,而且不会提高用户的理解能力。 仅当图形有助于理解时(例如,当它是命令的标准符号时),或者帮助用户可视化命令的结果时,才考虑组合文本和图形。 否则最好使用文本,但文本或图形均可。

正确:带曲线箭头的旋转命令的屏幕截图

在此示例中,箭头图形可帮助用户直观显示命令的结果。

正确:带有图标和文本的地址栏屏幕截图

在此示例中,标准符号与文本相结合,以帮助理解

不正确:带有 x 图标和取消的按钮屏幕截图

在此示例中,cancel 图形不会向文本添加任何内容。

  • 不要使用命令按钮设置状态。 请改用单选按钮或复选框。 命令按钮仅用于启动操作。

拆分按钮

  • 将最有可能的命令设置为默认行为。 如果有多个可能命令,请选择一个不需要额外信息的命令。
  • 如果最有可能的命令是用户的最后选择,请将按钮标签更改为最后的选择。
  • 在菜单中使用粗体文本显示默认命令。 这样做可让用户更轻松地查找默认命令,尤其是在默认命令是动态的或拆分按钮使用图形而不是文本标签时。

默认值

  • 在每个对话框中都包含一个默认命令按钮。 选择最安全(以防止丢失数据或系统访问权限)和最安全的命令作为默认命令。 如果不考虑安全性因素,请选择最可能或最方便的命令。
  • 不要将破坏性操作设为默认命令按钮,除非有可以撤消该命令的简单方法。

按钮尺寸图(以像素和 dlus 为单位)

命令按钮的建议大小和间距。

标签

  • 标记每个命令按钮。

  • 如果按钮只有图形标签,请将其 Name 属性分配给相应的文本标签。 这使辅助技术产品(如屏幕阅读器)为用户提供有关图形的替代信息。

    向上、向下和复制按钮的屏幕截图

    此示例显示图形按钮;这些按钮在内部标记为“上一个”、“下一个”和“复制”。

  • 对于短浏览按钮(标记为“...”),内部标签应为“浏览”。

  • 分配唯一的访问键。 有关指南,请参阅键盘

    异常:

    • 请勿将访问键分配给“确定”和“取消”按钮,因为 Enter 是默认按钮(通常是“确定”按钮)的访问密钥,Esc 是“取消”的访问键。 这样做会使其他访问键更易于分配。
    • 不要将访问键分配给短浏览按钮(标记为“...”),因为它们无法唯一分配。
  • 优先选择特定标签,而不是通用标签。 理想情况下,用户无需阅读其他任何内容即可了解标签。 比起静态文本,用户更有可能阅读命令按钮标签。

    • 例外:如果取消的含义明确,请勿重命名“取消”按钮。 用户不必读取所有按钮来确定哪个按钮取消操作。 但是,如果不清楚取消的是什么操作,例如当有多个挂起的操作时,请重命名为“取消”。

    可接受的:

    显示“确认”和“取消”按钮的屏幕截图。

    在此示例中,“确定”和“取消”是可接受但不具体的标签。

    更好的:

    刻录 CD 和取消按钮的屏幕截图

    在此示例中,刻录 CD 比确认更具体。

    错误:

    刻录 CD 和不刻录 CD 按钮的屏幕截图

    在此示例中,应使用取消而不是请勿刻录 CD。

  • 使用命令性谓词作为标签的开头,并清楚地描述按钮执行的操作。 不要使用结尾的标点符号。

    • 例外: 以下标准标签可以不带动词:高级、后退、详细信息、前进、更少、更多、新建、下一步、否、确定、选项、上一步、属性、设置和是。
  • 虽然短标签是首选,但应使用足够的文本来充分解释命令。 当对象在上下文中不明显时,请使用直接宾语(动词后面的名词)。 理想情况下,用户无需阅读其他任何内容即可了解标签。

    可接受的:

    带有添加标签的按钮屏幕截图

    在此示例中,如果短标签在上下文中的含义显而易见,则可以接受。

    更好:(如果添加不清楚)

    带有“添加项目”标签的按钮屏幕截图

    在此示例中,向动词添加名词有助于用户理解。

    最佳:(如果“添加”或“添加项”不清楚)

    带有“添加选定项目”的按钮屏幕截图

    在此示例中,标签不言自明。

  • 使用句子样式的大写。 这样做更适用于 Windows toneWindows tone,以及命令按钮较短短语的使用。

    • 例外: 对于传统应用程序,如有必要,可以使用标题样式的大小写,以避免混合大小写样式。
  • 不要在命令按钮标签中使用“现在”,因为该命令的即时性会被认为是理所当然的。

    • 例外:必要时,“现在”可用于区分启动任务的命令和立即执行任务的命令。

    带有下载标签的按钮屏幕截图

    在此示例中,单击命令按钮将转到允许用户下载的窗口或页面。

    带有现在标签的按钮屏幕截图

    在此示例中,单击命令按钮执行下载。

    一个任务流程中只能有一个命令标为“现在”。 因此,例如,现在下载命令之后绝不能再出现另一个现在下载命令。

  • 如果命令按钮标签中的“稍后”意味着不会发生的操作,请不要使用“稍后”。 例如,不要使用“稍后安装”(与“现在安装”相反),除非该命令稍后安装。 请改用“请勿安装”或“取消”。

    错误:

    现在重启和稍后重启的屏幕截图

    在此示例中,“稍后重启”错误地暗示命令稍后会自动重启。

  • 高级按钮仅用于与高级用户相关或需要高级用户知识的选项。 不要将高级按钮用于被视为技术先进的功能。 例如,打印机的装订功能不是高级选项,但其颜色管理系统属于。

    不正确:(如果选项确实不是高级选项)

    带有高级标签的按钮屏幕截图

    在此示例中,高级具有误导性。

    更正

    带有“更多选项”标签的按钮屏幕截图

    在此示例中,标签更具体、更准确。

  • 对于打开其他窗口的命令按钮,请选择使用部分或所有辅助窗口标题栏文本的标签。 例如,标有“浏览”的命令按钮可能会打开名为“浏览文件夹”的对话框。 在整个任务中使用相同的术语有助于让用户保持方向感。

  • 提出问题时,请使用与问题匹配的标签。 请勿使用确定/取消回答是/否问题。

    更正

    “是”和“否”按钮的屏幕截图

    在此示例中,按钮回答了问题。

    错误:

    “确定”和“取消”按钮的屏幕截图

    在此示例中,按钮未回答问题。

  • 如果命令需要其他信息才能执行,请使用省略号结束标签。

    • 例外:图形标签不采用省略号。

    正确:(如果显示“打印选项”对话框)

    带省略号的打印按钮的屏幕截图

    在此示例中,单击按钮后,将显示打印选项对话框,并需要用户提供更多信息。

  • 当操作成功完成只是显示另一个窗口时,请勿使用省略号。 以下命令从不使用省略号:关于、高级、选项、属性、帮助。

    错误:

    带省略号的选项按钮的屏幕截图

    在此示例中,单击按钮后,将显示选项对话框,但不需要用户提供更多信息。

  • 如果存在歧义(例如命令标签缺少动词),请根据最有可能的用户操作做出决定。 如果查看窗口是一个常见操作,请不要使用省略号。

    更正

    其他颜色…

    版本信息

    在第一个示例中,用户最有可能选择一种颜色,因此使用省略号是正确的。 第二个示例中,用户最有可能查看版本信息,因此不需要省略号。

  • 对于浏览按钮,当窗口中有多个浏览按钮时,请使用短浏览按钮(标记为“...”)。 如果要在网格中显示浏览按钮,请始终使用简写版本。

  • 对于方向按钮,请使用单个尖括号,并使其指向操作发生的方向。

下表列出了一些常见的命令按钮标签及其用法。

按钮标签 含义 访问密钥
后退
在向导和任务流中,转到上一页。
'B'
浏览...
显示用于查找文件或对象的对话框。
“B”或“r”
选项
显示用户可用于自定义程序的选项。
“O”
暂停
在进度对话框中,暂停任务。
“P”
个性化设置
定制对用户个人识别程序至关重要的核心体验。
“P”
首选项
请不要使用。 请改用选项。
不适用。
属性
显示对象的属性和设置。
“P”或第一个“r”
保存
保存一组设置,或使用其当前名称保存文件或对象。
“S”
另存为…
使用指定名称保存文件或对象。
第二个“a”
设置
请不要使用。 请改用选项。
不适用。
故障排除
请不要使用。 请改用特定的帮助链接。
不适用。

有关提交按钮标签的指南(确定、取消、是/否、关闭、停止、应用、下一步、结束、完成),请参阅用户界面文本

文档

引用命令按钮时:

  • 使用准确的标签文本,包括其大写,但不包括访问键下划线或省略号。 不要包含单词按钮。
  • 若要描述用户交互,请使用点击。
  • 如果可能,请使用粗体文本设置标签的格式。 否则,仅在需要时才将标签放在引号中,以防止混淆。

示例:单击打印以打印文档。