ページに表示するテーブルの列が12〜14列あるが、すべての列を表示するのに十分なスペースがない場合(たとえば、テーブルの7つの列を表示するのに十分なスペースしかない場合)、これの解決策は何ですか?
私はページを水平にスクロールさせることができますが、それは醜いと最後の手段です。テーブルデータのフォントサイズを縮小する場合、最大で1〜2列のスペースしかありません。
2列だけを表示することを検討しましたか? 1つは値(連絡先、車番号、営業担当者、価格、その他の詳細のホスト)があり、2つ目は顧客の名前と値で行われますが、ドロップダウンを配置して各顧客を選択します。このアプローチでは、垂直方向の機能リストが保持されるため、顧客を選択するだけで済みます。矢印を追加すると、各顧客のデータを以下に示すように、各顧客をすばやくスキャンできます。
対処方法: テーブルの列がWebページに収まらない場合
あなたが述べたように、主なユーザーの必要性とフローがその月に販売された車の数のデータを表示することである場合、過去12か月ほどの月と各月の販売された車の合計の表から始めることができます。次に、(月の選択時に)月のタイトルが付けられた次のインターフェイス(両側にある戻る/進む矢印)にドリルダウンし、顧客の名前かどうかにかかわらず、次の主要な基準ごとに詳細を表示します。ユーザーとの簡単なリサーチセッションは、ユーザーフローの定義とユーザーニーズの優先順位付けに役立ちます。
以下の私のモックアップを参照してください:
テーブルをiframeで表示することをお勧めします。これにより、水平スクロールバーが確実に表示されますが、ページ上の参照ポイントが失われることはありません(ページ全体をスクロールすると、ナビゲーションとレイアウトが失われる可能性があります) )。
可能であれば、列を並べ替える機能(列を別の位置にドラッグする)や列をオンまたはオフに切り替える機能(セカンダリメニューを使用)などの追加機能を(パワー)ユーザーに提供します。テーブルに頻繁にアクセスする必要があるユーザーは、スクロールしすぎずに、重要な列を簡単に表示できるように表示をカスタマイズできます。
download bmml source – Balsamiq Mockups で作成されたワイヤーフレーム
これは、古典的なスプレッドシートの使用のように聞こえます。横スクロールは悪いことではありません。
初期表示の一部にする必要がある場合は、シートの左側に配置する必要があります。重要性が低い場合は、スクロールして確認できます。
Microsoft ExcelとGoogleスプレッドシートでは、特定の数の列を左に固定し、他の情報の列を左から右にスクロールできるようにすることで、一部のコンテンツを常に行ごとに表示できます。