同じページに複数レベルのタブを表示するにはどうすればよいですか？
私はFinancial Webアプリケーションに取り組んでおり、6つのカテゴリがあり、それらのカテゴリをタブとして表示しています。各カテゴリには約20のサブカテゴリがあり、4〜5行の説明があります。主なことは、ユーザーはフロー内のすべてのカテゴリとサブカテゴリを通過する必要があり、各サブカテゴリにいくつかのデータを入力する必要があることです。
例カテゴリ1のタブで、選択したサブカテゴリ1にあり、サブカテゴリ1のすべてのフィールドに入力しました。サブカテゴリ1のデータ入力が完了すると、サブカテゴリ2などに移動できます。次に、カテゴリ2、カテゴリ3なども同じように段階的に進み、フロー内のカテゴリとサブカテゴリをスキップすることはできません。
例えば。私は次の流れを段階的に通過しなければなりません
category 1--> sub category 1
category 1--> sub category 2
category 1--> sub category 3
category 1--> sub category 4
category 1--> sub category 5
category 1--> sub category n
category 2--> sub category 1
category 2--> sub category 2
category 2--> sub category n etc.
同じページにサブカテゴリとその説明を表示できるように、サブカテゴリをレイアウトするためのより良いデザインの提案が必要です。ユーザーは、このサブカテゴリがカバー/完了したことを追跡できます。
下の画像を参照してください：[！[ここに画像の説明を入力] [1]] [1]
ポップアップを表示していますが、同じページにサブカテゴリを表示できるようなデザインが必要です。
これは、セクションの下のすべてのカテゴリをカバーするように私が設計した方法です。前のセクションを完了するまで、以下のすべての部分は無効になります。 
このパターンは、しばらくの間、税および保険アプリケーションによって解決されました。プライマリとセカンダリのタブはワークフローを反映しているため、タブの概念をまとめてドロップし、ネストされた左側のナビゲーションを操作します。すべてのメインカテゴリを表示することから始めますが、ユーザーがまだ取得できないものを無効にします。これにより、ワークフローが強制され、ビジネスルールで、以前の回答に基づいて有効と無効を調整できます。
この全体的な影響には、ウィザードのような感触があり、ユーザーは全体的なワークフローで自分の場所を失うことなく、任意の時点に戻ることができます。
シーケンシャルナビゲーション（ウィザード）
下のワイヤーフレームは、複数のタブを処理するためのソリューションの1つになる可能性があります。
アイコンを使用して、各カテゴリのステータス（警告または成功/完了）を表すこともできます（下のワイヤーフレームに目盛りと感嘆符が表示されます） 。
サブカテゴリのカルーセル矢印を使用すると、ユーザーは左または右にスクロールできます。ただし、あるセクションから別のセクションへのジャンプは、選択したウィザードの種類（シーケンシャルまたは非モーダル）によって異なります。
バーガーメニュー（アイコン）をクリックすると、非表示または右側にあるタブ項目のリストが表示されます。
注：ここでの非モーダル用語はポップアップには使用されません。このデザインはページ用です。
更新：
同じページで複数レベルのタブを使用しないでください。あなたは本当にカテゴリーのタブを持っていますか、それともあなたはリンクを持っていて、あなたはこのようにそれらを表示しましたか？
サブカテゴリだけにタブを使用することをお勧めします。カテゴリを選択した後は、メニューを表示しないでください。ナビゲーションにはブレッドクラムを使用します。
この方法で2番目のレベルを非表示にしないでください。非表示にすると、ユーザーの労力が増えます。
2つの潜在的なソリューションがあります。
オプション1：
オプション2：
どちらのオプションでも、トップレベルのメニュー項目を選択すると、すべてのセカンドレベルのメニュー項目が表示されます。スタイリングは、レベルをレベル2に関連付ける際に役割を果たします。
私の提案：ハーバードビジネススクールのWebサイトhbs.eduで使用されているブレッドクラムアプリケーションを調べて、サブカテゴリとその説明を表示します。
他のアイデアに拍車をかけることができるそれらのスタイルガイドはここにあります： http://www.hbs.edu/marketing/web-development/desktop/navigation.html
お役に立てば幸いです。