web-dev-qa-db-ja.com

水平メニューと垂直メニューの長所と短所は？

水平方向のナビゲーションメニューを使用するのか、垂直方向のナビゲーションメニューを使用するのかを長い間考えていました。私は以前、さまざまなウェブサイトで両方を使用しましたが、それぞれに長所と短所があります。

このテーマに関する具体的なデータはありますか？アクセシビリティとユーザビリティの問題に興味があります。

usabilityaccessibilitynavigation
11
Grant Palin

スペースの問題とスキャンの容易さ以外に、考慮すべき他のいくつかの要因があります。

水平に配置された（水平に配置された言語の）メニューは、あるアイテムから次のアイテムに移動するためのマウスの動きをより多く意味します。

ただし、垂直メニュー項目から対応するフライアウトメニューに移動するよりも、水平メニューの最上位メニュー項目から対応するドロップダウンメニューに移動する方が簡単です。斜めの問題は、共有Edgeが非常に小さいため、ドロップダウンと比較してフライアウトで大きく拡大します。

そして、ターゲット速度の問題があります。垂直に配置されたメニューには、水平のメニューよりも「深さ」があります。つまり、ユーザーはマウスをメニューに向けてより高速で動かすことができます。オーバーシュートした場合のバッファーが大きいためです。もちろん、水平メニューがドキュメントの上端または下端に沿って配置されている場合（つまり、無限の深さ）、これは重要なポイントです。

最後に、私はそれが洗浄だと思います。デザインに最適なものを選択して、そこからユーザビリティを最適化します。ページの残りのために、その下に巨大な空の列を作成することを意味する場合、垂直メニューを使用したくないでしょう。また、レイアウトの幅を2000pxにする必要がある場合は、水平メニューを使用したくないでしょう。

3
Lèse majesté

まあ、私は開発者/プログラマー/コーディングの男です。

つまり、このような質問に答える前に、私は常にデザインに関するいくつかの情報を求めています。 Jakob Nielsenの記事は気に入っています。投稿する前に研究しているからです。

これらのリンクが役立つと思います。

今私の意見。水平ドロップダウンメニューの使用は、特にメガドロップダウンの使用を検討している場合、メインナビゲーションの最初のオプションです。

また、ユーザーがすばやく自分自身を見つけられるようにする補助ナビゲーションとしての水平パンくずの使用。

私は垂直ナビゲーションメニューが好きですが、それらは広告に似ている傾向があり、ユーザーがそれらを盲目にするので、最初に、垂直メニューがバナーやGoogle広告のようではないことを確認してください。

次に、「コンテキスト」ナビゲーション、関連コンテンツ、またはサブセクション項目の表示に垂直メニューを使用することを好みます。

4
Dave

とても簡単です。読みやすいのはABCDEFGHIJKLMNOP...Zまたは

A
B
C
D
E
F
G
H
I
J
K
L
M
N
O
P
.
.
.
Z

あなたがそれを読んでいるとき、あなたの目がどのように動くかについて考えてください。最初の例では---などです。2番目の例ではZ Z Zなどです。目がZパターンで動くことを意味します。 Zパターンでは、最初の情報よりも、次の情報の点をもっとよく考えなければなりません。情報が最後の情報に近いほど、使いやすくなります。情報がコンパクトであればあるほど、いつでもスペースを追加できますが、これまでのところ一部の情報はコンパクトになります。たとえば、このようにスペースを追加できますが、例2の最長端を測定すると、長さがさらに短くなります：A B C D E F G H I J K L M N O P Q R S T U V W X Y Z

誰かが研究や何かを投稿し、間違っていると言うかもしれませんが、事実は私のロジックは私がそれを理解するのに十分単純であり、私には理にかなっており、私に私に伝えるために派手なレポートは必要ありませんそれは正しいか間違っているか...私はファンシーレポートが意味をなさないと推測しているため、与えられたテストの構造に基づいたデータの単なるサンプルです...

それで、あなたはどう思いますか？

0
blunders

1つ以上の単語のメニュー項目がある場合、スクロールが必要になるまでに水平メニューに収まる数には物理的な制限があります。したがって、この理由から、メイン/トップレベルのアイテムには水平メニューを好む傾向があります。

アクセシビリティに関しては（視覚的には問題ないと思います）、同じようにマークアップできるため、大きな違いはないかもしれません。たとえば、リンクの順不同リスト。

0
MrWhite

私は失策の答えの反対を投稿するつもりです...

左から右に読みますが、上から下にスキャンする傾向があります。メニュー項目が垂直に配置されている場合、項目が互いに上にある場合、項目をすばやく比較するのが簡単です。

リンクの数が少ない場合は、水平方向で十分です。名前は短く、明確にして、6〜7を超えないようにします。もちろん、他のオプションは組み合わせです。水平方向にいくつかの「ヘッダー」があり、そのカテゴリ内のすべてのアイテムのドロップダウンがあります。

0
DisgruntledGoat

答えはおそらく両方を使用する場合があるということですが、アイトラッキングの研究が示す限り、目は F形のパターン でページをスキャンするため、おそらくナビゲーションをオンにしておくのが最善です左上、または上部全体。

ナビゲーションリンク（ホーム、会社概要、連絡先など）の上部にある水平メニューと、カテゴリ、記事などの左側のメニューのように、両方を組み合わせて使用​​することもできます。

ドロップダウンメニューに関して考慮すべきもう1つの点は、SEOに影響を与える可能性があることです。 Search Engine Land のDanny Sullivanは、ドロップダウンメニューはすべてのページへのリンクを多数持つことでリンク権限を弱めることができ、階層メニューはリンクジュースをよりよく渡すことができることを示唆しています。また、ユーザーが探しているものを見落とす可能性があるドロップダウンでユーザーからナビゲーション要素を隠す理由。

0
plntxt

私見、私は主要なセクションを水平メニューとして分類する傾向があります。

例えば：

------------------------------------------------------------------------------
Home News Product
------------------------------------------------------------------------------

|      About Us          | |                                            |
|      Mission           | |      Here is describing content            |
|      Contact Us        | |                                            |

Home、News、およびProductは主要なカテゴリとして機能するため、水平レイアウトでそれらを保持しました。AboutUs、Mission、Contact Usはホームページの最も説明的なセクションであるため、簡単にアクセスできるようにコンテンツ表示部分の横に垂直メニューを保持しました。

0
Starx