What's the best font for a data table? Monospace is good but takes up more room, so you can't have as much whitespace between the items. Similarly, what are some good usability principles for data tables? Things like zebra striping, etc. I've tried searching Alertbox but haven't found anything.

4 Answers
4

MIL-STD 1472F Section 5.14.3.5 has a pretty good section on displaying tables in a user interface, although it could stand some updating for modern GUIs. Here are some of the standards, along with my interpretation marked with a bullet for GUIs:

5.14.3.5.4 Titles. For a table that takes up multiple pages, column headers shall be on every page for table.

By extension, if the user must scroll to see all the items in the table, headers shall always remain in view (e.g., by putting them in a non-scrolling div or repeating them).

5.14.3.5.5 Horizontal extension. Tables shall not be split up horizontally across pages.

It’s better to have horizontal scrolling, as long as the row header (record identifier) is fixed so it doesn’t scroll out of view.

5.14.3.5.6 Lists. Items in lists shall be arranged in a recognizable order, such as chronological, alphabetical, sequential, functional, or importance.

This should only apply if the list is fully in view without the need to scroll.

5.14.3.5.10 Justification of numeric entry. Users shall be allowed to make numeric entries in tables without concern for justification; the computer shall right-justify integers, or justify with respect to a decimal point if present.

That is, the decimal place of all your numbers should line up to allow easy comparisons.

5.14.3.5.11 Labeling units of measurement. The units of displayed data shall be consistently included in the displayed column labels.

5.14.3.5.13 Column scanning cues. A column separation not less than three spaces shall be maintained.

That translates into about 12 pixels, using 12 point Arial as the standard

5.14.3.5.14 Row scanning cues. In dense tables with many rows, a blank line shall be inserted after a group of rows at regular intervals. No more than five lines should be displayed without a blank line being inserted.

@Kevin The original 1472 was a consolidation of various other human factors standards. I assume they’re from both formal research and “lessons learned” from operational experience. Human factor engineering came into its own in the military in the 1940s when the armed forces had to contend with ordinary men using the new advanced and complicated technologies of the time (e.g., radar, analog artillery computers, high-performance aircraft) in high risk and high stress contexts. That’s still true today, so the military takes HF very seriously.
–
Michael ZuschlagNov 10 '10 at 14:36

1

You read some of the standards and think, “Why would anyone design otherwise?” Well, apparently someone did, and the consequences were ugly. So they added a standard for it. “MIL-STD 1472: Preventing dumb-ass designs since 1968.”
–
Michael ZuschlagNov 10 '10 at 14:37

It's best to use a sans serif font (such as Helvetica or Verdana) because it's cleaner than a serif font (such as Times New Roman) and therefore doesn't make the table seems cluttered. Why? A serif uses decorative "feets" or curls while sans serif don't. There have been various studies to measure which font type has the highest readability onscreen such as "The Effects of Font Type and Size on the Legibility and Reading Time of Online Text by Older Adults" or "The impact of web page text-background colour combinations on readability, retention, aesthetics and behavioural intention" and sans-serifs are more effective. When the interface gets cluttered it affect our cognitive load which makes it harder for us to understand the table.

Even though I haven't done a statistically significant study about it myself, people I have asked seem to think that sans-serifs in tables are more visually pleasing. (You need to ask (or do a brainscan to be extrasure) your target group to be sure they will have the same experience to.)

If something is visually pleasing it is going to affect the percieved usability of the table. There is also a strong correlation between aesthetics and user's satisfaction and pleasure. This has been studied in for example "A neuropsychological theory of positive affect and its influence on cognition. Psychological Review, 106, 529-550." Why? - Because some of the cognitive influences of positive mood are due to increased levels of dopamin in frontal cortical areas that result from the events eliciting the elevation in mood. You could also check out the study "Assessing dimensions of perceived visual aesthetics of web sites".

I've only found one study that tries to measure the reading speed and accuracy between plain tables and zebra-striped tables and there seems to be almost no difference at all between these two. See the full study here

However people tend to like zebra-striped tables better probably because it looks nicer. (See the paragraphs above for reasons why this is important)

If you are generating very long tables with a lot of columns that people need to scroll - use a fixed table header so that people could see what the numbers means without being dependent on their short (very short) term memory.

Why is sans-serif cleaner than serif? Why is there no difference between zebra-stripe and plain table formatting? Which people like zebra-striped tables better? Define "nicer"?
–
Rahul♦Jan 17 '12 at 18:25

Well... :) I thought it was enough to just look at a sans-serif and a serif font to see that there is a difference between how detailed they are. The zebra-stripe issue is described in the study which I added a link to in order to give a short and focused anwser. But ok. I've updated my answer. Hope it get you in a better mood...
–
Tony BoleroJan 17 '12 at 21:34

I wasn't in a bad mood :-) The thing is, we value answers that point to references over opinions. Imagine if this were your job and your boss/client asked the question. Would you just give her your opinion, or back it up with research/data? Another way to look at it is as a Wikipedia article. On Wikipedia, a lot of what you wrote would be edited with "citation needed" because there's no way to verify what you're saying is actually true. That's all we're trying to pursue.
–
Rahul♦Jan 17 '12 at 23:47

Haha! Hope you didn't got offended. It's the fact thing I like with Stackexchange and as you can see now when I included the research behind my answer I was never throwing around opinions either.
–
Tony BoleroJan 17 '12 at 23:58