web-dev-qa-db-ja.com

サイドパネルを開いているときにユーザーがスクロールする場合、サイドパネルを開いたままにするか、パネルを自動的に閉じるほうが良いですか?

ウェブサイトのアイコンをクリックすると、片側から開くサイドメニューがあるとします。このメニューは、水平方向にビューポートの40%以上を占めます。

ユーザーが下にスクロールする場合、ユーザーに閉じるボタンをクリックさせるか、メニューを自動的に非表示/閉じるほうが良いですか?

4
Francis Laclé

ライトボックスなどの多くの要素は、ボックスの外側でクリックを検出すると閉じます。これを行う簡単な方法の1つは、mouseenterとmouseleaveでブール値を切り替えてからクリックすることですif(!InPanel) closePane();これが私の第一の提案です。

パネルの目的によっては、パネルの設定を変更しながら、ページを下にスクロールして何かを見たい場合があると思います。特に、ある種のライブ検索フィルターやそのようなものがあれば。これが当てはまらない場合は、スクロールで閉じても問題ないと思います。ただし、ユーザーがマウスを使用してパネル内にいる場合は同様です。

閉じるボタンは少し厄介な場合がありますが、境界線の内側に 矢印アイコン を作成すると、通常はこの方法で展開/折りたたみできます。

2
Garet Claborn

閉じるボタンの代わりに、ピンボタンを提供できます。これにより、メニューを表示したままにするかスライドさせるかをユーザーに指示できます。

メニューのデフォルトがピン留めであるかピン留め解除であるかは、どのオプションが大多数のユーザー/ユースケースにとって意味があるかに依存します。たとえば、ほとんどのユーザーはコンテンツを表示するために追加のスペースを必要とするため、デフォルトでnpinnedとします。ユーザーがスクロール中にメニューを表示したいというユースケースがある場合は、ピンで固定できます。それ以外の場合は、スライドして離れます。

1
Franchesca