web-dev-qa-db-ja.com

長いスクロールページのモバイルグローバル/サブナビゲーション?

深い階層的なコンテンツを伴う長いページスクロールを伴うWebサイトは、モバイルに適応するときにベストプラクティスに従いたいと考えています。現在デザイナーは、ユーザーが下にスクロールし始めると、ナビゲーションをローカルナビゲーションに変更することを推奨しています。これはベストプラクティスと見なされますか?

グローバルナビゲーションは右端まで描かれていますが、提案されたローカルナビゲーションは左端の2つの写真です。ありがとうございました

proposed mobile navigation

6
Dan Bamberger

私は、設計者が提案した「ダブル」ナビゲーションを使用する必要はないと思います。

あなたのコメントの1つで、階層は3レベルの深さだと言っていましたが、デモサイトでは2つしかありませんでした

ナビゲーションの深さが2レベルしかない場合

今お手元にあるのでそのままにしておきます。ナビゲーション自体はそれほど長くないので、スクロールするコンテンツはそれほど多くありません。ユーザーにとって理解しやすくします。ナビゲーションはこのように非常に明確です。

ナビゲーションが3レベルしかない場合

ダブルナビゲーションは3レベルの深い階層に適しているかもしれませんが、個人的には1つのナビゲーションバーに配置しません。自分はタコに詳しい人だと思います。私はデザイナーなので、さまざまなナビゲーションパターンを理解していると思います。しかし、これは非常に混乱します。下の画像のように、ドキュメントのさまざまなセクションへのリンクを含むバーを追加することをお勧めします。

  • 利点は、この方法で本当に明確です。 Webサイト全体とその主要セクションのナビゲーション、および現在のドキュメントのナビゲーションを分離します。
  • 欠点これは、追加の垂直方向のスペースが必要です(最近の問題ではそれほど大きくありません)

enter image description here

3
rojcyk

良い質問です。モバイルナビゲーションはかなり扱いにくい場合があります。グローバルメニューを使用して同じコンテンツにアクセスできる場合は、ローカルメニューを使用しません。ユーザーは自分の階層のどこにいるかを意識することはありません。また、ユーザーがグローバルメニューを表す矢印を理解できないと思います。

階層(または階層に含まれるアイテムの数)を投稿して、より良いアドバイスを提供できると助かります。

できることは、メニュー項目の最初の2つのレベルをグローバルナビゲーションに配置することです。次に、ページ自体の3番目のレベルのメニュー項目(ショートカット、またはボタンの後ろなど)を使用してメニュー/インデックスを作成できます。階層はどのくらい深いですか?

1
Luchadora

ページの上部にある種類の「目次」を追加し、さまざまなヘッダーをリストし、それらにリンクすることもできます。ページの各ヘッダーの下にある「トップに戻る」アイコンのオプションがあります。 (これらのNietherは粘着性があるはずです。)

このようにして、コンテンツの概要を取得したり、スクロールしすぎたりせずに上下に移動したりするのは簡単です。

しかし、ウィキペディアのモバイルソリューションを確認することもお勧めします。簡単な確認を行ったところ、大量のスクロール(メインメニューからページ内を検索するオプション以外)を補正できなかったようです。

0
Winter