web-development-kb-pt.site

Quando devo usar uma caixa de seleção em vez de botões de opção?

Eu sei que uma caixa de seleção ocupa menos espaço e é boa para muitas opções. Mas deveria haver influências mais profundas na minha escolha que o espaço? Existem estudos que mostram os usuários preferindo um ou outro?

Há também o problema de caixas de seleção com seleção múltipla versus caixas de seleção em html, que também podem ser discutidas aqui, visto que a resposta provavelmente será a mesma.

53
Gordon Gustafson

Eu uso select quando o usuário não precisa conhecer todas as opções alternativas disponíveis. A sugestão automática é útil para uma lista longa. Geralmente, eles sabem o que querem e selecionam economizar espaço. Exemplo: Escolha um "Estado" como Califórnia ou Nova York. Você nunca usaria botões de opção.

Eu uso botões de opção quando as alternativas são importantes. Quando quero que o usuário veja o que NÃO está escolhendo. Os botões de opção permitem expandir a seleção e até usar texto mais longo.

Regra geral: se é uma lista longa ou as alternativas não são tão importantes, use um select.

78
Glen Lipka

As diretrizes de interface do usuário, como MS, Apple, Gnome etc., geralmente oferecem sugestões bastante claras sobre isso:

  • Botões de opção: menos de 5 opções

  • Caixa de seleção: 6 a 10 opções

  • Lista rolável: 11 ou mais opções ou
    • Precisa apoiar arrastar e soltar na lista
    • o número de elementos varia

Além disso, você pode usar a caixa de seleção quando precisar economizar espaço ou as opções padrão geralmente são boas o suficiente, portanto os usuários raramente precisam examinar suas escolhas.

Em terceiro lugar, pode ser usado por dias da semana, meses, etc. Isso é coisas em que você sabe que opções você tem sem mostrar todas elas. Se eu vir "Fevereiro" em uma caixa de seleção, posso adivinhar quais serão as outras opções.

Justificativa para usar um elemento da GUI sobre outro

Em geral, botões de opção geralmente são preferidos porque os usuários podem ver todas as suas opções imediatamente. No entanto, mostrar todas as opções pode ocupar muito espaço valioso na interface do usuário. É por isso que a maioria das diretrizes sugere o uso de outros métodos de seleção quando há muitas opções.

Por exemplo. a lista rolável pode mostrar um número arbitrário de opções sem ocupar muito espaço. A desvantagem é que você não pode ver todas as opções.

Um marque a caixa é diferente porque o usamos quando mostramos ao usuário que todas as opções não são tão importantes. Por exemplo. quando o usuário pode adivinhar as opções ou raramente precisará alterar as configurações padrão. O caixa de seleção está basicamente lá para mostrar ao usuário qual é a configuração. No entanto, quando existem muitas opções, um caixa de seleção pode ser complicado de navegar e, portanto, um lista rolável seria preferível.

13
Erik Engheim

Além do espaço e do número de opções, realmente não há uma grande diferença. Uma coisa que eu gosto nos botões de opção é que você pode estilizá-los para parecer botões grandes, o que pode ser útil para interfaces de toque. Se você tiver apenas algumas opções, seria muito mais fácil pressionar um botão grande do que pressionar o pequeno menu suspenso e pressionar a pequena opção.

No que diz respeito às caixas de seleção com seleções múltiplas x, eu realmente prefiro não usar as seleções múltiplas. Só porque você precisa usar uma combinação de teclas junto com o clique do mouse. Muitos usuários desconhecem como os atalhos funcionam e não conseguiriam selecionar várias opções.

12
LoganGoesPlaces

Outra diferença entre as duas entradas que geralmente são ignoradas: se um botão de opção não for selecionado, ele não será repassado no envio do formulário. Ou, de outra forma, os botões de opção oferecem a opção de não selecionar nenhuma opção.

Com uma lista suspensa (caixa de seleção), você pode ter uma opção sem valor (em branco, "") e torná-la o padrão, mas se um usuário deixar essa opção intocada, estará efetivamente dizendo "minha resposta está em branco", pois o o formulário passa "my_input_name: ''". Ao ter um botão de opção, você pode oferecer uma opção como "N/A" ou "Nenhuma das opções acima" que um usuário pode escolher explicitamente e, portanto, distinguir entre o usuário selecionando "-blank-" e um usuário pulando a pergunta/optando para não responder (Essa distinção se torna uma verdadeira pickle na lógica do DB de nível inferior ao distinguir entre um campo armazenado com o valor NULL versus o valor vazio (em branco)).

