I usually see this on tables or forms where some are using dropdown and some are using "unfold more" icon. Is there any difference or each icon has its own meaning?
OR
Other Reference:
6 Answers
To my understanding, they all are sorting icons that represent different state of the sorting. These images were taken from font-awesome.
(http://fontawesome.io/cheatsheet/)
In the case of a drop-down, it doesn't make any difference which icon you are going to use, as long as it delivers the message that it is a drop-down.
Both of what you have shown work since they are quite commonly used. Try to keep it consistent with the whole system.
answered May 22, 2017 at 9:54
-
-
not necessarily true for all cases; in the question the "fa-sort" type of icon is used on a drop-down that doesn't imply any type of sorting, it's just an option selection– LucianoMay 22, 2017 at 10:00
-
-
@Luciano exactly like on this link i found: thedesigninspiration.com/blog/2013/08/26/…– SknnyMay 22, 2017 at 10:02
Both the icons which you have attached are totally different.
- This one can be used as indicator of dropdown in combo-box or menu items.
- This icon is used to increase or decrease values in a input field like a slider.
I'm not sure if I get the second icon right, but it looks to me like it's two icons; expand and collapse view. In that case, the one on the left is the same as the bottom one on the right.
If that's not the case, the two icons are very different. The one on the left is to indicate a dropdown menu and the one on the right can increase or decrease a value. For example in a spinner or slider.
answered May 22, 2017 at 7:26
-
I added some images which unfold more icon was used for sorting which doesn't define increases or decreases value.– SknnyMay 22, 2017 at 7:35
In my experience the caret in a user interface simply means "more". It can be used as a toggle to expand/collapse a section, as a dropdown icon, or in a content slider to indicate more content to the right (or left). The direction of the "more" is usually indicated by the direction the caret is pointing.
See this answer: https://ux.stackexchange.com/a/21531/9932
And this answer: https://ux.stackexchange.com/a/96650/9932
-
-
In the case of sorting a caret isn't used unless a column has been sorted. The caret is usually an indicator of two things: 1. that the column is sorted vs not sorted, and 2. the direction of the sort (asc vs desc). Therefore the caret is not indicating "more" in a sort, and usually isn't displayed until after the user decides to sort a column. See this answer: ux.stackexchange.com/a/80660/9932 May 24, 2017 at 12:06
In my opinion, those icons are different.
I have never seen a sort icon that uses chevrons, I have only seen it using arrow triangles.
The expand chevron indicates hidden content that typically appears below something, for example a heading in a box which is expandable and collapsable, for example an accordion.
The unfold icon to me indicates that you can unfold content inbetween content. For example when you search for a public transport trip and you'll first see only start and end destination. I would use this icon to unfold the stops inbetween start and end destination.
It completely depends on the context of usage.
- Drop down or sorting
- Next / Previous or Up / Down or Increase / Decrease
