web-dev-qa-db-ja.com

タッチスクリーン最適化用のアコーディオンメニューまたは静的メニューオプション

アプリケーションのダイアログメニューを再設計しているところです。最大の理由は、アプリケーションをタッチフレンドリーにすることです。ただし、これらのメニューはタッチ環境とマウス環境の両方で使用されます。

タッチ環境は、現時点ではモバイルではなく、ほとんどがタッチモニターになります。

アコーディオンタイプのメニューが関連しているか、すべてのメニューオプションを常に表示する必要があるか知りたいです。

enter image description here

ユーザーは各セクションで複数のアイテムを選択できます。各セクションには20を超えるオプションはありません。

アコーディオンメニューの欠点は、各メニューを展開するための追加のクリック/タッチであり、それらが既に展開されているメニューの欠点は、さらにスクロールできる可能性があることです。

どちらが推奨またはより一般的なアプローチですか?

6

どのメニューが最適かは、実際の状況によって異なります。より具体的には、メニュー項目のnumberおよびメニュー項目間のrelationshipです。

いくつかのアイテム(約15未満)がある場合、気にしないでくださいでアコーディオンメニューのオーバーヘッドが発生します。

あなたが多くのアイテムを持っているなら、あなたはあなたのユーザーはそれらの間に明確な関係があると信じていますかどうかを決める必要があります。

たとえば、販売中の車両を一覧表示する場合、バイク、オフロード車、キャラバンとキャンピングカー、スポーツカーが別のセクションに配置されることを期待するのは当然のことです。ここで、アコーディオンメニューを使用することは非常に理にかなっているので、必要なものを見つける前に、興味のないセクションをスクロールする必要がありません。いくつかのセクションを見て、興味のあるセクションを拡大したいと思います。この場合、アコーディオンメニューは、シンプルなリストよりもUXが向上しています。

ただし、注意すべきことがいくつかあります。アコーディオンメニューは、必ずしも一度に1つの展開されたセクションだけを表示する必要はありません。多くの場合、複数のセクションの展開を許可し、誰かが実際に開いているセクションの見出しを選択したときにのみセクションを閉じる必要があります。

2
JohnGB

メニューのコンテキストや内容についての洞察は限られているため、何が最善かを判断するのは困難です。

とはいえ、メニューごとに20アイテムというハード制限がある場合は、静的なリストか、適切な場合はタイルを使用したほうがよいと思います。アコーディオンメニューは、無限の可能性を秘めている可能性のあるFAQやリストに適しています。結局のところタッチを使用すると、複数回タップするよりも1回スクロールする方が簡単です

0
Dom Ramirez

1つのアイテムが展開されると、以前に展開されたアイテムが縮小され、両方が同時に展開されることを確認したいため、アコーディオンメニューはしばしば私を悩ませます。上記の@domの意見に同意します。アコーディオンは、FAQや、展開されたノード以上のものを見たくないと思われるものに適しています。

一般に、アイテムが展開してサブアイテムを表示する場合、アコーディオンは適切ではないと思います。これは、複数のノードを展開して表示したい場合があるため、ツリービューコントロールの方が適しています。しかし、質問への回答(FAQ)のように、アイテムが展開してそれ自体の詳細を示す場合、アコーディオンが適切な場合があります。

0
obelia

アコーディオンメニューは、私の考え方では、2つのケースに適しています

  • 分類できるアイテムがたくさん
  • 小さな画面;たとえば、拡張電話。

カテゴリーが適切に定義されていれば、2つのセクションを開く必要はありません。

私はcss-layout用に独自のシステムを作成しました。これにより、アコーディオンなどのスニペットにすばやくクリックし、それを選択してcss-fileに貼り付けることができます。

0
OldGeezer