web-dev-qa-db-ja.com

レスポンシブポートフォリオのハンバーガーメニュー

モバイルバージョンのデザインに焦点を当てたポートフォリオWebデザインでは(ユーザーがそれを使用するシナリオのため)デスクトップバージョンのハンバーガーメニューを保持することは理にかなっていますか?これはレスポンシブWebページです。デスクトップ版ではメニューが存在しないようです。 (これも右側にあります。カラフルな画像が混ざり合っているため、混乱を招きます。モバイルバージョンでは、より直感的で強調表示されます。)

1
sofiatr

ハンバーガーのメニュー…。

ハンバーガーメニューは、ユーザーが使用する可能性が高いものを非表示にするため、発見可能性が低下します...まあ... discover

ユーザーは一目で、どこに何があり、探しているものを見つける方法を知ることができます。どこかに隠れていることはスキャン可能性にとって理想的ではありません。そうは言っても、それをデスクトップサイトで維持することは避けてください。

人々がモバイル上でそれを維持する必要性を感じる理由は、本格的なメニューのためのスペースがあまりないためです。注意してください。 ハンバーガーメニューがあいまいです。人々が理解していないことを確認するためにテストされました 。ハンバーガーメニューを組み込む場合は、少なくともラベルを追加してください(またはアイコンを完全に削除して、「メニュー」のようなラベルを残してください)。


これに加えて、Twitterのようなサイトでは、ハンバーガーメニューの使用を完全に排除し、ナビゲーションのメニューをアプリケーションの下部に表示しました。

enter image description here

Facebookでも同じですが、ハンバーガーメニューはありますが、目的は異なります。

どうだった?

enter image description here

それが何になったのか:

enter image description here

2
Majo0od

Evil Closet Monkey が言ったように、ハンバーガーアイコンがデスクトップバージョンのサイトで使用されているのは意味がありません。 BootstrapFoundation などのレスポンシブなフレームワークを使用している場合、下の図のように、画面サイズに応じてメニュースタイルが自動的に調整されます。

Bootstrap Nav bar

この画像を取得した記事 を見ると、Bootstrapの使用中にナビゲーションがどのように機能するかがわかります。また、流動的なナビゲーションバーを設定するためのHTMLも表示されます。

2
BDD

コンテキストがすべてです。多分それは重要かもしれませんし、多分それは重要ではありません。それがポートフォリオサイトであるという事実は、それ自体には真の意味を持ちません。

一般的に言えば、ハンバーガーメニューを大きな画面で保持する必要がありますか?伝統的にはそうではありません。しかし、それはますます人気のあるオプションになりつつあります。大画面でもハンバーガーメニューを保持する一部のサイト:

それが良いか悪いかは、やはりコンテキストに依存します。本当に目に見えるナビゲーションシステムが必要なサイトもあります。場合によっては、サイトナビゲーションがホームページコンテンツの副次的なものになることがあります。それは判断の呼びかけです。

大画面でハンバーガーメニューを使用するnotの引数:

  • 通常、ナビゲーションを非表示にすることはお勧めできません。なぜ非表示にするのですか?
  • 人々は小さな画面でそれらに慣れている間、彼らは大きな画面でそれらを探していないかもしれません

大画面でハンバーガーメニューを使用する場合の引数for

  • 多くの大画面がタッチデバイスになりました。ハンバーガーメニューを使用すると、常に画面に表示されている場合よりも、タッチフレンドリーなバージョンのサイトナビゲーションを表示できます。
  • サイトのその部分の開発と保守がすべてのビューポートで少し簡単になる場合があります。
  • 複数のデバイスでサイトを使用するユーザーに一貫性を提供する場合があります。
1
DA01

上記の回答とコメントに同意します。UX101のようなものであり、これについては議論しませんが...検討する別のビューを追加します。

あなたはこれがポートフォリオのためであると言います。ポートフォリオはあなたの作品だけでなく、あなたが誰であるかを表示するためのものです。それは、「ねえ、私です。さらに、私はこれすべてを行うことができます!」ということを世界に伝える方法です。個人的に、私はUX、UI、デザイントレンドなどの基本が何であるかを知っています。今私はあなたに私に何か他のものを見せてほしい、正しいか間違っているかは関係なく、私はあなたに箱から出して考えることができることを見せて欲しいです。誰もが彼の母親は本のルールに従うことができます。私が見たいのは、あなたがルールを破ることができるかどうかです(最初にそれらを知っていれば)。ルールを破らない限り、これまでに何も作成されなかったことに留意してください。定義により。それは絶対に不可能です。

ちなみに、あなたがアーティストEdgeのデザイナーである場合、その退屈なメニューがその巨大な画面でさえも貴重なスペースをどのように取るかをご存知でしょうか?退屈なナビゲーションで素晴らしいデザインを汚したくないでしょう

これで私が言いたいのは...ええ、なぜでしょうか?しかし、また...あなたが他のことをするのを妨げているものは何ですか?本当にクレイジーな何か?創造力を発揮するためのスペースがたくさんあるので...どうしてですか?

PS:クレイジーなタブを備えたフルスクリーンレイアウトに基づく非表示のメニューでデスクトップサイトを作成し、クライアントに225%のビジネス(コンサルティングとデザイン)を提供しました。よくわかりませんが、通常のメニューを使用すると、さらに効果が上がる可能性がありますが、問題ではないと私は信じています。疑わしい場合は...テスト!

0
Devin