Web Design Deathmatch: Navigation vs. Hierarchy
Written on November 9, 2007 by Jennifer Anderson
I recognize that in redesigning the NYPL Digital Gallery, I have a fantastic opportunity to toss in my bid at the big virtual poker game of large website navigation. I’ll see your javascript windowshades, and I’ll raise you non-hierarchical site navigation. That is to say, we’ve got this cool idea over here that the image is the main thing, and everything else, even the home page, is in service to finding the image. It’s a bit radical: I mean, it effectively removes the “site” from web site. Wherever it is that you enter the realm of the Digital Gallery, that’s your starting point. No drilling down. No outline-style directory trees. Everything is potentially a home page.
Well, easier said than designed.
I’m really happy with my designs for the home page (ok, so there’s a “home page.” The kids need something to bookmark in del.icio.us.) and the image page. In between, though, there are pages that tell the visitor about the history of the site, or specific collections that have a presence in the Digital Gallery–in short, your usual secondary informational pages. When it comes to creating paths throughout the site, we here at NYPL Labs would like to take a road less traveled and eliminate as much hierarchy as possible from the site navigation. We would rather not the user feel the need to think of our content in terms of subdivided categories, and more however which way they come to it. But it is, I think, too much to ask the user to return to the home page every time they want to browse around. So how do I, as a designer, provide my user with a guide to the site without suggesting a weighted classification?
So I encourage you, our observant and clever readership, to suggest nonhierarchic and/or unusual navigational paradigms for my consideration. I’d like to check out some sites, preferably ones that provide access to images or just a large amount of information, that don’t rely on subdivided categories to map out the paths to their content. Genius though I am, I welcome any and all inspirational fodder. :)
Filed in: Design, Digital Gallery, Usability.
Sounds intriguing, but I have a question that I couldn’t muddle out from the post:
When you say you want the user to think of the content in whatever way they come across it, could you elaborate on ways that you imagine this might happen? Will they be doing word searches for images? Similarity searches? Color searches? What are some of the ways someone might want to stumble across your images?
I imagine the answer lies hidden somewhere in there. Or, at least, that that would be a starting point. For me, anyway.
After many, many discussions we have come to realize that any page on a website is potentially the starting point for a user. The idea of “portal” is too fixed to physical space to adequately convey the navigation patterns, and perhaps more importantly, the bookmarking patterns, of sophisticated net users. So we are trying to build a a set of navigation cues and options into a page that allow one to be relatively proficient without a lot of traversing up and down a hierarchical tree to be able to understand the site and do something on the site. We are ending up with three major components: 1) General information landing pages for browsing; 2) Content pages that privilege the “stuff” over the “stuff about the stuff”; and 3) Navigation bars that can be turned on or off. The goal is to deliver the user to his/her intended target in the simplest possible way and to put only the content on the page until the user asks for more. Hence the toggle for the nav bar; the toggle for the metadata; the toggle for the “embed this image” stuff, etc. Hard to imagine I know without a test bed. Hopefully Jen will have one up soon for the community to play around with. Please keep commenting. It is incredibly useful.
It’s a liberating feeling isn’t it? People are very attached to hierarchy in web sites in my experience. They want to feel like they know where they are in the larger system, but this desire for location is just habit. It is based on early web structures which were based on physical organization of information such as books. That type of organization doesn’t really fit the modern web experience which is becoming more, well, web-like with actual navigation based not on imposed categories, like you point out, but on any number of content-driven relationships. This is certainly true of the way we move between sites. I kind of imagine this navigational experience is more like mental maneuvering than physical navigation.
In the Encyclopedia of Chicago website (http://www.encyclopedia.chicagohistory.org/), we realized that the user could actually create their own specialized narratives of interest as they followed the various relationships between items. That path is captured in a list of viewed pages (the box to the left of the search field). There are of course categories based on content type, etc, but these simply offer another method of grouping. They don’t create walls between content. It sounds like your approach is similar. Glad to hear that you are putting content first. Some people might be nervous without the hierarchy, but in the end, they are really there for the content, too.
I’m sorry, it sounded (still sounds, honestly) like everyone is using “hierarchy” and “categories” interchangeably. Perhaps this is where my confusion is stemming from. The two are not the same in my opinion.
Now, I am certainly not against ridding the world of the directory tree style of navigation (in fact, I wrote a post on my own blog about my very sickness with that model quite recently). I’d say the Encyclopedia of Chicago website provided as an example does this to a point. But, instead of hierarchy, it gives users “Categories” of things – entries, historical sources, maps, etc. This a well-known alternative to the hierarchy, and I just don’t see anything groundbreaking here. There is still something there to point a user towards the right pile of things which they will need to sift through.
Now, getting rid of BOTH categories AND hierarchy would be quite groundbreaking, and that would certainly explain some of your struggle.
At some point, however, whether on the outside or the in, you will be providing your users with a category or preimposed decision about the images. How will a user search, if there is no backend metadata, keywords, information about an image? Even a date is putting some sort of qualification on the image, and at some point you have to accept that we make assumptions and labels about all objects. Otherwise they would not be findable or meaningful at all.
That said, consider some of the following alternatives:
Venn diagrams
Network diagrams
Other visual-based navigation model
The ability to sort, search on multiple fields
An interface that allows users to build pages on the fly, say by dragging and dropping keeper images into a bin that always stays active on to the side of the page. The user can sort, tag, rearrange, or draw lines between images they feel are related and create their own “paths” this way.
Three – four overall categories that describe, generically, what the user can do on the site (”search,” “blog,” “contact”) and then the appropriate content in that area (ie, a search box).
Alexis, I understand your point about categories and carving up the content according to some set of principles we have developed. I like the idea of visualizations, (see my previous post) but visualizations, network diagrams etc all run on underlying data. May look different but fundamentally it is the same mechanism as far as the search engine is concerned. I think the best way around this is to give options some remix options – like (Category 1 and Category 2) or all names found on this map. Still a matter of data but much more exciting to the user. Working on it.
Ah.
I get it. Finally. I get it.
I’m thinking you want to make the site like a workspace. Say….there’s a big play pen in the middle where the user can search, drag, sort, tag, or move things around, or they could even get hardcore and do a Yahoo Pipes style thing where they do advanced sifting on the data. This space never goes away. There might be some navigation to informational things ringing this primary workspace, and perhaps clicking on one of those things opens a window in the workspace on top of what the user has been working on. When finished with that, the user can close the individual window or move it to the side while otherwise maintaining their workspace in the same state.
We also might be conflating content categories at NYPL with what, as has been suggested in these comments, are better described as labels which signal, “generically, what the user can do on the site.” Alexis, I think you’re right that things like Search, Blog, Contact, etc. might have a place in a _functional_ navigation scheme, and don’t necessarily privilege any specific content or file-system hierarchy.
The Encyclopedia of Chicago site, for example, populates its global navigation with these functional labels: “Entries, Historical Sources, Maps, Special Features, User’s Guide.” I might not even know, a priori, what “Entries” means, but in an encyclopedia context, this label probably makes all sorts of sense.
What a problem child this “new nav paradigm” thing has become… I thought it was going to be easier than it turned out. sigh…
At any rate, I will be posting tomorrow about the final design for Digital Labs, and I will address things like basic site nav vs. “workspace” (good word, Alexis!) controls. I’ll also talk about what we’ve been calling “Phase 2 changes,” or changes to the Digital Gallery that need some functionality development behind them. I have a feeling that Phase 2 will include more experimental/alternative navigation models.
[...] this idea is something I was trying to get at in a comment on the NYPL Labs site just a mere month ago. The screen should be a workspace, not merely a reader. In some ways 2.0 [...]