라디오 버튼 대신 선택 상자를 언제 사용해야합니까?
선택 상자는 공간을 덜 차지하고 많은 옵션에 좋습니다. 그러나 공간보다 내 선택에 더 깊은 영향이 있어야합니까? 사용자가 하나 또는 다른 것을 선호한다는 연구 결과가 있습니까?
Html에는 다중 선택 대 확인란의 문제가 있으며 여기에서도 설명이 가능합니다.
사용자가 사용 가능한 모든 대체 선택 사항을 알 필요가없는 경우 select을 사용합니다. 자동 제안은 긴 목록에 유용합니다. 일반적으로 원하는 것을 알고 공간을 절약합니다. 예 : 캘리포니아 또는 뉴욕과 같은 "주"를 선택하십시오. 라디오 버튼은 절대 사용하지 않습니다.
대안이 중요한 경우 라디오 버튼을 사용합니다. 사용자가 선택하지 않은 것을보고 싶을 때. 라디오 버튼을 사용하면 선택 영역을 확장하고 더 긴 텍스트를 사용할 수 있습니다.
엄지 규칙 : 목록이 길거나 대안이 그다지 중요하지 않으면 선택을 사용하십시오.
MS, Apple, Gnome 등의 사용자 인터페이스 지침은 일반적으로 이에 대한 명확한 제안을 제공합니다.
라디오 버튼 : 5 개 미만 선택
선택 상자 : 6-10 옵션
- 스크롤 가능 목록 : 11 개 이상의 옵션 또는
- 끌어서 놓기를 지원해야 함
- 요소의 수는 다양
또한 공간을 절약해야하거나 기본 선택이 충분할 때 선택 상자를 사용할 수 있으므로 사용자는 선택을 거의 보지 않아도됩니다.
셋째, 요일, 월 등으로 사용할 수 있습니다. 그것은 여러분이 know 어떤 선택을 모두 보여주지 않고 가지고있는 것입니다. 선택 상자에 "2 월"이 표시되면 다른 모든 옵션이 무엇인지 추측 할 수 있습니다.
한 GUI 요소를 다른 GUI 요소를 사용하는 이유
일반적으로 라디오 버튼은 일반적으로 사용자가 모든 선택 사항을 즉시 볼 수 있기 때문에 선호됩니다. 그러나 모든 선택 사항을 표시하면 사용자 인터페이스에서 많은 유용한 공간을 차지할 수 있습니다. 그렇기 때문에 대부분의 지침은 선택의 여지가 많을 때 다른 선택 방법을 사용하는 것이 좋습니다.
예 : -스크롤 가능 목록 많은 공간을 차지하지 않고 임의의 수의 선택을 표시 할 수 있습니다. 단점은 모든 선택을 볼 수 없다는 것입니다.
선택 상자는 사용자에게 모든 선택이 중요하지 않다는 것을 보여줄 때 사용한다는 점에서 다릅니다. 예 : 사용자가 선택을 추측 할 수 있거나 기본 설정을 변경해야하는 경우가 거의 없습니다. 선택 상자는 주로 사용자에게 설정이 무엇인지 보여주기 위해 존재합니다. 그러나 선택의 여지가 많으면 선택 상자 탐색하기 어색 할 수 있으므로 스크롤 가능 목록이 바람직합니다.
공간과 옵션 수 외에는 큰 차이가 없습니다. 라디오 버튼에 대해 좋아하는 것 중 하나는 큰 버튼처럼 보이도록 스타일을 지정할 수 있다는 점입니다. 터치 인터페이스에 유용 할 수 있습니다. 몇 가지 옵션 만있는 경우 작은 드롭 다운을 누르고 작은 옵션을 누르는 것보다 큰 버튼을 누르는 것이 훨씬 쉽습니다.
다중 선택 대 확인란의 경우 다중 선택을 사용하지 않는 것이 좋습니다. 마우스 클릭과 함께 키 조합을 사용해야하기 때문입니다. 많은 사용자가 단축키 작동 방식을 인식하지 못하고 여러 옵션을 선택할 수 없습니다.
종종 간과되는 두 입력의 또 다른 차이점 : 단일 선택 단추가 선택되지 않은 경우 제출 양식에 전달되지 않습니다. 또는 다른 방법으로 보려면 라디오 버튼을 사용하여 옵션을 선택하지 않는 옵션을 제공하십시오.
드롭 다운 (선택 상자)을 사용하면 값이없는 옵션 (공백, "")을 기본값으로 지정할 수 있지만 사용자가이 옵션을 그대로두면 "내 답변이 비어 있습니다"라는 메시지가 나타납니다. 양식은 "my_input_name : ''"을 따라 전달됩니다. 라디오 버튼을 사용하면 사용자가 명시 적으로 선택할 수있는 "N/A"또는 "위의 없음"과 같은 옵션을 제공 할 수 있으므로 "-blank-"를 선택하는 사용자와 질문을 건너 뛰는 사용자/선택하는 사용자를 구분할 수 있습니다 응답하지 않음 (이 구별은 NULL 값과 빈 값 (공백) 값으로 저장된 필드를 구별 할 때 하위 레벨 DB 로직에서 실제 피클이됩니다).
이 라디오 버튼 기능의 단점은 라디오 버튼에 대해 종종 잊어 버린 다른 것입니다. 질문에 답할 수 없습니다. 다음과 같은 라디오 필드 셋이있는 경우 :
성별 남성 여성 ()
사용자는 질문을 건너 뛸 수 있으며 필드는 공백으로 전달되지 않습니다. 그러나 사용자가 남성을 선택하면 이제 막혀 있습니다. 그들은 대답을 여성으로 바꾸거나 남성으로 남길 수 있습니다. HTML 양식의 경우 브라우저 콘솔 사용에 대해 약간 배울 수 있지만 UI/UX 디자인에서 벗어나 프로그래밍 및 보안에 해당합니다.
따라서 라디오 버튼의 "복구 금지"기능을 사용하면 드롭 다운에서 제공하지 않는 몇 가지 옵션이 제공됩니다.
- "답변하지 않았습니다"와 "응답이 비어 있습니다"를 구별하는 기능
공백 또는 기본 옵션을 강제하지 않고 모든 옵션을 표시 할 수 있습니다. 드롭 다운을 사용하면 옵션을 비운 다음 실제로 유효한 사용자 선택이 아닌 해당 옵션을 처리하거나 목록의 첫 번째 옵션과 같은 사용자 옵션을 미리 선택해야합니다. 사용자가 선택을 무시하는 경우 (아마도 선택하지 않았거나 보지 못했을 수도 있음) 또는 빈 옵션이 없어 의도적으로 선택하지 않은 경우 실수로 제출됩니다. 두 경우 모두 "default"옵션이 정답 일 수도 있고 그렇지 않을 수도 있으므로 데이터의 가치가 떨어집니다 (믿지 않는 경우 필드 대 기본 옵션을 사용하여 행의 비율을 가져 오도록 데이터를 쿼리하십시오) 앨라배마가 기본 옵션 인 경우 몇 명이나되는지 분명히 알 수 있습니다).
양식 유효성 검사, 특히 "필수"필드 처리를보다 효과적으로 제어합니다. 필수 드롭 다운 필드는 없습니다. 공백 옵션이 유효하지 않은 드롭 다운 필드 만 있습니다. 빈 옵션을 사용하여 상태 드롭 다운을 제공하고 빈 옵션을 피하기 위해 양식을 날려 버리는 것보다 빈 옵션을 처리하는 것이 좋습니다. 그러나 최대 4-5 개의 응답이있는 질문의 경우 실제로는 옵션이 아닌 빈 옵션이있는 드롭 다운을 사용하는 대신 전체 옵션 목록을 제공하는 것이 좋습니다. 그런 다음 선택하지 않은 것과 공백을 구분해야합니다.
보너스 의견 :
위의 아이디어와 동일한 토큰으로, 확인란 대신 드롭 다운을 사용하는 것은 실제로 바보입니다. "예/아니오"또는 "참/거짓"옵션이있는 드롭 다운 메뉴는 매번 눈을 굴립니다. 드롭 다운을 사용하는 only 이유는 세 번째 빈 옵션을 제공하고 유효한 선택으로 간주되는 경우입니다. 그럼에도 라디오 버튼이 더 나은 선택 일 것입니다.
나는 상호 작용을 위해 이것을 스스로 숙고하고 있었고 라디오 버튼의 또 다른 이점은 지원 텍스트 또는 가능한 선택에 대한 설명을위한 약간의 추가 공간을 제공 할 수 있다고 생각합니다.
선택 상자 (확인란)을 사용하여 여러 옵션을 선택하거나 이진 선택을 선택합니다.
모범 사례 선택 상자를 사용하는 경우 :
- 사용자가 80 % 이상의 시간을 선택하는 옵션에 대한 기본값을 설정하십시오.
- 이메일 마케팅 가입과 같은 기본 옵트 인을 피하십시오.
라디오 버튼을 사용하여 둘 이상의 상호 배타적 인 옵션에서 하나의 항목을 활성화합니다.
모범 사례 라디오 버튼 사용 :
- 라디오 버튼을 사용하여 작업을 시작하지 마십시오.
- 항상 두 개 이상의 라디오 버튼을 사용하십시오
라디오 버튼은 일반적으로 두 개 이상의 옵션이있을 때까지 선호됩니다. 클릭 수는 두 개에 비해 한 번만 있으면됩니다. 라디오 버튼은 하위 옵션 중첩에 더 좋습니다.
몇 가지 선택 만하면 사용하기 쉽고 빠른 선택을 위해 라디오 버튼이 사용됩니다. 드롭 다운 선택을 사용하면 사용자가 해당 필드에 도달 할 때까지 모든 선택 사항을 볼 수 없습니다.
이 질문은 확인란과 다중 선택에 동일하게 적용될 수 있습니다.