[翻譯]更好的設(shè)計數(shù)據(jù)型表格

【翻譯】Design Better Data Tables

一痕鳍、了解數(shù)字

不是所有數(shù)字都是均勻的或相等的。這里的數(shù)字指的不是π或者無窮饭冬,這里說的數(shù)字可能是表格式灾馒、復(fù)古風格的茎用,或者是襯線字和等比例分布的數(shù)字。

下面是一個關(guān)于復(fù)古字和襯線字的簡單對比:

復(fù)古風格的數(shù)字在句子里面看起來比較美觀睬罗,因為他們在英文的句子里面更加匹配小寫字母的大小和留白轨功。襯線的數(shù)字就顯得更加證實一點,并且可以有效地加強表格的格子布局容达。

下面是關(guān)于等比型數(shù)字和表格型數(shù)字的簡單對比:

右邊表格型的數(shù)字古涧,每個數(shù)字所占的空間大小都是均勻的,所以在一列數(shù)字里面可以看起來比較整齊花盐,不會參差不齊羡滑。然而上面這兩種字體在一兩行內(nèi)菇爪,差異不會很大,在數(shù)據(jù)量比較大的表上上柒昏,用表格式的數(shù)字會使用戶更容易瀏覽以及減少信息錯位凳宙。

二、了解對齊

這里有幾天對齊準則:

1)數(shù)字型的數(shù)據(jù)需要右對齊

2)文字性的數(shù)據(jù)需要左對齊

3)表頭的字段跟它的數(shù)據(jù)對齊

4)不要使用居中對齊

數(shù)字型的數(shù)據(jù)閱讀順序是從右到左的昙楚,也就是說近速,我們對比一系列的數(shù)字诈嘿,我們首先從個位數(shù)開始看起堪旧,然后是十位數(shù),接著是百位奖亚,以此類推淳梦。這也是為什么大部分人學習數(shù)字,都是從個位數(shù)開始昔字,從右到左爆袍。因此,在一個表格里面作郭,數(shù)字需要保持右對齊陨囊。

文字型的數(shù)據(jù)人們一般是從左到右進行閱讀,不管是英文還是中文夹攒,對比文字型的文字元素一般來說是通過拼音的順序蜘醋,如果兩個文字型數(shù)據(jù)有相同的第一個首字母,那么第二個字母就會被用來作為識別咏尝,以此類推压语。所以如果文字型的數(shù)據(jù)不是左對齊的話,想要快速瀏覽文本數(shù)據(jù)會好氣人编检。

表頭胎食,通常的,都需要跟它的數(shù)據(jù)的對齊方式一致允懂。這樣使得表格的豎直方向厕怜,保持一致性和上下有關(guān)聯(lián)。

居中對齊蕾总,讓看起來像被咬碎的步一樣酣倾,這樣會讓數(shù)據(jù)更難被快速瀏覽。如果是這樣的話谤专,就要需要額外的分隔線或者可視化的元素來分隔這些數(shù)據(jù)躁锡。

一致的有效數(shù)字=更好的對齊

一個簡單的保持規(guī)整的辦法就是把相關(guān)的數(shù)字用同樣的有效數(shù)字。有效數(shù)字是一個很大的話題啦置侍,所以最簡單的建議就是映之,越少的有效數(shù)字的個數(shù)越好拦焚。


三、更少的杠输,更簡潔的文字標簽


文字標簽對于一個數(shù)據(jù)型表格來說是很重要的赎败。一系列關(guān)于數(shù)字的文字說明,會讓更多人讀懂表格蠢甲,適用于更多場景僵刮。

1)標題

這聽起來像是傳統(tǒng)的智慧,因為給你的表格定義一個清晰的和重要的標題非常重要鹦牛。有了一個好的標題搞糕,這個表格就可以變得很靈活了,可以在多種情境下使用或者被其他外部的內(nèi)容引用曼追。

2)單位

單位是一個很常見的元素窍仰,它使得一堆數(shù)字變得有意義。通常它會跟在每個數(shù)字的后面礼殊,重復(fù)又重復(fù)驹吮。所以對比起重復(fù)在表格內(nèi)容中重復(fù)使用單位,可以在表格的每一列第一個數(shù)字后面帶著單位就可以晶伦。

3)表頭

保持表頭越短越好碟狞,在數(shù)字型表格里面,數(shù)字本身才是最重要的婚陪。而且一個很長的表頭會占用很多沒用的空間族沃。

四脓匿、尺標

如果你真的有規(guī)則地去對齊了表格里面的元素井誉,那么一些用于標識或?qū)R的線就會顯得很多余谓形。這些表示對齊的線的最大的作用就是減少兩個元素之間的留白屠阻,同時又能清晰地分辨出兩個元素而已采桃。但是哆档,就算要用睛琳,也要確保那些為了使元素對齊而使用的線是輕量級的汇四,盡量少地影響到用戶快速掃描表格中的數(shù)據(jù)锯玛。

