新しいサイドバーでドキュメントナビゲーションを改善

今週、Discourse ドキュメントに重要な改善を加えました。新しいサイドバーです!この機能は、ドキュメントのナビゲーションとアクセスをこれまで以上に簡単かつ直感的にすることを目的としています。

:star2: 新機能は?

新しいサイドバーは、すべてのドキュメントカテゴリとトピックに表示され、コンテンツのナビゲーションが容易になります。期待できることは次のとおりです。

  1. ナビゲーションの改善: 明確で階層的な構造により、さまざまなトピック間の移動がより速く、より簡単になりました。

  2. コンテキスト認識: サイドバーは、現在表示しているトピックをハイライト表示するため、ドキュメント内のどこにいるかを簡単に理解できます。

  3. 折りたたみ可能なセクション: サイドバー内の各セクションは、必要に応じて折りたたんだり展開したりできるため、必要なトピックを簡単に見つけることができます。

  4. ライブフィルター: 関連キーワードを入力することで、サイドバー内の特定のトピックをすばやく見つけることができます。見つからない場合は、同じプロンプトでより詳細な検索を実行するように促されます。

  5. モバイルフレンドリー: 新しいサイドバーはモバイルでもシームレスに動作し、デスクトップビューと同じ機能をすべて備えています。

:eyes: 見てみましょう

:boom: 今すぐ新しいドキュメントサイドバーの動作を確認できます

以下は、期待される内容をよりよく理解するためのスクリーンショットです。

ご覧のとおり、サイドバーはすべてのドキュメントセクションの概要を明確に示しており、ナビゲーションが容易になります。

各カテゴリには、定義されたセクションに分割されたトピックが表示されます。

現在表示しているトピックは、参照しやすいようにサイドバーでハイライト表示されます。

各セクションは折りたたむことができるため、必要なコンテンツをより簡単に見つけることができます。

個々のセクションを展開して、コンテンツをより明確に表示できます。

:building_construction: 最近の改善の上に構築

この新しいサイドバーは、Discourse ドキュメントエクスペリエンスを改善するための継続的な取り組みの一部です。これは、ドキュメントの構造を改善して明確性を高めるための最近の作業に基づいています。新しいサイドバーは、再編成されたドキュメントをナビゲートするための直感的なインターフェースを提供することで、これらの構造的な改善を補完します。

これは、最近公開されたスタイルガイドに沿って、すべてのドキュメントトピックのコンテンツの包括的な見直しと組み合わされています。これは進行中の作業であり、進捗に伴って徐々に改善が見られる場合があります。

:ear: フィードバックをお待ちしています!

新しいドキュメントサイドバーを使用する機会はありましたか?皆様のご意見をお聞かせください!このトピックに、ご経験、提案、またはご質問を投稿してください。

全体的なドキュメントの取り組みに関する質問やフィードバックがある場合は、このトピックでお知らせください。

Discourse コミュニティの一員であることに感謝いたします。この新機能が皆様の Discourse エクスペリエンスをどのように向上させるかを楽しみにしています。

「いいね!」 22

新しい変更おめでとうございます。素晴らしいですね。 :clap:

  • すべてのカテゴリでライブフィルタリング
    現在の動作方法は難しいかもしれませんが、(サブ)カテゴリに関係なくフィルタリングできるとよかったです。それが最初に自然に試したことです。

    もちろん、ヘルプへのリンクもあります。それは素晴らしいことです。代わりに、以下のようなことを期待していました。

  • Ctrl + / を使用するとコンテンツが上にスクロールする
    検索入力にフォーカスするためのショートカットを使用すると、サイドバーとコンテンツの両方が上にスクロールします。ここではコンテンツが上にスクロールすることは期待していません。

  • コンテキスト認識の喪失
    フィルタを使用し、トピックをクリックしてからフィルタをクリアすると、ハイライトされたトピックが表示されない場合があります。編集: また、投稿からトピックに移動した場合も同様です。

  • トピックを表示する際に折りたたまれたセクションがハイライトされない
    トピックを表示していてセクションを折りたたんでいる場合、コンテキストの観点からセクションを何らかの方法でハイライトするか、単に強調表示すると便利だと思います。

