When presenting data tables on the web, a variety of techniques may be used. This study focused on the effects of table design treatments such as borders, font size, cell background colors, and spacing. Over 1400 subjects performed specific value retrieval tasks using 16 different table designs. The tables had different combinations of the following attributes: horizontal lines separating rows, vertical lines separating columns, alternating row background colors, large text fonts, small text fonts, tight spacing within tables cells, and loose spacing in cells.
The results revealed a clear winner: a design with alternating row background colors, large font, and loose spacing. This table design was superior to all other designs in both performance and subjective ratings. Among the poorer-performing table designs, one with horizontal lines separating rows, vertical lines separating rows, a small font, and tight spacing stands out as possibly being the poorest.
We also analyzed the results based on the tables’ individual design attributes. With regard to borders, we found that tables with alternating row colors, or “zebra striping,” consistently performed better and had higher subjective ratings when compared to tables with horizontal lines separating rows, horizontal and vertical lines, or no lines at all. With regard to fonts, tables with larger fonts performed significantly better than those with smaller fonts. Additionally, tables with looser spacing within their cells performed significantly better than those with tight spacing.