相反的咐柜,水平的分隔線 確實非常實用,因為這確實明顯地可以減少長表格在豎直方向上空間(因為如果不用分割線的話攘残,就會需要更大的留白來區(qū)分豎直方向上的信息)拙友,這樣用戶就能更快速地掃描和對比一大串相關(guān)的數(shù)據(jù),從而看出變化趨勢歼郭。

有一個未經(jīng)證實的觀點遗契,作者個人覺得斑馬色塊分隔的方式真的很爛,真的病曾,超級爛牍蜂,把它拿走把!

五鲫竞、背景

背景的使用辐怕,在表明不同含義的數(shù)據(jù)上非常有用。比如表示數(shù)據(jù)的總合或者平均值从绘。想要突出一些數(shù)據(jù)寄疏,來表明它們在一個時間段內(nèi)的變化的話,可以不用背景色僵井,用一些箭頭或者其他有顯著含義的符號去取代陕截。

另外,表格最好是單色的(或者是黑白顏色的)驹沿。如果用一些不同的顏色去賦予整個有條理有組織的表格更多的含義的話艘策,那么就需要考慮蹈胡,這可能會帶來一些誤解或者認知錯誤渊季,以及一些可用性的問題了。

六罚渐、總結(jié)

表格或許真的很枯燥却汉。但是它是所有多數(shù)據(jù)的文件里面最重要的元素,所以設(shè)計師們投入的每一份力量荷并,都是值得的合砂。為了設(shè)計出更加高效、清晰源织、易用的表格翩伪,設(shè)計師們可以廣泛地提升用戶在理解和分析大量數(shù)據(jù)的過程中的痛苦的體驗。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末谈息,一起剝皮案震驚了整個濱河市缘屹,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌侠仇,老刑警劉巖轻姿,帶你破解...
    沈念sama閱讀 221,576評論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異逻炊,居然都是意外死亡互亮,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,515評論 3 399
  • 文/潘曉璐 我一進店門余素,熙熙樓的掌柜王于貴愁眉苦臉地迎上來豹休,“玉大人,你說我怎么就攤上這事桨吊⊥” “怎么了窑眯?”我有些...
    開封第一講書人閱讀 168,017評論 0 360
  • 文/不壞的土叔 我叫張陵,是天一觀的道長医窿。 經(jīng)常有香客問我磅甩,道長,這世上最難降的妖魔是什么姥卢? 我笑而不...
    開封第一講書人閱讀 59,626評論 1 296
  • 正文 為了忘掉前任卷要,我火速辦了婚禮,結(jié)果婚禮上独榴,老公的妹妹穿的比我還像新娘僧叉。我一直安慰自己,他們只是感情好棺榔,可當我...
    茶點故事閱讀 68,625評論 6 397
  • 文/花漫 我一把揭開白布瓶堕。 她就那樣靜靜地躺著,像睡著了一般症歇。 火紅的嫁衣襯著肌膚如雪郎笆。 梳的紋絲不亂的頭發(fā)上,一...
    開封第一講書人閱讀 52,255評論 1 308
  • 那天忘晤,我揣著相機與錄音宛蚓,去河邊找鬼。 笑死设塔,一個胖子當著我的面吹牛凄吏,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播闰蛔,決...
    沈念sama閱讀 40,825評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼痕钢,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了序六?” 一聲冷哼從身側(cè)響起任连,我...
    開封第一講書人閱讀 39,729評論 0 276
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎难咕,沒想到半個月后课梳,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 46,271評論 1 320
  • 正文 獨居荒郊野嶺守林人離奇死亡余佃,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,363評論 3 340
  • 正文 我和宋清朗相戀三年暮刃,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片爆土。...
    茶點故事閱讀 40,498評論 1 352
  • 序言:一個原本活蹦亂跳的男人離奇死亡椭懊,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情氧猬,我是刑警寧澤背犯,帶...
    沈念sama閱讀 36,183評論 5 350
  • 正文 年R本政府宣布,位于F島的核電站盅抚,受9級特大地震影響漠魏,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜妄均,卻給世界環(huán)境...
    茶點故事閱讀 41,867評論 3 333
  • 文/蒙蒙 一柱锹、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧丰包,春花似錦禁熏、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,338評論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至寄症,卻和暖如春宙彪,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背瘸爽。 一陣腳步聲響...
    開封第一講書人閱讀 33,458評論 1 272
  • 我被黑心中介騙來泰國打工您访, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留铅忿,地道東北人剪决。 一個月前我還...
    沈念sama閱讀 48,906評論 3 376
  • 正文 我出身青樓,卻偏偏與公主長得像檀训,于是被迫代替她去往敵國和親柑潦。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 45,507評論 2 359

推薦閱讀更多精彩內(nèi)容