The Cone Trees network The UX Bookmark UX Quotes UX Jobs in Singapore Nice one yeah!

Guidelines for Aligning Data in Tables for Great Table Usability

Status: Work in progress (what is this?)

I have had the privilege to work across the User-Centered Design (UCD) process on banking websites and web applications such as Business Information Systems (BIS) and Management Information Systems (MIS). All of these are obviously data-intensive and it is crucial that data representation in both table and graphical representation formats be not only defined but complete.

Here are my guidelines for aligning data in tables that will help you design tables that are both quickly comprehendible and through optimal alignment of data.

Aligning table header content

Header text should usually always follow the same alignment as the column content.

Table content that should be left-aligned

  • Text
  • Identification numbers that will not be added up. E.g.- ID
  • Column spanner content (a column spanner is the header that spans a few headers below it)

Table content that should be center-aligned

  • If all textual data in a column has the same number of characters and this number is at least 20% less than header text
  • Icons

Table content that should be right-aligned

  • Numbers that are usually added up, to the decimal point
  • Year
  • Date
  • Time