5

On a just-now-coming-alive web page, I have two columns: change and change-percent. In the headers of the two columns, I want to give the user a small control so he can toggle between sorting the columns by abs value; and arithmetically.

In the first case, I can show him something like:

 +-----+    +-----+
 | ABS | or | MAG |
 +-----+    +-----+

What two- or three-letter abbrev can I give him to select sorting by signed value?

Or what graphics can I use to express the same ideas clearly and with good affordance?

Improve this question
4
  • 4
    Mag...mag...mag...oh - magnitude! I get it. If your users get that, they'll also understand % and |%|
    – Roger Attrill
    Jul 19, 2011 at 15:01
  • 1
    Just out of curiosity, why is there a "valid html?" button at the top of that page?
    – Rahul
    Jul 19, 2011 at 15:51
  • 1
    @Rahul - I think it's a 'development only' HTML5 validity checker for debug purposes.
    – Roger Attrill
    Jul 19, 2011 at 16:49
  • @Roger Attrill -- " % and |%| " Brilliant! Thanks.
    – Pete Wilson
    Jul 19, 2011 at 22:34

3 Answers 3

Reset to default
5

At the risk of creating an SE black hole, here's my answer from the original.

I think ABS and MAG are decent keywords you can link to control sorting, especially if you have mouse-over text pop up that explains the action - i.e. "Sort by absolute value". You do have a nice setup with your icons though, and we should work to preserve that.

Currently, you have icons that you click to control highlighting and sort order (asc/desc)

Current

I think that you should separate them a bit, and enhance the sort order with an absolute value modifier. By clicking the word 'abs', you might highlight the word (to show that it's active) and toggle between sorting regardless of sign. Here's my prototype:

enter image description here

Cheers

Improve this answer
1
  • Thanks so much, that's very helpful! Now I'm looking for the abbreviation that tells the guy it's a signed-value sort rather than a sort by absolute value (abs). Aha! Maybe the string "+/-" would do it. I like your idea of putting the asc/desc icon in parens: that sets it off nicely. As to the threatening black hole, I notice the question was moved to at least one other group, as well, so we shall just have to wait and see :-)
    – Pete Wilson
    Jul 19, 2011 at 15:12
4

It's a pity that you have so little space availabe, otherwise you could expand on your sorted graphs icons. The bottom graphs are sorted on absolute value (red is for negative values):

sorted series

Abs(x) works pretty well as an abbreviation. If your users have a mathematics background, you could use |x| instead.

Improve this answer
0

I would just add to the other great answers that for clarification you should make sure to have prominent tooltips that explains in plain language the two sorting options:

  • "Sort by magnitude, from positive to negative numbers"
  • "Sort by absolute value, from large to small numbers, ignoring positive or negative valence."

To make the tooltip more effective you might consider:

  • including the graphical icon from the column header in the tip
  • short latency for tip display (e.g. 250 ms)
  • include links in tooltip to relevant sections on your site that provide context for your choice of sorting options.
Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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