「いいね!」 9

素晴らしい追加/改善です!:tada:

どこを見ればよいかがずっとわかりやすくなったので、ナビゲーションがとても簡単になりました :wink:

1つだけ気になるのは、カテゴリの順序とナビゲーションサイドバーの順序が違うことです。

Documentation では、最後の3つのカテゴリは次のようになっています。

Documentation > Migrating to Discourse
Documentation > Contributing
Documentation > Developer Guides

しかし、ナビゲーションサイドバーでは Documentation > Developer GuidesDocumentation > Contributing が入れ替わっています。

素晴らしい仕事です!

「いいね!」 4

一致した順序になっているはずですか?

別の順序はどこで確認できますか?

「いいね!」 1

モバイルです。

奇妙ですね。なぜあなたのものと少し違うのか分かりません。:thinking:

私が見ているのはこちらです:

また、ボックスに開発者ガイドのカテゴリ説明がないようにも見えます。カテゴリをミュートしたか何かですか?

「いいね!」 3

他のインスタンスでもこのようなカテゴリサイドバーを有効にできますか?

「いいね!」 2

それは Theme component GitHub - discourse/discourse-docs-sidebar です。

「いいね!」 5

ああ、それでした!問題解決です! :wink:

「いいね!」 5

自由に試していただいて構いませんが、これを完全にサポートできる状態にするには、まだまだやるべきことがたくさんあります。

サイドバーのUIを駆動しているインデックストピックのメンテナンスにはかなりのオーバーヘッドが伴い、カテゴリ内のトピックと一貫性を保つための組み込みシステムがありません。

現時点では、ドキュメントをここで維持するためのオーバーヘッドを受け入れ、ここでドキュメントを読んだり閲覧したりする体験についてのフィードバックを収集することに重点を置いています。このコンポーネントを使用してドキュメントをメンテナンスするのがどのようなものかについてのフィードバックよりも、現時点ではそのようなフィードバックを求めています。

「いいね!」 8

これは実に素晴らしいですね。正式リリースを楽しみにしています。

「いいね!」 2

以前のものよりずっと使いやすいです。より…明確です。しかし、より技術志向の人はこれを制限的だと感じるかもしれません。

ドキュメントは、必要であっても使用しません。ユーザーがフィルタリングを恐れているからです。このシステムはよりユーザーフレンドリーになるでしょう。

しかし、管理側からの絶え間ない愛情とケアが必要なら…:thinking:

「いいね!」 3

これらをご指摘いただきありがとうございます、@Arkshine!これらはすべて修正可能なので、できる限りのことをさせていただきます。

「いいね!」 2

ドキュメントのサイドバーが検索の動作を変更する方法がわかりません。タブレットでは、ドキュメントのサイドバーが表示されているときに、Enter キーを押しても検索結果が表示されません。「次へ」と表示されていますが、その理由はわかりません。

問題を再現できません。

iPadで試しました。

まだ発生しているか確認してもらえますか?

まだ発生しています。Chrome と Edge では再現できますが、Firefox アプリでは再現できません。

それでも再現できません。ドキュメントのサイドバーが原因であるとは考えにくいです。

検索コードは一切変更されません。

他の原因かもしれません。

使用しているセットアップについて、もう少し詳しく教えていただけますか?ブラウザのバージョン、OSなど。

Galaxy Tab S9 FE
Android 14; SM-X510 Build/UP1A.231005.007
Chrome 126.0.6478.123

外付けキーボードを試しました。これにより、Enterキーを2回押す必要があることが判明しました。

「いいね!」 2

Androidで再現できることを確認しました。

ドキュメントのサイドバーだけでなく、管理画面のサイドバーでも同様の問題が発生しています。

調査が必要です。

原因はすでにわかっています。

最適な修正方法については、内部で話し合います。

「いいね!」 4

以下のURLで問題が解決されるはずです。

すでにMetaで公開されています。

「いいね!」 5