1つのテーブルでデータ詳細のさまざまなレイヤーを提示する方法
私はeコマースソフトウェアのダッシュボードを開発しています。このダッシュボードは、広告キャンペーンを通じて顧客をこのeコマースに配信するウェブマスターに関する情報を提供します。
要件は、比較の理由でいくつかの「統計」データを1つの表に表示することです。これらのテーブルをいくつかのビューに分割することはできません。
データの列は15あります。これを3層の詳細に分割したので、テーブルを「ドリルダウン」できます（クリックして任意の画像を拡大します）：
最初のレイヤーは上部の概要で、左側にウェブマスターがあり、右側にデータがあります。
このビューを使用すると、ウェブマスターの合計データを比較できます。
2番目のレイヤーには、選択したウェブマスターの製品が表示されます。
各Webマスターの行を拡張して、製品ごとにWebマスターを比較することができます。
第3層には、製品に関する詳細が表示されます。ウェブマスターキャンペーンなど。
すべての製品行を拡張して、製品の詳細を比較することもできます。
このテーブルはデータで非常に過負荷になっていて、読みにくいという事実に同意します。色分けしてみましたが、満足のいく結果にはなりませんでした。
ユーザーがこの表を見て、どのデータがどの詳細層に属しているかを理解/確認してください。
この問題を解決するためのベストプラクティスはありますか？多分色分け（どの色）か異なるフォント/サイズですか？
私の経験では、これはシャドウがより深いレイヤーを表示するのに最適な場所の1つです。わずかに異なるフォントの太さ/色の扱いも役立ちます。
これがあなたの提案に従う私の結果です：
上位の概要： 
フォントサイズと色を調整するだけです。
第2層： 
変更された背景色、フォントの色は最初のレイヤーよりも暗い。最初のレイヤーで選択した行にボックスシャドウを追加し、2番目のレイヤーでグラデーションを追加しました。また、ハイライトの色が暗くなります。
第3層： 
2番目のレイヤーと同じ変更ですが、すべての色が暗くなります。
シャドウは、「ルックアンドフィール」を改善し、データの読み取りをはるかに容易にする3D効果を作成します。
皆さん、正しい方向へのプッシュをありがとうございました！