Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I'm working on a web application that shows a list of records with a "start" and an "end" date. Normally, the interval is shown like this:

 # | Period                  | Etc
---+-------------------------+----
 1 | 12/04/2014 - 14/04/2014 | A
 2 | 23/04/2014 - 02/05/2014 | Z

(Don't worry, I'm not using monospace fonts.) I thought that, for readability, records that span on a single day could have the interval collapsed:

 # | Period                  | Etc
---+-------------------------+----
 1 |       22/04/2014        | A
 2 | 23/04/2014 - 02/05/2014 | Z

But I was remarked that the "common user" of the application is more used to see both dates for the interval. Yes, but on an old AS/400 interface, not on a web application!

I think it's more tiring to force the user to read the same date twice only to discover it's actually the same, while s/he can have an immediate visual information about the record's time span. Old users could get used to that in no time (as they, in fact, should get used to the whole application).

What's the better approach?

share|improve this question

2 Answers 2

up vote 4 down vote accepted

The date should be shown only once, but aligned with the first date, but not show the dash indicating it's a range.

I think showing the same date twice is very confusing, because the user does not only read the same date twice.
After seeing what seems to be the same date twice, he would need to reread it to make sure he did not just misread. Then he needs to understand whether it could be intended, or is more probably an error in the software. Even then, it's still, not obvious whether that's just 'one date', or whether the empty range has some special meaning.

The date should be aligned with the first dates of the ranges, because it is the first date of the (empty) date range - nothing special up to this point.
It is not something like a middle date in some way. Moving it further right could be used to represent it is somehow "later" than the start of the interval - but it is not!

The place of the missing range end could be left blank, or - if it's needed for visual orientation on a large sheet - filled with some indication that it is intentionally not present, like - or n/a.

The proposed format would look like below:

 # | Period                  | Etc
---+-------------------------+----
 1 | 22/04/2014              | A
 2 | 23/04/2014 - 02/05/2014 | Z


There are also some good explicit arguments against the alternative layout using centered single dates combined with ranges:

One argument against showing the single date centred is the the left-to right direction represents the flow of time in the layout. That means moving something to the right indicate it's later in some way. But the empty range starts with the first date, like any other range, and then, it ends at the same date - while the other ranges end later - represented further right!

Another issue is a very technical problem - but may be hard to solve: If the layout is more wide than in the previous examples, like five times the width of a date, the visual structure is very different. If the width would change gradually, as with resizing a surrounding window, a real discontinuity could be seen. I'll show examples below, equal except for the width, to illustrate the difference in appearence.


The example table, two dates wide:

 # | Period                  | Etc
---+-------------------------+----
 1 |       22/04/2014        | A
 1 |       22/04/2014        | A
 1 |       22/04/2014        | A
 2 | 23/04/2014 - 02/05/2014 | Z
 2 | 23/04/2014 - 02/05/2014 | Z
 1 |       22/04/2014        | A
 1 |       22/04/2014        | A
 2 | 23/04/2014 - 02/05/2014 | Z
 1 |       22/04/2014        | A
 2 | 23/04/2014 - 02/05/2014 | Z
 2 | 23/04/2014 - 02/05/2014 | Z
 2 | 23/04/2014 - 02/05/2014 | Z
 2 | 23/04/2014 - 02/05/2014 | Z
 1 |       22/04/2014        | A
 1 |       22/04/2014        | A
 2 | 23/04/2014 - 02/05/2014 | Z
 1 |       22/04/2014        | A
 1 |       22/04/2014        | A
 2 | 23/04/2014 - 02/05/2014 | Z
 2 | 23/04/2014 - 02/05/2014 | Z
 1 |       22/04/2014        | A
 1 |       22/04/2014        | A
 1 |       22/04/2014        | A
 2 | 23/04/2014 - 02/05/2014 | Z
 1 |       22/04/2014        | A
 1 |       22/04/2014        | A
 2 | 23/04/2014 - 02/05/2014 | Z


