Which direction should the arrows point in a sorted table?

In a sorted table, it's common to have an up or a down arrow indicating the sort style. However, I'm having some trouble determining which direction the arrow should point. In an ASC sort, characters are sorted 1-9A-Za-z. Should the arrow point up or down?

I've found implementations of both on the web, so that didn't help me much: Up and Down (you have to create the table first).

Is there a hard and fast rule for this? I find myself able to justify both implementations. Which method do you use? Which is more intuitive to you and why?

Edit: Some of you have suggested alternate implementations like rising bars or having letters with an arrow indicating sort direction. Great suggestions. I'm definitely open to other options. The less ambiguous, the better. It might be picky, but I'd really like there to be minimal or no confusion on the part of the user.

Edit: I ended up going with the rising and falling bars for now. It's not standard, but seems less ambiguous than the triangles. The current sort column shows three bars, small to large (left to right) for ASC, the opposite for DESC. Other sortable columns have no bars by default, but hovering over any sortable column heading (including the current) shows bars depicting how the table will be sorted if that column heading is clicked.

I don't think of them as arrows, but as a visual mnemonic of the current state. So, showing a triangle pointing down shows descending order. It is visually in line with the icon with the largest item (base of the triangle) at the top of the list and the smallest (point of the triangle) at the bottom.

I've always went with the following:

• Ascending -- Arrow pointing up
• Descending -- Arrow pointing down

In my opinion, the visual representation of the arrow pointing up/down most accurately explains the sort order.

I’ve done usability tests on this. There does not appear to be a consistent interpretation among users on what the arrows mean. I seem to recall that even each user was not consistent, thinking the arrow down meant ascending in one case and descending in another. I tried arrows to left and right (“forward” versus “backwards” sort), but they failed to be interpreted consistently too. I tried showing current state and showing the state that would result. Neither worked.

What did work was a schematic text depiction of the sort order: “A..Z” and “Z..A” for alpha, “1..9” and “9..1” for numeric, “1..12” and “12..1” for dates (the usability test used mm/dd/yy date format).

Show this text as read-only indicating the current state. Place a button beside the text to set or swap the sort order.

Didn’t try the rising/falling bar icon, but I expect it can run into difficulties where “bigger” is ambiguous. For example, is an older date in the past bigger (longer ago) or smaller (closer to Time 0) than a more recent date? Is Priority 1 bigger or smaller than Priority 2? Grade A bigger or smaller than Grade B? For that matter, who, other than geeks, thinks that “Zuschlag” is vastly bigger than “Abbott”? Not that I’m taking this personally, of course.

For some reason I feel is always backwards. For me the down pointing arrow/triangle should represent the way I usually read things (from top to bottom -> from a to z) and the up pointing arrow is backwards from the way I read things (from z to a). But that's just me, since most popular UIs (Mac, Windows, etc. etc.) use it the other way, they must know something :).

In any case consistency with what the user is used to is a good option.

My favorite is actually the way that e.g. Excel handles it -- don't use an arrow, but rather a custom icon with

A  |
Z  V

for ascending sort and

Z  |
A  V

for descending sort. Nobody will ever wonder which way you're sorting.

Now, if you can't use a custom icon but rather need a printable character, I'd say people are about as likely to be confused by either one. Windows uses the "small part of arrow corresponds to smaller value" for Explorer, which is to say that ascending sort points up. But plenty of other sources assume that the base of the arrow starts at the lowest value and points in the direction of the sort, which frankly makes as much sense as anything else. In other words, half your users will probably have to adjust either way.

Ascending : Arrow pointing up
Descending : Arrow pointing down

Tricks to remember:

Alphabets:

• A scending i.e. A B C D
• D escending i.e. D C B A

Numbers:

• A=1,B=2...Z=26.
• Ascending A B C D so 1 2 3 4 i.e. small to large
• Descending D C B A so 4 3 2 1 i.e. large to small

Date:

• Date is actually converts to a number, it increase on day base, so it works again a number system. today is bigger than yesterday, today is smaller than tomorrow.

An arrow pointing up usually means larger or getting larger, so that should be used for Ascending order. An arrow pointing downwards usually means something is smaller or getting smaller and it should be used for Descending order.

I like:

• arrow pointing down for ascending order
• arrow pointing up for descending order

Why? Because it feels like I just sorted the page. I clicked on the heading and it was "Wow! Sorted top-to-bottom". Why "top-to-bottom" is called ascending, is because the numbers/letters get higher in value as the computer writes to the screen. The opposite for descending. However, the list is actually descending down the screen from the top to the bottom - a to z. When you order it the other way, the beginning of the list is at the bottom of the screen.

So to the physical human mental logic - the kind that means clockwise is close and counter-clockwise is open, it makes sense to ignore how the machine sorts and outputs the data, and think rather about how a human might sort data: start at the beginning (smallest values) and at the top of the paper, then advance through to the end (largest value) on down the paper.

The reason the beginning is smallest, is because 1 comes before 2, and the Roman alphabet starts with A and end with Z. So this is sort of default for us humans at this point in time. We write top to bottom and left to right. It has to do with handedness and the way we hold paper - I think. I'm not actually human interface specialist. I just thought about why it seems more natural. The KDE guys are human interface specialists. Take a look how Oxygen is done.

