Botões de comando no Windows 7

Observação

Este guia de design foi criado para o Windows 7 e não foi atualizado para versões mais recentes do Windows. Grande parte das diretrizes ainda se aplica em princípio, mas a apresentação e os exemplos não refletem nossas diretrizes de design atuais.

Com os botões de comando no Windows 7, os usuários iniciam ações imediatas.

Um botão de comando típico.

O botão de comando padrão é invocado quando os usuários pressionam a tecla Enter. Ele é atribuído pelo desenvolvedor, mas qualquer botão de comando se torna o padrão quando os usuários usam a tecla Tab para acessá-lo.

Observação

As diretrizes relacionadas ao layout são apresentadas em um artigo separado.

Esse é o controle correto?

Para decidir, considere estas perguntas:

• O botão de comando é usado para iniciar uma ação imediata? Caso contrário, use outro controle.
• Um link seria uma escolha melhor? Use um link se:
  • A ação é navegar até outra página, janela ou tópico da Ajuda. Exceção: a navegação do assistente usa os botões de comando Voltar e Avançar.
  • O comando é incorporado a um corpo de texto.
  • O comando é de natureza secundária. Ou seja, não se relaciona com a finalidade principal da janela. Nesse caso, um botão de comando leve ou um link seria apropriado.
  • O comando faz parte de um menu ou grupo de links relacionados.
  • O rótulo é longo, consistindo em cinco ou mais palavras, dando a um botão de comando uma aparência estranha.
• Uma combinação de botões de opção e botões de comando genéricos seria uma escolha melhor? Frequentemente, os botões de opção são usados em conjunto com botões de comando genéricos (OK, Cancelar) no lugar de um conjunto de botões de comando específicos quando qualquer uma das seguintes condições é verdadeira:

  • Existem cinco ou mais ações possíveis.

  • Os usuários precisam visualizar informações adicionais antes de tomar uma decisão.

  • Os usuários precisam interagir com as opções (talvez para ver informações adicionais) antes de tomar uma decisão.

  • Os usuários veem as opções como opções em vez de comandos diferentes.

    Correto:

    Neste exemplo, os botões de opção são combinados com os botões OK e Cancelar para fornecer mais informações sobre as opções.

    Incorreto:

    Neste exemplo, os botões de comando por si só dificultam que os usuários tomem uma decisão fundamentada.

Conceitos de design

Usar reticências

Embora os botões de comando sejam usados para ações imediatas, mais informações podem ser necessárias para executar a ação. Indique um comando que precisa de informações adicionais (incluindo confirmação) adicionando reticências no final do rótulo do botão.

Neste exemplo, o comando Imprimir... exibe uma caixa de diálogo Imprimir para coletar mais informações.

Por outro lado, neste exemplo, o comando Imprimir imprime uma única cópia de um documento na impressora padrão sem qualquer interação adicional do usuário.

O uso adequado de reticências é importante para indicar que os usuários podem fazer outras escolhas antes de executar a ação ou até mesmo cancelar a ação completamente. A sugestão visual oferecida por reticências permite que os usuários explorem seu software sem medo.

Isso não significa que você deva usar reticências sempre que uma ação exibir outra janela. Use reticências somente quando informações adicionais forem necessárias para executar a ação. Consequentemente, qualquer botão de comando cujo verbo implícito seja "mostrar outra janela" não recebe reticências, como com os comandos Sobre, Avançado, Ajuda (ou qualquer outro comando vinculado a um tópico da Ajuda), Opções, Propriedades ou Configurações.

Geralmente, as reticências são usadas em interfaces do usuário para indicar incompletude. Os comandos que mostram outras janelas não estão incompletos, eles devem exibir outra janela, e informações adicionais não são necessárias para executar sua ação. Essa abordagem elimina a desordem da tela em situações em que as reticências têm pouco valor.

Observação: ao determinar se um botão de comando precisa de reticências, não use a necessidade de elevar privilégios como um fator. A elevação não é uma informação necessária para executar um comando (em vez disso, é para permissão), e a necessidade de elevar é indicada com a blindagem de segurança.

Se você fizer apenas uma coisa... Use um rótulo conciso, específico e autoexplicativo que descreva claramente a ação que o botão de comando executa e use reticências quando apropriado.

