1

So I have a plain old button (two buttons to be exact). The button reads "SORT", when you click the button, an option comes up and lets you choose a sort type.

I have two types of sorting: price and alphabetical.

For price, I decided to use font-size to designate ascending/descending order.

Something like this:

<span style='font-size:x-large'>$</span>
<span 'font-size:medium'>$</span>
<span 'font-size:small'>$</span>

This does not directly use the word "Price" but signifies order and variable. I currently use text for alphabetical ordering, but would want to switch to a symbolic approach like: a-Z or Z-a to signify alphabetical ordering.

So, my question is what is the BEST way to signify alphabetical order?

My own idea on the best way

  • 1
    Alternatively, you can use a drop-down menu similar to Amazon.com or eBay.com – kcdwayne Mar 20 '14 at 12:12
3

I knew I had seen this before but here was an example of how Microsoft handled it. Pretty straightforward. There might be a prettier way to design the icon though. :)

enter image description here

3

Alternatively– a you mention price as another "column"– you could integrate the sorting buttons into the list itself similar to a sortable table. Unless the objective is to enable sort hierarchies (e.g. by name, then price).

Table sort

  • I think the column based is the best. It's pretty well assumed that first comes index, and by clicking any column header, the list gets sorted first by low-to-high (a-z), and by clicking that column again, high-to-low (z-a). It's what I prefer any day of the week. – kcdwayne Mar 20 '14 at 12:12
  • I don't use a table, so clicking 'columns' are not useful to me, I use a horizontally scrolling list, but thanks for the suggestion. – SoluableNonagon Mar 20 '14 at 14:47

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.