一般的なメニューを探る

Navi+は、従来のドロップダウンを超えた、あなたのウェブサイトのための包括的なメニューソリューションを提供します。

デバイスタイプと希望するユーザー体験に応じて、いくつかの柔軟で最適化されたメニュースタイルから選択できます:

1. Tab Bar (Bottom Navigation)

Bottom Navigation Bar、Bottom Nav、またはTab Navigationとして知られるこのスタイルは、Shein、ASOS、Zara、Etsy、H&M、Nike、Uniqloなどのグローバルブランドによって使用され、モバイルユーザー体験を向上させるための現代的なナビゲーションスタイルです。すべてのサイズのウェブサイトに適しており、モバイルとデスクトップの両方で効果的です。

モバイル画面の下部に表示され、ユーザーが:

  • サイトの4〜5の主要エリアに迅速にアクセス
  • 親指で簡単にナビゲート
  • モバイルで自然に感じるアプリのような体験を楽しむ

プラットフォーム:デスクトップとモバイル(非常に人気)


2. Mega Menu (Desktop) - 非常に人気

デスクトップウェブサイト向けに設計されたMega Menuは、次のような場合に最適です:

  • 複数の製品カテゴリやコンテンツセクションを一度に表示
  • リンクを列、グループ、または視覚的レイアウトに整理
  • プロフェッショナルで直感的なブラウジング体験を提供

プラットフォーム:デスクトップのみ


3. Mobile Mega Menu - 一般的ではない

モバイル画面向けに最適化されたメガメニューのバージョン — コンパクトで、親指に優しく、ナビゲートが簡単です。

カテゴリ、アイコン、ビジュアルの表示方法をカスタマイズして、最高のモバイルユーザー体験を確保できます。モバイルメガメニューとデスクトップメガメニューの最大の違いは、モバイルでは最大4つのメニュー項目を持つことができるため、最も重要で優先すべき項目を決定する必要があることです。

プラットフォーム:モバイルのみ


4. Slide Menu (Hamburger Menu)

画面の左または右側からスライドアウトするパネルで、アカウント情報、ポリシー、サポートページなどの二次的またはユーティリティコンテンツに使用されることが多いです:

  • アカウント情報、ポリシー、サポートページ
  • あまり頻繁にアクセスされない製品カテゴリ
  • 「About Us」、「Contact」、「Blog」などの追加リンク

プラットフォーム:デスクトップ(一般的ではない)およびモバイル(非常に人気)


5. FAB - Floating Menu / Quick Access

画面の隅(通常は右下または中央下)に固定された浮遊ボタンまたはメニュー。

理想的な用途:

  • 迅速な連絡ボタン(チャット、ホットライン、Zalo、メッセンジャー)
  • 「今すぐ購入」や「無料トライアルを開始」などの重要なアクション(CTA)
  • あまりスペースを取らずにコンバージョンを増やす

プラットフォーム:デスクトップ(人気)およびモバイル(非常に人気)


6. Grid Menu

Grid Menuは、ナビゲーションアイテムをグリッドレイアウトで表示し、ユーザーが複数のカテゴリを一度に見ることができるようにします — 各アイテムはアイコンまたは画像付きの正方形タイルとして表示されます。

このスタイルは特に次のような場合に効果的です:

  • モバイルまたはタブレットのホームページおよびサブメガメニュー
  • 6〜12のカテゴリを持つ製品コレクション
  • クリーンでアプリのような視覚体験を作成

プラットフォーム:モバイルのみ(人気)