• 3 months
  • 12 years, 3 months
  • 10 years
  • 8 years, 6 months
  • Please provide a bit more context and/or a screenshot. E.g. Where (website/desktop/mobile/paper)? What? Who's your audience? – msp Jul 11 '14 at 13:00
  • Context: List of contract periods. Audience: Federal government employees. Platform: Website only. – user2411234 Jul 11 '14 at 13:59

The best readability for visual comparison (i.e. to be able to compare the values) of the exact text format given in the question would be:

           3 months
12 years,  3 months
10 years
 8 years,  6 months
 8 years, 11 months

I don't think that keeping the values in a single column and mixed with text like this is ever going to be a good solution. Years and months just don't go well together in a single column

  • You could have 2 columns (labeled years and months) to display the values.
  • Perhaps display the years and months value as a single (rounded) decimal value, and only display the number of months as a tooltip, or when the user selects a cell.
  • This is interesting, do you have any outside resources that goes into more depth as to why this is best for visual comparison? – Charles Wesley Jul 11 '14 at 15:56

Without any more detail for context, my vote goes for left-aligned, unless the quantities themselves line up despite the units. See for yourself:

    3 months
    12 years, 3 months
    10 years
    8 years, 6 months


              3 months
    12 years, 3 months
              10 years
     8 years, 6 months

But, the following looks good:

              3 months
            147 months
            120 months
            102 months

Mind you, 147 months doesn't really translate to a "usable" value in my head though...


Generally, right alignment of numbers is better because it allows for easier understanding of the relative magnitude of each value (in part this stems from the way simple math is commonly taught at school, at least in "Western" nations).

The key here is that the number is the thing that should be right aligned; the unit is different. So, one approach would be to use two columns:

 3 months
12 years
10 years
 8 years

Note that this leaves out the lesser figures; in some contexts, you don't need to show every detail, an approximate accuracy may be ok. (Having a tooltip with the exact value might be useful for some users.)

If greater accuracy is required, you could show fractions:

 3.0 months
12.3 years
10.0 years
 8.5 years

You could use a smaller unit:

  3 months
147 months
120 months
102 months

Or you could use a more compact representation

12y 3m
10y 0m
 8y 6m

The key is that you need to permit (encourage!) your users to understand the relative magnitude of the values; consistent formatting (including alignment) is important to allowing automatic cognition. Having blanks to the right of a value (say as might be shown next to the 10 year value) will impact negatively on this cognition.


I like Franchesca's idea of using Years and Months as column headers with only digits as the values, but if you can't do that due to the column header needing to be something specific and must put the year/month terms in the values, I would make them uniform by always listing the years and months terms for each value and include 0's to precede single digit numbers. This way you could left or right align the column and it wouldn't matter:

00 years, 03 months
12 years, 03 months
10 years, 00 months
08 years, 06 months


00 yrs, 03 mos
12 yrs, 03 mos
10 yrs, 00 mos
08 yrs, 06 mos
  • 1
    -1 Compared with Francesca's answer that you reference, all those extra 0s are unnecessary visual clutter. – Graham Herrli Jul 11 '14 at 14:28
  • @3nafish - I disagree. It's about alignment and uniformity. Those extra 0s are necessary to allow one to left align or right align depending on what they want to do. It also allows you to list the years and months for each value that without doing so makes it look like a hodge-podge hack job. – Code Maverick Jul 11 '14 at 14:34

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.