APR: Information Architecture – Faceted Navigation


In our previous article in the series on the development of nexus, we discussed navigation and information architecture. We identified the challenge of filtering articles by category and by level of experience (beginner / expert), while also viewing the articles along a characteristic (most-viewed, highest-rated, etc). Between both url-creation and visible site-navigation, the challenge we explored was how to present one facet or dimension as primary and others as secondary.

One of our readers presented a third alternative – faceted navigation.

Scott Weisbrod commented:

Have you considered using faceted navigation? Faceted navigation means that level of expertise, category of article, and chosen approach can all live at the same level.

Therefore, as a user, I can pick the facet by which I want to begin navigating the site. For some, level of expertise is the most sensible place to start. Others will want to begin their search by category or even chosen approach.

Why not surface all of them and let your users pick the most appropriate starting place?

He also suggested looking at The Guardian’s search page. You get the idea by interacting with the controls in the sidebar – we’ll try and explain here with a static image, but go check it out.
guardian search-browse filter

The left sidebar shows a list of “active filters” (initially empty), and as you click to “add search filters” you narrow down the choices. Amazon.com also uses this approach, for narrowing by product category, price range, supplier, etc. While it may encourage an element of precedence, it allows users to filter choices in whatever sequence they desire. This is very cool presentation (in the two-dimensional sense).

When we started exploring our approaches, we were also concerned about how the URL looks, both for providing context to users and for sharing with others. Unlike the Guardian, this is the main navigation for our site – not just an admittedly cool way to do browse/search. If we look at a URL from their site, with facets selected, we see http://browse.guardian.co.uk/search/all/Politics/Labour+party? month=07&lDim=N%3D4294962719%2B4294962540%2B4294963588%2B3098 &year=2002&N=4294962719+4294962540. Not a very pretty picture [ed: spaces added to line-wrap the URL].  It exposes the implementation (looks like an OLAP cube database to me).  More importantly, it would confuse anyone trying to read it, and might even dissuade them from clicking on the link if it were shared in an email.

Nexus Implementation

Luckily for us, we did three things today. First, we decided that we agreed with Bob, at least enough to include the experience level dimension in our initial implementation (it added less than an hour of work). Second, we took an implementation approach that would actually support this faceted navigation presentation. Third, while we implemented it with a hierarchical presentation, we stuck to the Ruby on Rails convention of separating the presentation from the implementation.

This affords us the opportunity to refactor the presentation to look more “faceted” and less hierarchical.

Here’s what the navigation elements in the latest version in source control look like:

nexus navigation bars

The top bar is clearly a hierarchical parent. It establishes context (articles or users, or your own page, etc). It also shows a “categories first” navigation bar. However, that navigation doesn’t “reset” the other choices.

If you’re looking at beginner product management articles, organized by their ratings, and you click on “Business Analysis” – you will see business analysis articles, for beginners, organized by highest rating. In effect, we have a faceted navigation implementation under the hood. We just presented it hierarchically. Note that we also agreed with Bob, and put experience level filtering “above” the organizational sorting (most read, etc) of the articles.

We critiqued The Guardian‘s URL structure. We should look at ours. The URL for an example above would be http://tynerblain.com/nexus/business_analysis/beginner/highest_rated/. Incredibly easy to know exactly what to expect before clicking on that link. We can also extend this approach in a couple ways – we can add more skill levels or categories, we can add more sorting options (highest rated reviews, etc), and we can add subcategories (like testing:test-automation). We won’t add any subcategories until we have enough articles to warrant it. I think we can even add sub-categories selectively (have them for testing, but not business analysis, for example).

Design Conclusion

I am happy with the under-the-hood design, for both being extensible enough for likely future needs, and being adaptable enough to work with either a hierarchical or faceted presentation.

In order to get the alpha release launched as soon as possible, we will keep the “hierarchical-looking, faceted navigation” in place for the first limited release.

How You Can Help

In order to really get a feel for the effectiveness of the navigation, we have to have some critical mass of articles on the site – I would think at least 100. Please spend a few minutes to queue up some great articles to be reviewed – and when we release the alpha, submit those articles. Every page will include an “article count” in the sidebar – and when we get to 100, start evaluating the navigation and let us know how it works for you.

Thanks in advance!

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.