Padrões de uso

Os botões de comando têm vários padrões de uso:

Uso	Exemplo
Botões de comando padrão Você pode usar botões de comando padrão para iniciar uma ação imediata.	Um botão de comando padrão.
Botões de comando padrão O botão de comando padrão em uma janela indica o botão de comando que será ativado quando os usuários pressionarem a tecla Enter.	Um botão de comando padrão. Qualquer botão de comando se torna o padrão quando os usuários usam a tecla tab para acessá-lo. Se o foco de entrada estiver em um controle que não seja um botão de comando, o botão de comando com o atributo de botão padrão se tornará o padrão. Apenas um botão de comando em uma janela pode ser o padrão.
Botões de comando leves Um botão de comando leve é semelhante a um botão de comando padrão, exceto que seu quadro de botão é mostrado apenas ao passar o mouse.	Neste exemplo, o comando tem uma aparência muito leve (semelhante a um link) até que o usuário passe o mouse sobre o comando, momento em que ele é desenhado com um quadro de botão. Você pode usar botões de comando leves em situações em que usaria um botão de comando padrão, mas deseja evitar sempre mostrar o quadro do botão. Botões de comando leves são ideais para comandos que você deseja enfatizar menos e usar um link não seria apropriado.
Botões de menu Use um botão de menu quando precisar de um menu para um pequeno conjunto de comandos relacionados.	Um botão de menu com um pequeno conjunto de comandos relacionados. Use um botão de menu quando uma barra de menus for indesejável, como em uma caixa de diálogo, barra de ferramentas ou outra janela que não tenha uma barra de menus. Um único triângulo apontando para baixo indica que clicar no botão abrirá um menu.
Botões de divisão Use um botão de divisão para consolidar um conjunto de variações de um comando, especialmente quando um dos comandos é usado na maioria das vezes.	um botão de divisão recolhido. como um botão de menu, um único triângulo apontando para baixo indica que clicar na parte mais à direita do botão abrirá um menu. um botão de divisão suspenso. neste exemplo, um botão de divisão é usado para consolidar seis variações do comando Abrir. O comando regular Abrir é usado na maioria das vezes, portanto, os usuários normalmente não precisam ver os outros comandos. usar um botão de divisão economiza uma quantidade significativa de espaço na tela, além de fornecer opções eficientes. ao contrário de um botão de menu, clicar na parte esquerda do botão executa a ação diretamente no rótulo. os botões de divisão são eficazes em situações em que a próxima ação com uma ferramenta específica provavelmente será a mesma que a última ação. nesse caso, o rótulo é alterado para a última ação, como acontece com um seletor de cores: Neste exemplo, o rótulo é alterado para a última ação.
Botões de navegação Use um botão de navegação para exibir uma caixa de diálogo para ajudar os usuários a selecionar um valor válido.	as caixas de diálogo iniciadas por um botão de navegação ajudam os usuários a selecionar arquivos, pastas, computadores, usuários, cores e assim por diante. eles são normalmente combinados com um controle irrestrito, como uma caixa de texto. eles geralmente são rotulados como procurar, outros ou mais e sempre têm reticências para indicar que mais informações são necessárias. uma caixa de texto com um botão de navegação. para janelas que têm muitos botões de navegação, você pode usar uma versão curta: Um botão de navegação curto.
Botões de divulgação progressiva Use um botão de divulgação progressiva para mostrar ou ocultar opções usadas com pouca frequência.	ocultar opções usadas com pouca frequência até que sejam necessárias é chamado de divulgação progressiva. divisas duplas são usadas para indicar a divulgação progressiva e apontam na direção em que a revelação ou ocultação ocorrerá: depois que o botão é clicado, seu rótulo muda para indicar que o próximo clique terá o efeito oposto: Para obter mais informações e exemplos, consulte Controles de divulgação progressiva.
Botões direcionais Use um botão direcional para indicar a direção em que uma ação ocorrerá.	nesse caso, um único colchete angular é usado em vez de uma divisa dupla: Um botão direcional indica a direção da ação.

Diretrizes

Geral

