by anthony on 11/25/14 at 12:42 pm
Content sorting options allow users to find what they want without going through an entire archive. But many make the mistake of putting their sorting options in a dropdown menu. Users can only see the selected option, while the rest are hidden. This causes user frustration, but you can easily prevent it.
Instead of using a dropdown menu, use segmented buttons. Dropdown menus are useful for saving space when you have options that aren’t relevant to the user’s task. But when users are sorting, every sorting option is relevant for finding content. In the context of sorting, it doesn’t help to save space at the expense of losing visibility.
Segmented buttons allow users to see every sorting option available. It’s clear what the selected option is and what other options they can select. Users are able to sort faster and easier.
It only takes one click to select an option in segmented buttons. It takes a two clicks and a scroll to select an option in a dropdown. Users have to click to open menu, scroll to the option and then click to select.
The more options, the more horizontal space segmented buttons take up. But don’t let your number of options discourage you. You can still fit many options within the limited space. The example shows an 8 option segment, while another shows a 5 option one.
When the sort function is hard to find, users will resort to using the pagination. But paginations don’t order content by the criteria that users want. The sort function should always catch user attention so that they’re not forced to find content through pagination.
Which user interface control you use can affect user experience. Dropdown menus save space, but give users lower visibility. Segmented buttons give users higher visibility, but limits space for options. In a given context, ask yourself what matters more to users, space or visibility?