web-dev-qa-db-ja.com

メニューはホバー+クリックでドロップするのか、それともクリックするだけでドロップするのですか?

現在、「ホバー時」にドロップダウンするメニューがあるWebアプリケーションがあります。これは明らかに、ホバーに相当するものが存在しないタブレットなどの問題です。

そのため、メニューをドロップダウンするには「クリック」機能を追加する必要がありますが、ホバー機能をそのままにしておくか、削除する必要があるかわかりません。

私の質問は:一貫性を保つためにメニューを「クリック時」にするか、ホバー/クリック時のドロップダウンの両方をサポートする必要がありますか?

編集:メニューはページの上部にあるナビゲーションメニューではなく、表形式のデータで結果をフィルタリング/並べ替えるためのコントロールメニューです。

「フィルター」または「列」にカーソルを合わせると、表示される列を選択したり、表示された結果のリストにフィルターを追加したりできるメニューがドロップダウンされるという考え方です。

(考えてみてください、多分それは私が思うほど明確ではありません)

Menu with filters/columns

11
Shawn D.

私には、ホバーではなくクリックで開く以下のようなドロップダウンが必要と思われます-下矢印がアフォーダンスとして機能します。

enter image description here

9
Roger Attrill

私は最近、クリックメニューまたはホバーメニューが私たちのより大きな金融クライアントサイトの1つに適しているかどうかを確認するために調査を行いました...これらは私の調査結果です。私はそれらがあなたのために役立つか助けになることを願っています:

要約すると

  • 一般に、ホバーメニューはほとんどのサイトで実際に予想される動作ですが、顧客が毎日頻繁に利用する株式取引プラットフォーム(クライアントなど)など、頻繁に利用されるサイトでは注意が必要です。 、そしてほとんどの場合、ユーザーはログインして1日に最大10時間サイトに滞在します。その後、サイトの動作は「学習」され、ユーザーは情報に基づいたクリックを行って何かを開始または実行することを好みます。ユーザーがホバーするつもりのない領域にマウスを移動するたびに、非常に煩わしいホバーアクションになる可能性があります。
  • サイトがたまにある小売サイトやeコマースサイトなど、頻度の低いサイトである場合、ユーザーはナビゲートの方法とオプションをすばやく学習する必要があるため、ホバーアクションは許容されますが、これはオンラインなどの頻度の高いサイトでは反対ですバンキング、eBay、Google(Gmailなど)など(ホバーメニューではなくクリックメニューを使用するユーザー)。
  • クリックまたはホバーメニューの技術的な出力とアクセシビリティを常に考慮する必要があります。ニールセンがそれらをうまく実装する方法に関する彼の発見を発表した後、メガドロップダウンは勢いを増しました http://www.useit.com/alertbox/mega-dropdown-menus.html しかし、過去にはホバーメニューとフライアウトメニューは、ひどいMouseOut関数と「トンネル」トラベルを使用して目的のリンクに到達することで悪名高く悪質にコード化されていたため、不人気で扱いにくいものになりました(Amazon.comの左側のフライアウトメニューは、禁止事項の完璧な例です。 。)
  • コンテキストは王様です!たとえば、年配のユーザーは、リンクをクリックしてアクションリンクを実行することを好みます。マインスイーピングとホバーメニューは、それらをある程度回避する傾向があります。
  • そして間違いなく、以下のメニューがあることを示すために、ある種のキューを含めてください。下矢印またはプラス記号。この視覚的な合図は、ユーザーがサブメニューをクリック/ホバーする必要があることを示します。

Anthonyと呼ばれるUXの章からの X Movement からの抜粋:

多くのデザイナーは、ホバー時にメニューを開くと、ほとんどのユーザーがより速く簡単に使用できると信じているようです。最初は確かにこのように見えるかもしれませんが、深く見てみると、反対のことが当てはまることに気づくでしょう。ホバーメニューは、ほとんどのユーザーにとって実際には低速で困難です。ホバーで開くメニューはユーザーのクリックを節約しますが、最初のクリックは、ユーザーがメニューを開くことを望んでおり、メニューの準備ができていることをWebサイトに知らせるために必要です。また、クリックの結果として何かが起こっていることをユーザーに確認します。この動作は、ほとんどのWebサイトがどのように機能するかのユーザーのメンタルモデルと一致します。あなたが欲しいものをクリックすることは、ユーザーにとって決して問題ではありませんでした。ユーザーにとって何が問題なのかというと、単にホバーしただけでは望んでいない、または期待していないものが表示されます。

ウェブサイトでは、ユーザーは多くの場合、マウスを多くのものの上に移動します。これは、ほとんどのユーザーがクリック可能なものを確認するために行うことです。ホバーは、何かがクリック可能かどうかをユーザーに通知するときに、最も効果的です。しかし、ユーザーが要求する前に何かを開くと、ユーザーを驚かせ、圧倒する可能性があります。欲しくないものを、もし欲しくないとしても、あまり速く欲しくないものを手に入れてもメリットはありません。これが起こるとき、それは利益よりも不愉快なものになります。

23
UXesse

ほとんどの場合、モバイル/タブレットユーザー向けのモバイルバージョンを作成する必要があります。 Home Depot's site を例にとります。 PCではドロップダウンがホバーに表示されますが、モバイルバージョンではドロップダウンがまったくありません。 enter image description here

彼らがナビゲーションをドロップダウンし、クリックのみを飛ばしたとしても、サイトが実際に独自のモバイルバージョンを必要とするという問題はまだ解決されません。モバイルデバイスで通常のWebバージョンを表示するのは、非常に悪い体験です。

また、多くのユーザーは、ナビゲーションをクリックするときに別のページに移動することを期待しています。

1
Matt Rockwell

2013 ...ナビゲーションメニューについて同じ問題を調査しているこの投稿に出くわしました。私は自分の会社のUIフレームワークを設計しており、サイトナビゲーションのデフォルトの動作を決定しようとしています。

この場合、提示されているように、ユーザーはやるべきことを「探している」わけではありません。メニューは、スペースを節約するためにロールアップされた可能なアクションです。彼らがやりたいことを明らかにするためにクリックするのが彼らの仮定です。同じことをお勧めします。そのクリックはここで正しい選択です。

これは私自身の決断にもなります。ナビゲーションドロワースタイルのメニューは、関連するカテゴリの選択肢をロールアップし、必要になるまで非表示にします。ユーザーは、いずれかの選択を行う前に、各引き出しをのぞいて内容を確認することができます。

この投稿のおかげで、ナビゲーションメニューをホバーします。

0
Itumac