• Exiba um ponteiro ocupado se o resultado de clicar em um botão de comando não for instantâneo. Sem feedback, os usuários podem presumir que o clique não aconteceu e clicar novamente.
• Se o mesmo botão de comando aparecer em mais de uma janela, tente usar o mesmo texto de rótulo e tecla de acesso e localize-o aproximadamente no mesmo local em cada janela quando possível.
• Para botões de comando com rótulos de texto, use uma largura mínima de botão e a altura padrão do botão de comando. Para obter mais informações, confira Dimensionamento e espaçamento recomendados.
• Para cada janela, faça com que os botões de comando tenham a mesma largura. Se isso for impraticável, limite a dois o número de larguras diferentes para botões de comando com rótulos de texto.
• Quando outro controle interopera com um botão de comando, como uma caixa de texto com um botão de navegação, indique a relação colocando o botão de comando em um dos três locais:
  • À direita e alinhado à parte superior do outro controle.
  • Abaixo e alinhado à esquerda com o outro controle.
  • Centralizado verticalmente entre controles que interoperam (como botões Adicionar e Remover entre duas caixas de listagem interoperacionais).
• Se vários botões de comando interoperarem com o mesmo controle, empilhe-os verticalmente à direita e alinhados ao outro controle ou coloque-os alinhados horizontalmente à esquerda sob o controle.
• Quando os botões de comando estiverem subordinados a outros controles, use o posicionamento acima e desative o botão de comando subordinado até que o controle superior seja selecionado.
• Não use botões de comando estreitos, curtos ou altos com rótulos de texto porque eles tendem a parecer pouco profissionais. Tente trabalhar com as larguras e alturas padrão.

Correto:

Neste exemplo, o tamanho do botão é padrão e parece profissional.

Incorreto:

Neste exemplo, o botão é muito pequeno.

Incorreto:

Neste exemplo, o botão tem muito espaço ao redor do rótulo.

• Evite combinar rótulos de texto e gráficos em botões de comando. A combinação de texto e gráficos geralmente adiciona confusão visual desnecessária e não melhora a compreensão do usuário. Considere combinar texto e elementos gráficos somente quando o elemento gráfico ajudar na compreensão, como no caso de um símbolo padrão para o comando ou em que ajuda os usuários a visualizar os resultados do comando. Caso contrário, prefira texto, mas use texto ou elementos gráficos.

Correto:

Neste exemplo, o gráfico de seta ajuda os usuários a visualizar os resultados do comando.

Correto:

Neste exemplo, os símbolos padrão são combinados com o texto para ajudar na compreensão

Incorreto:

Neste exemplo, o elemento gráfico de cancelamento não acrescenta nada ao texto.

• Não use botões de comando para definir o estado. Em vez disso, use botões de opção ou caixas de seleção. Os botões de comando são apenas para iniciar ações.

Botões de divisão

• Torne o comando mais provável o comportamento padrão. Se houver mais de um comando provável, escolha um que não exija informações adicionais.
• Se o comando mais provável for a última seleção do usuário, altere o rótulo do botão para a última seleção.
• Exiba o comando padrão usando texto em negrito no menu. Isso torna mais fácil para os usuários encontrarem o comando padrão, especialmente quando o comando padrão é dinâmico ou o botão de divisão usa um elemento gráfico em vez de um rótulo de texto.

Valores padrão

• Inclua um botão de comando padrão em cada caixa de diálogo. Selecione o comando mais seguro (para evitar perda de dados ou acesso ao sistema) para ser o padrão. Se a segurança e a proteção não forem fatores, selecione o comando mais provável ou conveniente.
• Não transforme o botão de comando padrão em uma ação destrutiva a menos que haja uma maneira fácil de desfazer o comando.

Dimensionamento e espaçamento recomendados

Dimensionamento e espaçamento recomendados para botões de comando.

Rótulos

• Rotule todos os botões de comando.

• Se o botão tiver apenas um rótulo gráfico, atribua sua propriedade Name a um rótulo de texto apropriado. Isso permite que produtos de tecnologia assistencial, como leitores de tela, forneçam aos usuários informações alternativas sobre o gráfico.

  

  Este exemplo mostra botões gráficos. Internamente, esses botões são rotulados como Anterior, Próximo e Copiar.