The same table, same layout (!), but five dates wide:

 # | Period                                               | Etc
---+------------------------------------------------------+----
 1 |                      22/04/2014                      | A
 1 |                      22/04/2014                      | A
 1 |                      22/04/2014                      | A
 2 | 23/04/2014                -               02/05/2014 | Z
 2 | 23/04/2014                -               02/05/2014 | Z
 1 |                      22/04/2014                      | A
 1 |                      22/04/2014                      | A
 2 | 23/04/2014                -               02/05/2014 | Z
 1 |                      22/04/2014                      | A
 2 | 23/04/2014                -               02/05/2014 | Z
 2 | 23/04/2014                -               02/05/2014 | Z
 2 | 23/04/2014                -               02/05/2014 | Z
 2 | 23/04/2014                -               02/05/2014 | Z
 1 |                      22/04/2014                      | A
 1 |                      22/04/2014                      | A
 2 | 23/04/2014                -               02/05/2014 | Z
 1 |                      22/04/2014                      | A
 1 |                      22/04/2014                      | A
 2 | 23/04/2014                -               02/05/2014 | Z
 2 | 23/04/2014                -               02/05/2014 | Z
 1 |                      22/04/2014                      | A
 1 |                      22/04/2014                      | A
 1 |                      22/04/2014                      | A
 2 | 23/04/2014                -               02/05/2014 | Z
 1 |                      22/04/2014                      | A
 1 |                      22/04/2014                      | A
 2 | 23/04/2014                -               02/05/2014 | Z
share|improve this answer
    
Thanks. Any particular reason in support of using the left alignment? Do you think it improves readability? I think the centered alignment catches the user's eye more, but I may be mistaken. –  MaxArt Apr 9 at 8:04
    
Yes, I thing semantically, the single date is a "first date" (of an empty range) in that place - the user wants to understand what is the start of the range first, and then, whether it extends to later. The first step, reading the start, is just the same, and should happen in the same place. –  Volker Siegel Apr 9 at 9:31
    
Also, you would use the start date as a sort column; The single date would be part of this column. –  Volker Siegel Apr 9 at 9:32
    
I'm accepting this answer because it's more detailed, even though I'm still not totally convinced about the alignment. Aligning on the left can be less distracting when looking at sorted values, but I think it loses a bit of eye-catching capabilities in whole picture. –  MaxArt Apr 10 at 9:49
1  
Yes, it would be less eye-catching, but to me that is a good thing. We are trying to represent single dates consistently with ranges. So it is a good thing to make them look similar, in the aspects where they are similar. –  Volker Siegel Apr 10 at 9:57

I agree with volker, it must be a single date. However I feel that instead of keeping it aligned with the first/start date you should keep it in the center (as you have shown in your own script). The only reason being that when the information records increase this will improve the readability as it effortlessly grabs the user's attention.

Edit: Just add a visual cue to my point consider the following

enter image description here

Technically Volker has a substantial point but as far as the visual experience is concerned the centered date seemed a bit more appealing to me.

share|improve this answer
    
Regarding left aligning or centring the single date, see the last paragraph of my answer. –  Volker Siegel Apr 10 at 11:03
    
How would it look with runs of consecutive sinple dates? I think the "visual structure" of the layout would break down somehow, at least it there are multiple runs of different length. –  Volker Siegel Apr 10 at 23:14
    
I agree with you, but wouldn't that be the case in the left aligned dates as well. Although I think I see your point, the left aligned dates would not break down the structure considering the conventional view guide the user to view from left to right. It would leave a void towards the right but then that will be a judgement call. –  roni Apr 11 at 4:48
    
Imagine to have a table that is much wider, like five times the width of a date. That would make the issues with centring more prominent, while it just stays the two columns when left aligned. –  Volker Siegel Apr 11 at 5:30
    
Oh yes. A valid point. –  roni Apr 11 at 5:37

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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