No outro lado desse recurso dos botões de opção, há outra coisa que muitas vezes esquece dos botões de opção: você não pode responder à pergunta. Se você tem um campo de rádio como:

Gênero Masculino Feminino ()

um usuário pode pular a pergunta e o campo nem é passado em branco. Mas se um usuário seleciona masculino, agora eles estão presos. Eles podem mudar a resposta para feminino ou deixá-lo como masculino. (Para formulários HTML, eles também podem aprender um pouco sobre o uso do console do navegador, mas isso fica fora do design da interface do usuário/UX e da programação e segurança).

Portanto, com esse recurso "não recupere" dos botões de opção, você terá algumas opções que um menu suspenso não forneceria:

  1. Capacidade de distinguir "não respondeu" de "minha resposta está em branco"
  2. Capacidade de apresentar todas as opções sem forçar uma opção em branco ou padrão. Com as listas suspensas, você precisa deixar em branco uma opção e depois lidar com essa opção que não é realmente uma opção válida para o usuário ou pré-selecionar uma opção para o usuário (como a primeira opção na lista), que corre o risco de ser enviado não intencionalmente se o usuário deixar de fazer uma seleção (talvez eles pretendam voltar a ela, talvez não a tenham visto) ou se for deixado desmarcado intencionalmente devido à falta de uma opção em branco. Em ambos os casos, os dados agora são menos valiosos, pois a opção "padrão" pode ou não ser a resposta verdadeira (se você não acredita em mim, consulte seus dados para obter uma proporção de linhas com a opção padrão para o campo versus linhas com outra opção. Você ficará surpreso com quantas pessoas aparentemente moram no Alabama quando essa é a opção padrão).

  3. Melhor controle sobre a manipulação da validação de formulários, especificamente campos "obrigatórios". Não existe um campo suspenso obrigatório. Existem apenas campos suspensos em que a opção em branco não é válida. Obviamente, seria melhor fornecer uma lista suspensa de estados com uma opção em branco e tratar o espaço em branco como não selecionando um estado, em vez de estourar seu formulário para evitar uma opção em branco, mas para perguntas que tenham no máximo 4-5 respostas, é é melhor fornecer a lista completa de opções em vez de usar uma lista suspensa com uma opção em branco que não é realmente uma opção e, em seguida, lidar com a distinção entre branco e não selecionado.

Opinião de bônus:

Da mesma forma que as idéias acima, também é realmente idiota usar menus suspensos em vez de caixas de seleção. Um menu suspenso com as opções "Sim/Não" ou "Verdadeiro/Falso" me faz revirar os olhos sempre. O motivo somente para usar uma lista suspensa é se você fornecer uma terceira opção em branco e ela for considerada uma seleção válida. E mesmo assim, um botão de opção provavelmente seria a melhor escolha.

4
Anthony

Eu estava pensando sobre isso sozinho para uma interação e acho que outro benefício dos botões de opção é que eles podem fornecer um pouco de espaço extra para texto de suporte ou explicação sobre as opções possíveis.

3
annemarie lock

Eu uso caixas de seleção (caixa de seleção) para ativar a seleção de várias opções ou ao fazer uma escolha binária.

Prática recomendada Para usar caixas de seleção:

  1. Considere definir um padrão para a opção que os usuários selecionam 80% ou mais do tempo.
  2. Evite opt-ins padrão, como se inscrever no marketing por email.

Eu uso Botões de opção para ativar um item de duas ou mais opções mutuamente exclusivas.

Best Practice Para usar os botões de opção:

  1. Não use botões de opção para iniciar ações.
  2. Sempre use dois ou mais botões de opção
1
Manoj Kumar

Os botões de opção são geralmente preferíveis até que você tenha mais do que algumas opções. Eles exigem apenas um clique em comparação com dois. Os botões de opção também são melhores para aninhar subopções.

1
Tom R

Se houver apenas algumas opções, os botões de opção vencem pela facilidade de uso e seleção rápida. o uso de uma seleção suspensa impede que o usuário veja todas as opções até chegar a esse campo.

Essa pergunta pode ser aplicada igualmente a caixas de seleção versus seleções múltiplas.

0
ericslaw