• Para botões de navegação curtos (rotulados com "..."), o rótulo interno deve ser Procurar.

• Atribua uma chave de acesso exclusiva. Para obter diretrizes, consulte Teclado.

  Exceções:

  • Não atribua teclas de acesso aos botões OK e Cancelar, pois Enter é a tecla de acesso para o botão padrão (que geralmente é o botão OK) e Esc é a tecla de acesso para Cancelar. Isso facilita a atribuição das outras chaves de acesso.
  • Não atribua teclas de acesso a botões de navegação curtos (rotulados com "..."), pois eles não podem ser atribuídos exclusivamente.

• Prefira rótulos específicos em vez dos genéricos. O ideal é que os usuários não precisem ler mais nada para entender o rótulo. Os usuários são muito mais propensos a ler rótulos de botão de comando do que texto estático.

  • Exceção: não renomeie o botão Cancelar se o significado de cancelar for inequívoco. Os usuários não devem ter que ler todos os botões para determinar qual botão cancela uma ação. No entanto, renomeie Cancelar se não estiver claro qual ação está sendo cancelada, como quando há várias ações pendentes.

  Aceitável:

  

  Neste exemplo, OK e Cancelar são rótulos aceitáveis, mas não específicos.

  Melhor:

  

  Neste exemplo, Gravar CD é mais específico do que OK.

  Incorreto:

  

  Neste exemplo, Cancelar deve ser usado em vez de Não gravar CD.

• Comece os rótulos com um verbo imperativo e descreva claramente a ação que o botão executa. Não use pontuação final.

  • Exceção: os seguintes rótulos padrão são aceitáveis sem verbos: Avançado, Voltar, Detalhes, Avançar, Menos, Mais, Novo, Próximo, Não, OK, Opções, Anterior, Propriedades, Configurações e Sim.

• Embora os rótulos curtos sejam preferidos, use texto suficiente para explicar o comando. Use um objeto direto (um substantivo após o verbo) quando o objeto não for aparente no contexto. O ideal é que os usuários não precisem ler mais nada para entender o rótulo.

  Aceitável:

  

  Neste exemplo, um rótulo curto é aceitável se seu significado no contexto for prontamente aparente.

  Melhor: (se Adicionar não estiver claro)

  

  Neste exemplo, adicionar um substantivo ao verbo ajuda na compreensão dos usuários.

  Melhor: (se Adicionar ou Adicionar itens não estiverem claros)

  

  Neste exemplo, o rótulo é autoexplicativo.

• Use capitalizaçãono estilo de frase. Isso é mais apropriado para o tom do Windowstom do Windows e o uso de frases curtas para botões de comando.

  • Exceção: para aplicativos legados, você pode usar maiúsculas e minúsculas, se necessário, para evitar a mistura de estilos de maiúsculas e minúsculas.

• Não use Agora em rótulos de botão de comando porque o imediatismo do comando pode ser subestimado.

  • Exceção: quando necessário, use Agora para diferenciar comandos que iniciam uma tarefa de comandos que executam uma tarefa imediatamente.

  

  Neste exemplo, clicar no botão de comando vai para uma janela ou página que permite que os usuários façam o download.

  

  Neste exemplo, clicar no botão de comando executa o download.

  Apenas um comando em um fluxo de tarefas deve ser rotulado com Agora. Assim, por exemplo, um comando Baixar agora nunca deve ser seguido por outro comando Baixar agora.

• Não use Depois nos rótulos de botão de comando se isso implicar uma ação que não acontecerá. Por exemplo, não use Instalar depois (em contraste com Instalar agora), a menos que esse comando faça a instalação posteriormente. Em vez disso, use Não instalar ou Cancelar.

  Incorreto:

  

  Neste exemplo, Reiniciar depois implica incorretamente que o comando é reiniciado automaticamente posteriormente.

• Use um botão Avançado apenas para opções relevantes para usuários avançados ou que exijam conhecimento avançado do usuário. Não use um botão Avançado para recursos considerados tecnologicamente avançados. Por exemplo, o recurso de grampeamento de uma impressora não é uma opção avançada, mas seu sistema de gerenciamento de cores sim.

  Incorreto: (se as opções realmente não forem avançadas)

  

  Neste exemplo, Avançado é enganoso.

  Correto:

  

  Neste exemplo, o rótulo é mais específico e preciso.