The other way I think is alright is a triangle that is actually showing that the data is smallest to largest. Again, this is rather technical and at first glance, the human might not "get it".

I expect the arrows to show the current state (pointing up when the list is currently ascending). The is what Windows Explorer does in Details View.

in the classic Finder, Apple didn't use arrows. instead, there were a small icon that looked like three (or four?) horizontal lines of increasing or decreasing length. at first sight, it was like a triangle; but when looking at it, it was clear if it was getting bigger or smaller.

other GUIs (KDE, for example) use triangles, but most people interpret them as arrows, making the message ambiguous.

The other thing that you need to consider is whether the arrow represents the current sort direction or the sort direction that will be applied if you click on the arrow. (Not always obvious from the contents of the table as there can be arrows on every column)

Sorry to add to the confusion, but you need to consider this.

Clarification on this front can be partially achieved by adding a suitably worded tooltip to the arrow.

"Is there a hard and fast rule for this?" - Apparently not, since you found examples of both.

For general consistency, I'd say that the arrow should point up for ascending, down for descending. This is consistent with Windows (click a column header in Explorer) and Office (filter/sort a column in Excel).

Best place to check, in my opinion.. would be large corporate websites like amazon, dabs etc. as these will be what users are most used to.

I think everybody agrees that the direction of the arrow requires the users to think about its meaning. What does a down arrow mean? A-Z or Z-A? What does it mean when sorting dates? It is clear only when the user looks at the actual sorted data.

For this reason, I find it best not to use any indication of direction. It is enough to indicate the fact that rows are sorted by a certain column. It is important to find out which way the users usually expect the rows to be sorted for the first click. The second click reverses the order, the third click turns sorting off.

I have implemented this several times and users have no problem sorting the rows by different columns the way they like.

Remember that descending is for down. So, I would use the down arrow for descending. But, I always get confused by this anyway. I recommend that you use letters instead, like A-Z and Z-A instead of the arrows. Or, use them in conjunction with the arrows.

There is no hard and fast rule, but the best approach is to reduce the apparent complexity for the user, using the best mapping of down and up arrows to the terminology "Ascending" and "Descending".

Note that most non-numeric concepts doesn't have a strong natural mapping to "up" or "down". Do letters/words go "up" or "down" in the dictionary? How about dates and times? Where it is ambiguous, I believe there is no "right" answer - I recommend allowing "Descending" to represent the more useful sort order for consistency, as the user is likely to think about the table as being "down" as they move their eyes down. Leaving aside digital representations since the users of most applications do not know or care about the internal representation. Therefore alphabet sorting could be "Descending" for A-Z, and time could be Descending with most recent first. The good news is, as long as the first click gives the user the sorting behavior that they expect, and the second reverses it, they mostly won't care which of the two modes is used.

That challenge about the correct sort to do "first" (on showing the content, or sorting on a new column) is the more important implication of the question. The type AND intended usage of the information determines it should sort. Alphabetic should always default A-Z, "descending" by my above logic. Numbers vary much more by use: numbers that represent sequential identifiers, say, an employee ID would be ascending (1-10), while sorting on quantities or price would usually be descending, to bring the largest values to the top. Time also varies - most recent first ("Descending") usually works but in some contexts, the oldest should be listed first.

This is a highly opinionated question. But here is a logical solution and the reason behind why I chose it :

Solution:

If using an arrow to display sort order in a Table Column, it will be better to use a Down arrow for ascending and vice versa.

Reasons:

1. If we are referring to a picture or a graph, where visual and value based traversal are both in the same direction, using "Ascending" or "Descending" will serve its purpose as intended. But when it comes to Tables, the main source of confusion is that, the values are traversed to higher values (upward, but only conceptually) but the direction of visual traversal is downward. And since an arrow is a visual clue (direction) it might be easier for someone to understand the directional traversal better with it.

2. For many people the concept of ascending and descending are understandable in terms of values. But in certain cases, the users of that table might not be aware of these concepts. For example, someone who has never been to school or a primary school kid or someone completely new to digital world. For them, directional concept will be easier to understand. As in a-z, upward or downward. As in 1-9 upward or downward. It is to be noted that educated or experienced users can understand it either way (the 4th reason).

3. Next reason is that whether we are masters in digital tables or not, we have always written lists and tables. And in almost all the cases, we write it in ascending order in downward directions. So, it is somewhat hardwired to our brain.

4. Finally, the confusion on this issue always existed and a universal method is always better. To this day, I always analyse how the values are sorted to see if it is in ascending or descending order. The directional arrows never served its purpose since it is not reliable. For educated or experienced users knowing the order immediately will not be a problem. When we create a universal standard though, we must see to it that every probable user would be 'able' to understand it...

How I use it:

I use a tailed arrow for numbers, alphabets or any other values increasing progressively while traversing in that direction.

Since the values are increasing (by default), user can call it Ascending if he wants to, but the arrow is downwards. This also helps me in sorting 'word sets' (for example, the status of a record in the table. It may not be sorted in alphanumeric order but in order of status progression).

Hope this helped.