I'm currently working on a responsive faceted search. The user should be able to refine its search by region but also by country (within a region).

Region filter

I'm wondering what is the best way to handle this second layer of filters. My first idea is to use a tree layout and make each region expandable/collapsible to show all countries in a specific region.

Is there a better way to do that?


3 Answers 3


I would say your solution of providing a second level of filters based upon the primary filter would work best as it allows the user to establish the primary hierarchy (which is the country name) and the relational mapping which is the region name allowing him to drill down from a higher level to a lower level as needed.

How you would do that would depend on whether you are planning to allow multiple sub filters at that level. If you are planning to just allow filtering by say one region, then links would work best else checkboxes would work fine.

To quote this article from UX Matters :

There are two basic ways of selecting values for filters: drill-down and parallel selection. Ignoring the various modalities of the many derivative mechanisms for these primary modes of selection, the two basic ways of specifying a value for a filter essentially boil down to two choices: links and check boxes.

A link is the simplest mode of filter selection. By clicking a link, a customer can either select a single value for a specific filter or drill down a level in a taxonomy, like a category or department hierarchy. Amazon.com, shown in Figure 1, provides one of the best examples of a search results user interface that uses links to indicate filter value selections. Links usually indicate a straightforward equals condition—for example, I want to narrow my search results to Department = Books—as they do on Amazon.

enter image description here

The use case there is where you are looking to help the user exclude other branches in the taxonomy entirely. This is good for very deep sites.

However if you are looking allowing multiple sub filters, This is also done pretty well by Volkswagon which provides faceted search to filter down based upon Models by providing multiple checkboxes

enter image description here


How about dynamic tabs? The tabs and data change depending on the accordion channel being addressed.

Dynamic Tabs


You're showing check boxes in the primary filter list, does this mean your users can select multiple countries at the same time? This makes a big difference on how you display the secondary filters.

If only one country can be selected then a drill down method could be employed.

If multiple countries can be selected you will need a way for the user to submit their selection (as there's no way of knowing when they've finished). Again a drill-down, but the list contents could be dynamically created based on the first filter.

  • Yes, the user should be able to select multiple countries at the same time.
    – user25518
    Jul 14, 2014 at 13:14
  • "submit their selection" I would suggest this is handled on the check of the checkbox, rather than an arbitrary "submit" button. Jul 14, 2014 at 13:32
  • But how do you know when a user has finished making selections? Jul 14, 2014 at 14:08
  • Are your facets mainly focused on geographical attributes? if the answer is yes, i think a combination of both map and filters could work. Geographical attributes are far more easier to deal with when presented within a map. National Geographic offers a good example:education.nationalgeographic.co.uk/education/mapping/… if this is not the case then combobox for region and country could prove useful as it would allow users to narrow down the list quite quickly.
    – Okavango
    Jul 14, 2014 at 16:56

Your Answer

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