• Para botões de comando que abrem outras janelas, escolha um rótulo que use parte ou todo o texto da barra de título da janela secundária. Por exemplo, um botão de comando chamado Procurar pode abrir uma caixa de diálogo intitulada Procurar pasta. Usar a mesma terminologia em toda a tarefa ajuda a manter os usuários orientados.

• Ao fazer uma pergunta, use rótulos que correspondam à pergunta. Não use OK/Cancelar para responder a perguntas Sim/Não.

  Correto:

  

  Neste exemplo, os botões respondem à pergunta.

  Incorreto:

  

  Neste exemplo, os botões não respondem à pergunta.

• Termine o rótulo com reticências se o comando exigir informações adicionais para ser executado.

  • Exceção: os rótulos gráficos não aceitam reticências.

  Correto: (se uma caixa de diálogo Opções de impressão for exibida)

  

  Neste exemplo, depois que o botão é clicado, a caixa de diálogo Opções de impressão é exibida e requer mais informações do usuário.

• Não use reticências quando a conclusão bem-sucedida da ação for simplesmente exibir outra janela. Os seguintes comandos nunca recebem reticências: Sobre, Avançado, Opções, Propriedades, Ajuda.

  Incorreto:

  

  Neste exemplo, depois que o botão é clicado, a caixa de diálogo Opções é exibida, mas não são necessárias mais informações do usuário.

• Em caso de ambiguidade (por exemplo, o rótulo do comando não tem um verbo), decida com base na ação mais provável do usuário. Se simplesmente visualizar a janela é uma ação comum, não use reticências.

  Correto:

  Mais cores...

  Informações da versão

  No primeiro exemplo, os usuários provavelmente escolherão uma cor, portanto, usar reticências é correto. No segundo exemplo, os usuários provavelmente visualizarão as informações da versão, tornando as reticências desnecessárias.

• Para botões de navegação, use botões de navegação curtos (rotulados com "...") quando houver mais de dois botões de navegação em uma janela. Sempre use a versão curta quando quiser exibir um botão de navegação em uma grade.

• Para botões direcionais, use um único colchete angular e faça com que ele aponte na direção em que a ação ocorre.

A tabela a seguir mostra alguns rótulos comuns de botão de comando e seu uso.

Rótulo do botão	Significado	Chave de acesso
Voltar	Em assistentes e fluxos de tarefas, vá para a página anterior.	'B'
Procurar...	Exiba uma caixa de diálogo para procurar um arquivo ou objeto.	"B" ou "r"
Opções	Exiba as opções disponíveis para os usuários personalizarem um programa.	'O'
Pausar	Nas caixas de diálogo em andamento, suspenda a tarefa.	"P"
Personalizar	Personalize uma experiência principal que seja crucial para a identificação pessoal do usuário com um programa.	"P"
Preferências	Não usar. Em vez disso, use Opções.	Não aplicável.
Propriedades	Exiba os atributos e as configurações de um objeto.	"P" ou primeiro "r"
Salvar	Salve um grupo de configurações ou salve um arquivo ou objeto usando seu nome atual.	"S"
Salvar como...	Salve um arquivo ou objeto usando um nome especificado.	Segundo "a"
Configurações	Não usar. Em vez disso, use Opções.	Não aplicável.
Solucionar problemas	Não usar. Em vez disso, use um link de Ajuda específico.	Não aplicável.

Para obter diretrizes sobre rótulos de botão de confirmação (OK, Cancelar, Sim/Não, Fechar, Parar, Aplicar, Avançar, Concluir, Concluído), consulte Texto da interface do usuário.

Documentação

Ao se referir a botões de comando:

• Use o texto exato do rótulo, incluindo suas letras maiúsculas, mas não inclua o sublinhado ou as reticências da tecla de acesso. Não inclua o botão de palavra.
• Para descrever a interação do usuário, use Clicar.
• Quando possível, formate o rótulo usando texto em negrito. Caso contrário, coloque o rótulo entre aspas somente se necessário para evitar confusão.

Exemplo: clique em Imprimir para imprimir o documento.