Possible Duplicate:
What's the best way to view a deep hierarchy?

In my application, I need to design hierarchy of product.

i.e. Parent group, group, parts, subparts etc. ( add, remove , edit )

What should be the ideal way to do it in single page ? ( Tree comes to my mind but it is too vertical, my primary users will have wide screen monitors. )


3 Answers 3


One option that I can think of off the top of my head is a column based view similar to one of the view options available in Finder in OS X.

Mac OS X Finder in Column View

  • Nice solution. You can spare some additional space if, when a new selection is made in your hierarchy, you collapse the previous selections into a single column. In your example you would have a column with "Library / Documentation / Application" and a column with the last level expanded.
    – Mart
    Commented Feb 1, 2011 at 8:34

I think that the answer is "it depends" and can be domain-specific. For example, if you have only a few and a fixed number of top level groups, you can use a design like this:

enter image description here

The top-level groups can also be arrange horizontally.

If you have more than just 3-4 but still in the range of a dozen or two, you can use something like this:

enter image description here

  • Thanks for the answer. Which program did you use to create these screens ?
    – iamgopal
    Commented Feb 1, 2011 at 11:20
  • You're welcome. I used OmniGraffle.
    – Hisham
    Commented Feb 1, 2011 at 17:41

I've had good results using nested Definition lists.

They're easy to skin and generate using a library like RichFaces. You can code the levels using inheritance to allow the spacing you need (and they can be full screen width)

They're easy to add panels too, so they collapse down at various levels and because of all this, their easy to add an item to, even in the middle, in future releases/enhancements.

Been very successful when dealing with possible huge amount of data, and both the power user engineers and the small users were happy.

  • Can you give more details on this. I only see rudimentary information on Definition Lists and nothing for displaying hierarchical data using definition lists.
    – Amala
    Commented Mar 6, 2013 at 14:14
  • After researching I assume it is something like this: docs.kendoui.com/api/web/panelbar
    – Amala
    Commented Mar 6, 2013 at 14:26

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