<b>本文講的是這樣做才能設計出更好的資料表，</b>
<b></b>
**差強人意的表格。**他們哪裡沒有做對？
由于一些曆史原因，表格在成為網頁的必須品之後，因為有更加新潮，更加時髦的布局，它被很多設計師棄用。但是現如今，他們沒法在網頁上再創造出更多的外觀，而資料表格仍然可以用于收叢集組織很多我們日常生活中使用的資訊。
例如，我認為所有表格的起源是：美國的 <code>"Harmonized Tariff 的計劃表"</code>，一個包含有 3,550 頁的表格，它羅列了每一樣可以被進口入美國的貨物清單，包含有些令人興奮的貨物，例如，"男士外衣，短大衣，披肩，鬥篷，厚夾克（包括滑雪夾克），防風夾克和相似的東西（包括棉外套，背心夾克）。"
不過，什麼是短風衣？
資料表格讓人不爽的地方（毫無疑問），是沒有被精美的設計過，它看起來太醜了。設計是一個表格的關鍵: 如果正确的制作一個表格，它會讓複雜的資料變得容易檢索和比較。如果錯誤的制作一個表格，它能讓所要表達的資訊完全不能被了解。
是以，讓我們用正确的方式（制作一個表格），好吧？
了解你的數字元号
數字并非生來平等。我并不是在讨論 <code>π</code> 和 <code>∞</code>（雖然我常這樣，在實踐中）; 我正在讨論的數字，它們是 tabular 或者 oldstyle,lining 或者 proportional。
以下插圖展示了 oldstyle 和 lining 的不同。
<code>Oldstyle</code> Vs. <code>lining</code> 數字
<code>Oldstyle</code> 的數字在句子中看起來很漂亮，他們在小寫字母的大小和間距上比對得更好; <code>lining</code> 的數字更統一，并且加強了表的網格狀結構。
proportional 和 tabular 數字之間的差別并不明顯:
<code>Proportional</code> vs. <code>tabular</code> 數字
<code>Proportional</code> 數字被設計成比對顔色 - 它是一般的大小和字間距 - 的字型。<code>Tabular</code> 數字，另一方面而言，都是統一的的大小，是以每列數字都能整齊的排列起來。雖然這個差別在 1 或 2 行看上去不是那麼強烈，使用 <code>lining</code> 的數字會讓檢視大型的表格變得很容易并且更少的錯誤率。
如果你無法找到一個合适的有 <code>tabular</code> <code>lining</code> 字型，一個好的回退方案是 <code>等寬字型</code> - 當然他們會看上去像 <code>源碼</code>，他們能很好的在表内展示。額外的，新的 <code>Apple</code> 系統預設的字型 <code>San Francisco</code> 就有很出色的 <code>tabular</code> <code>lining</code> 數字，在小号的表現上也是很好看的。
3½ 關注這些簡單原則:
數值資料向右對齊
文本資料向左對齊
表頭和他們的資料對齊
3½. 不要使用居中對齊
數值資料從右向左讀; 我們比較數字通過先看個位數字，再看十位數字，等等。這就是大部分人學習算數的方法 - 先從右開始再往左，依次讀資料。是以，表格應該以右對齊的方式儲存數值資料。
文本資料從左往右讀（以英文為例）。比較文本元素通常是通過字母表的排序完成: 如果兩個文本的起始字母都是相同的，那就從第二位開始比較，依次類推。嘗試閱讀非左對齊的文本是很令人很抓狂的。
表頭，通常來說，應該和他們的資料對齊。這保持了垂直的行看上去很幹淨，并且提供了一緻性和上下文。
居中對齊會讓表格變得 “參差不齊”，這讓檢視變得更加困難，常常需要額外的分割線和圖形元素。
保持有效數字的一緻性 - 常常是小數點後的數字，是一種簡單又更好的對齊表格的方法 - 保持同樣位數的小數，每一列都一緻。有效數字是整篇文章的 "兔子洞"，是以我将簡單的闡述我的建議: 更少的有效數字，更好的效果。
為你的資料增加标簽是至關重要的。這些伴随着表格上下問的标簽，可能給讀者一個更廣的閱讀視角。
這聽上去像傳統觀點，但是賦予你的資料表格一個幹淨和簡潔的标題和其他你所做的設計決定是一樣重要的。有一個好的标題，表格是可擴充的: 他們能被用于不同的上下文，也一樣能被外部的資料引用。
在表格裡最常用的标簽是對資料的計量機關; 常常，它重複出現在每個資料點。無需重複給所有資料添加機關，在每列的第一個資料點上增加即可。
盡可能的保持表頭；資料表格的設計應當關注資料本身，并且表頭标簽會占據很多可視空間。
當決定對表選擇什麼樣式的圖形元素的時候，你的目标應該是在确定表格保真度的同時，減少表格占據的空間。一個可能的方式就是少用點墨水 - 無論何時，都不要設計元素的樣式。
如果你能在你的表格中對齊資料點，規則就不是那麼重要了。他們主要提供的便利是，允許你減少元素間距的同時，還能很好的區分開不同的元素。即使應用了一些規則，它也應該幾乎不會對你的快速閱讀造成困擾。
水準的規則是最有用的，因為他們允許你大大減少長表格的垂直間距占用的空間，讓對比不同的數值變得更快或者看到一段時間内（資料的）趨勢。
我有一個未經證明的規則是 斑馬條紋是糟糕的。實際上，非常糟糕。選用或者棄用。
背景在區分不同區間的資料時，是十分實用的: 比如，頻繁切換于單一值，總數和平均值之間。如果隻需要将資料高亮，為資料提供額外的上下文，或凸顯和前一時期不同的變化數值是需要用背景的，使用圖形元素會更好，例如 , † （我最愛的之一）, 或者 ▵.
另外，表格應該是單色的。使用顔色來提供有組織的上下文或者增加額外的意思，很可能提高了誤解和錯誤率，并且對那些視力不好的人來說會造成使用上的問題。
<b>原文釋出時間為：2016年08月13日</b>
<b>本文來自雲栖社群合作夥伴掘金，了解相關資訊可以關注掘金網站。</b>