I want to let the user toggle a column heading to sort a grid by a date field.

How can I make the ascending/descending dichotomy intuitive?

EDIT: I was looking for date-column specific solutions.

  • 1
    A great example for the confusion around these icons can be seen in this Font Awesome issue. They ended up adding every possible combinations, but which one should we use? Can you figure out the meaning of each icon? – totymedli May 17 '19 at 21:46

The convention is to have an upward arrow for ascending lists and a downward arrow for descending lists. It doesn’t work. In usability testing I’ve done, users are evenly split on whether my name ends up at the top or bottom of the list no matter which arrow you show.

Part of the problem is there is just something cognitively weird about an upward arrow meaning the list increases when you go downward in the list. However, I tried left (ascending/forwards) and right (descending/backwards) arrows, and still had unacceptable performance.

The only thing I found that works is a generic alphanumeric representation of the bounds. For example:

Name (A--Z)

File Size (1--9)

Date (1--12)

I found that it’s not necessary for the bounds to reflect the true minimum and maximum values in the list.

It’s up to you if you think it’s worth the clutter. Users I talked to say they look at the items in the list to see the order, and ignore the symbols in the header. Maybe that’s good enough for your situation.

|improve this answer|||||

The preferred way to do this seems to be with an "up" triangle (▲) for ascending and a "down" triangle for descending (▼).

|improve this answer|||||
  • What Marcos said, plus applying a rollover effect on the column header. – ThomPete Oct 18 '10 at 18:10
  • I never remember if "up" is ascending or descending (even in software I wrote) so I always just look at first two items to see the order - and that's why I like Michael Zuschlag's answer – Nir Oct 19 '10 at 10:48

Another possiblity is to use small ascending and descending barcharts.

For example ascending sort

|improve this answer|||||
  • Welcome to the site, @Naveen. The OP's question asks specifically about a date column. Can you provide evidence that this solution works for dates? – Graham Herrli Nov 25 '15 at 17:55
  • That is really ambiguous, especially if you do it for alphabetical order. Is "A" the small or "Z"? It becomes worse when you have to invert it: should we flip both icons or just one of them? Which one? The arrow or the bars? – totymedli May 17 '19 at 21:43

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.