web-development-kb-ko.site

요약 된 메뉴 또는 상세 메뉴 중 어느 것이 더 낫습니까?

웹 기반 응용 프로그램의 탐색 메뉴를 다시 디자인하고 있습니다. 현재 메뉴는 서비스별로 그룹화 된 작업 목록입니다. 새로운 기능을 추가함에 따라 목록이 꾸준히 증가하고 있으며 이제 사용자가 모든 기능을 보려면 아래로 스크롤해야합니다. 우리는 목록이 한 페이지 길이 만되는 것이 이상적입니다. 두 가지 해결책이 제시되었습니다.

  1. 각 서비스를 위해 확장 될 아코디언 같은 메뉴를 제시하십시오
  2. 작업을 그룹화하여 메뉴 축소

예를 들어 현재 메뉴에는 다음과 같은 옵션이 있습니다.

사용자
- 편집하다
-삭제
-비밀번호 변경

사서함
- 편집하다
-삭제
-권한 설정
-스팸 설정 관리
-스팸 검색

해결 방법 1을 사용하면 사용자 및 사서함 만 표시되며 둘 중 하나를 클릭하면 위에서 설명한 작업이 표시됩니다.

솔루션 2를 사용하면 새 메뉴가 다음과 같이 표시됩니다.
사용자
-설정

사서함
-설정
-권한
- 스팸

해결 방법 1은 첫 번째 수준에서 인터페이스를 정리하면서도 두 번째 수준에서 읽을 수있는 많은 텍스트를 사용자에게 제공합니다.

솔루션 2를 사용하면 사용자가 원하는 것을 찾지 못할까 걱정됩니다. 예를 들어, 비밀번호를 변경하려는 사용자는 사용자 설정에 들어가는 것을 불필요하게 알 수 없습니다.

둘 다 장점과 단점이 있습니다. 사용자가 원하는 정확한 작업을 찾거나 일반적인 제목 아래에서 작업을 그룹화 할 수 있도록 더 많은 옵션을 제공합니까?

Edit : 요청에 따라 응용 프로그램의 화면 모형을 포함 시켰습니다. 왼쪽에는 사용자 목록이 있으며, 사용자를 선택하면 오른쪽에있는 사용자의 작업이 나타납니다.
alt text

menu
5
Tania Gobeil

주어진 두 가지 옵션 중 아코디언 메뉴로갑니다.

별도의 페이지는 두 번의 클릭과 (일반적으로) 서버 왕복을 의미하며 다시 가야합니다.

단일 페이지에 대해 많은 옵션이없는 한 "사전 선택"을 수행하는 이점은 없습니다.

모든 일반적인 사용 사례에 선택한 사용자 당 여러 작업이 포함 된 경우 단일 페이지 (예 : "그룹화 된"메뉴가없고 단일 링크 만 있음)이면 괜찮습니다.

그렇지 않으면 "아코디언"메뉴 또는 자바 스크립트 팝업/메가/계단식 메뉴를 사용합니다. and 명령을 목록의 맨 위에 고정 할 수 있습니다.

2
peterchen

탐색에 사용할 수있는 공간이나 사용하려는 공간을 보는 것이 유용합니다. 그러나 혼란을 두려워하기 때문에 모든 옵션을 포함하려면 메가 메뉴 트렌드 . 주제에 대한 예제 링크는 다음과 같습니다.

http://designm.ag/inspiration/mega-menus-showcase/

요약 된 옵션을 확실히 원한다면 요약 된 메뉴 옵션의 제목을 다시 생각할 수 있습니다. 효과적인 네비게이션 시스템 설계에 대한 추가 정보는이 기사를 읽으십시오.

http://buildinternet.com/2009/09/principles-of-effective-web-navigation/

요약하면 임의의 사용자를 대상으로 한 테스트 또는 사용중인 레이블의 선명도에 대한 간단한 폴링을 제안합니다. 그런 정교한 연구 일 필요는 없지만 주제에 대한 유용한 정보를 제공 할 수 있습니다.

6
Pam Rdz

시간이 지남에 따라 더 많은 설정이있을수록 단일 링크를 선호합니다. Amazon.com에 "귀하의 계정"이라는 단일 링크가있는 방법. 그 이유는 매우 간단합니다. "귀하의 계정"링크를 클릭하면 가능한 모든 선택 사항이 포함 된 페이지가 나타나고 찾고있는 내용이 명확하지 않은 경우 Control-F 또는 Cmd를 누를 수 있습니다. -F는 페이지에서 원하는 것을 찾습니다.

메뉴를 사용하면 웹앱의 유일한 옵션은 메뉴를 읽는 것입니다. 나는 이것이 시간이 지남에 지루해진다는 것을 안다. 메뉴가 크면 클수록 (더 큰?!) 검색 옵션이 없어서 더 지루한 메뉴가됩니다. (메뉴가 더 "자연스러워"느껴지고 키보드 단축키를 제공하는 데스크탑 앱에서는 상황이 다릅니다.

2
Hisham

"작업"이 새 메뉴 또는 설정 페이지로 이동한다는 것은 직관적이지 않습니다. 과제는 "역할 관리 ...", "비밀번호 변경 ..."또는 "계정 비활성화"와 같은 단일 주제에 중점을두고 있습니다. 그러나 그것은 단지 나일 수 있습니다.

이상적으로 필자는 필요한 경우 일반적으로 작성된 모든 작업, 스크롤 막대를 포함하려고합니다.

그러나 압축하려면 Visual Studio의 도구 상자가 수행하는 방식이 매우 깔끔합니다. 이 경우에는 아코디언 아이디어와 비슷하지만 맨 위에 확장되어 가장 일반적이거나 인기있는 작업을 나열하는 추가 범주가 있습니다.

v Basic
   Change password
   Edit user
   Search spam
> User
> Mailbox

일반적인 작업을 결정하는 것은 간단한 결정일 수도 있고 로그인 한 사용자가 가장 많이 사용하는 것에 따라 동적으로 이루어질 수도 있습니다.

각 범주를 덜 혼잡하게 만들기 위해 많은 작업이 포함 된 논리적 범주가 거의없는 경우 범주를 약간 바꿀 수도 있습니다.

v Basic
   Change password
   Edit user
v Edit
   User
   Mailbox
   Permissions
v Spam
   Search
   Settings
v Delete
   User
   Mailbox
1
Oskar Duveborn

툴팁을 사용하십시오.

사용자가 항목 위로 마우스를 가져 가면 표시되는 툴팁의 각 페이지에서 수행 할 수있는 모든 작업 목록이있는 요약 메뉴를 만듭니다.

또한 처음 전환 할 때 사용자에게 몇 가지 팁을 제공하십시오. 예를 들어 사용자가 사용자 메뉴 옵션을 클릭하면 메뉴 변경 사항을 설명하는 작은 팝업 (예 :이 사이트에서 사용되는 팝업)이 표시됩니다.

0
Sruly