Visual presentation of hierarchical categories of content

Question

I am on my way to transform my outdated, content-heavy website into a multifaceted, multimedia showcase of my research website through the process of analyzing and reshaping the web content.

For this particular question, I want to have some examples for categorizing the articles(comprised of text, images, videos, pdfs, ppts, and infographics) by topics in a hierarchy. Each topic node would have repeating templates of child topic nodes.

What are the possible strategies to do that so that the presentation is more visual that it currently is?

For example;

Answer 1

I believe this to be a problem centered on how best design an interface that facilitates exploratory search.

The diversity of content creates challenges in how to best organize the site and makes a straight up and down hierarchical navigation scheme a bad idea. I would recommend instead to rely on faceted search.

I would recommend that you build a dynamic navigation scheme:

Examine your content and identify the properties most relevant to users exploring your site. Your users won't share common gzals - so you have to build different paths to the content. For example, users that are looking for:

• presentations or videos would use the Content Type dimension
• specific topics would use the Topic dimension. This dimension may be hierarchical, meaning that topics can have subtopics and so on.
• content from specific timeframes of your career would use the Publication Date dimension. Users should be able to provide a range of dates to constrain the results.

This approach will accommodate an audience with varying goals/intents/expectations/prior knowledge of the content. It will also provide power users with the ability to combine dimensions. For example, a user could perform a keyword search and constrain results to only presentations about computer vision published in 2014.

Don't try to create a robotics taxonomy from scratch. Instead, stand on the shoulders of giants and repurpose how academic publishers organize robotics content. The "Robotics and Automation" node of the IEEE Taxonomy could provide inspiration (page 57).

Display only the valid dimensional values for the search or navigation state. This is a core piece of faceted navigation. If the user chooses to constrain the search to only presentations, and there were no presentations published in 2013, do not show 2013 as an option for navigation. Do not lead users to dead-ends.

Dynamically order dimensional values based upon their relevancy to the content. Assume a search is done that returns results in five different topics. When displaying the Topic dimension, rank the individual topics based upon how much matching content is in the results. There are a handful of exceptions to this rule, usually around dimensions that apply universally to all content or those used as primary navigation.

Leverage progressive disclosure to handle hierarchical dimensions without overwhelming users. For example, assume a Location dimension that contains States and their major cities. Displaying the entire Location hierarchy would not be helpful. Instead:

1. Split State and City dimensions (but make them dependent on each other)
2. Only display City if one or more States are selected

The user would first click a state (California) and then have the option to drill down into specific cities. I believe the LinkedIn people search operates in a similar manner.

Two great resources on faceted navigation in general:

Dynamic faceted navigation in decision making using Semantic Web technology (published in Decision Support Systems Journal)

Daniel Tunkelang's book Faceted Search. Daniel founded Endeca, one of the first major players in e-commerce faceted navigation.

Answer 2

Since this is a CV website (or that is at least one of its key functions), the most important thing in terms of presentation is what users see on the first page. You want to highlight the top few things that you would want someone to know about you there, whatever that may be (a gallery of images of you is not it).

As far as categorization goes, the top level categorization would be the type of content. CV-like information about your experience, publications, awards, etc. should go in one area. Other types of information, such as information for students you are teaching, or general help resources, should go into other areas.

Pages like "Readings" should have more information to guide users into the subpages. They shouldn't be just a list of links.

Answer 3

I would recommend that, if you haven't already - going through the process of identifying the steps to user conversion.

• Who is the target audience of the site?
• What are they looking for?
• What is the cognitive/emotional offering?
• How do we escalate commitment?

By understanding more about the audience of your site, you should be able to identify ways of categorising content that maximises the engagement of your audience, and increasing click-through rates.

Going back to the original question, I would recommend checking out the JQuery library Isotope; http://isotope.metafizzy.co/

I've used this library before to help dynamically filter and categorise thousands of articles/categories within an enterprise level sales site before to great success.