個人在工作中碰上如題問題炭分,一個數(shù)據(jù)量非常繁雜的報表需要展示在網(wǎng)頁中,如何處理剑肯?
首先捧毛,講一個很重要的屁話:
仔細推敲并溝通確定需求方的目的,只保留真正需要的部分让网!
好呀忧,假定溝通完依然存在非常多列表格,那么以下原則可以作為參照:
- 包容顯示溃睹,增加橫向scrollbar
(包容顯示建議加上固定某些關(guān)鍵行和列的功能而账,以免刷到后面不知所云)
- 動態(tài)顯示,增加對列顯示/隱藏的控制
-?響應(yīng)式因篇,檢測不同屏幕以顯示不同項目
- 數(shù)據(jù)類:長的數(shù)據(jù)可以用縮寫的方式泞辐,或保留較少小數(shù)位,鼠標(biāo)懸浮時再用tooltip來展示
不同長度的數(shù)據(jù)展示方式
- 標(biāo)題類:行標(biāo)題或者列標(biāo)題可以用傾斜的方式來節(jié)省列空間
- 內(nèi)容類:有的內(nèi)容可以用縮寫輔助以顏色的方式來顯示竞滓,同樣達到效果
- 相關(guān)多行顯示:將相關(guān)內(nèi)容展示在同一列中
(非常實用铛碑,原則上依然是用增加行空間的方式來節(jié)省列空間。但是由于同一列的相關(guān)性虽界,有時候反而比原來分列在易讀性上更強汽烦。如:姓名、性別和年齡展示在同一個列中莉御,稱為用戶列撇吞。)
根據(jù)相關(guān)性的多行顯示方式
在這種情況下俗冻,依然可以通過折疊次要信息來節(jié)省行的空間。
相關(guān)多行顯示后依然可以折疊次要信息
以上部分思考部分整理自ux stackexchange 的問答