1

I'm designing a filter for a website with a job search abroad. Filter has to refine vacancies displayed on the right side. I saw a lot of similar websites with job search use dropdown menus. But on my opinion options should be visible, multi selectable and easy selectable (dropdowns have accessibility problems).

What are the types of data I should use dropdowns for?

Are checkboxes good for binary data like sex, availability of accommodation (yes/no)?

Also while I'm on topic of filters is slider to regulate price good UX?

enter image description here

1

BTDT

The plus point with dropdown over checkbox is that their size remains same despite the selection(in case of non-multiple select). You can represent several options/data without occupying much space, which is not possible with radio/checkbox.

The drawback with dropdown is that most of the options are hidden from the user and they are visible only when the user opens the dropdown.

Coming to your questions:

So for what are type of data I should use dropdowns?

When there is a huge list of data and you have to show them without occupying much space. And, the data need not be present on the screen all the time.

Are checkboxes good for binary data like sex, availability of accommodation (yes/no)?

Use radio box instead of a checkbox for binary data

Also while I'm on topic of filters is slider to regulate price (like on 3rd filter on the image below) good UX?

Sliders are preferred only when the range is small ie the difference between the upper and lower limit is low. Otherwise, in case of large difference, it's difficult to select the exact value in the slider.

When designing such interfaces, you should also consider the development efforts and whether such designs are possible for the backend to replicate in the database. Lets discuss each filter:

Salary:

I will suggest creating a range for the salary by dividing the numbers into section ie 1 to 10, 11 to 20 etc. The reason is that it will be difficult to set a maximum limit. Once, you have a higher maximum limit the range slider will be difficult to use in the given small area. So, a dropdown with range will be good.

Age:

Age can be a slider since you know the lower and upper limit and the difference between them is not high

Sex:

How will you handle transgender, any, all option? Also, when companies post about jobs, they usually select "Any" or "All" in Sex field. You should have handled that as well. The dropdown or checkboxes will be better here since you can offer the user to keep the field unselected while this will not be possible in radio boxes. Another point to note is that the radio, the checkbox will occupy more space compared to the dropdown.

Worktime

This goes better with checkboxes since there are only two values.

Country & City:

I will prefer the design on the 2nd screen. A search in a long list is a good feature. This will avoid the case where the user has to scroll down the list to find their choice.

Accommodation:

Since there can be either one selection for this option, it's better to use radio box.

On a side note, try adding "Any" or "All" option in the necessary fields such as Accommodation, Worktime.

  • Thank you for an extensive reply. Wouldn't it be more convenient if I remove slider and just leave "from" & "to" fields? That way user can use filter how he wants instead of picking from predefined values. Also there will be no transgender option, only male/female. I plan to handle any option when both checkboxes are checked or unchecked, that way results for both genders will be displayed. Is this solution better than dropdown with male, female, any options? – Peter Mar 30 '18 at 12:12
  • I believe sliders are more easy and convenient. User don't need to type anything and any input can be made using mouse itself or trackpad. – K K Mar 31 '18 at 2:57
  • If the number of options in checkbox and radio are less then they are good to use. In case of more options, a drop-down should be used – K K Mar 31 '18 at 2:57

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

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