| From reviewing the inbound links to my blog, it is clear that my (woefully in need of updating) Table of Contents is quite heavily used by readers, especially the index of my business (‘Working Smarter’) and technology articles. But it is both difficult to maintain (it is kept in six HTML files which I update manually) and awkward to use. I don’t mind the maintenance, but I’d like to make it more user-friendly.
At present, the TOC is accessed through the right sidebar. The six major categories and 21 subcategories are displayed, and when you click on them the actual TOC pages you go to have a total of 53 sub-subcategories, with about 1000 of my articles (the ones that I hope may be of some enduring value) indexed and abstracted within those sub-subcategories. The problem is that listing all 53 sub-subcategories in the right sidebar would push my blogroll down another eight inches into virtual obscurity. Besides, the sidebar is too narrow to contain the full names of some of the sub-subcategories, and a simple list of all 53 would be visually boring and tedious to navigate.
I can imagine two ways of making the TOC easier and more intuitive to navigate, but I don’t have the HTML or CSS skills to do either:
- I could move the left sidebar over to the right side, which would double the width available for the TOC and other sidebar content. Or just widen the right sidebar to 300px. Then I could use outlining, with the 6 main categories opening to show the sub-subcategories either when you scroll over them or click on them. If you ‘opened’ all 6 categories you’d see something like what is displayed at right. Clicking on one of the 53 buttons would then take you to the list of articles for that sub-subcategory.
- I could instead put a graphic of the whole TOC, something like what is shown at right but with some better design than I am capable of, at the bottom centre of the Home Page (or even on a separate page), with a link from the top of the page to it. Then when you click on any of the 53 buttons it would take you to the list of articles for that sub-subcategory.
In either case I’d like to start adding a ‘Posted in Category:’ link at the bottom of each article that would likewise take you to the TOC where other articles in the same sub-subcategory are listed.
So what, oh HTML-and-CSS-savvy readers, is the simplest way to do this? |
|
TABLE OF CONTENTS (MOCK-UP)
 Technology
 Weblogs
Social Networks / Blogs in Business
Communications & Presence
Technology & Society
New Technologies
Working Smarter
Knowledge Management
Personal Knowledge Management
Personal Productivity / Getting Things Done
Complexity & Discovery
The Innovation Process
Industry-Specific Innovation
Collaboration
The Wisdom of Crowds
Innovation & Society
Advice for Entrepreneurs
Natural Enterprise
Saving the World
Diagnosis
Prescription: This Way Out
A Different Way of Thinking
Overpopulation
Activism: What You Can Do
Community / ICs
Gift & Other Alternate Economies
Animal Rights
The Educational System
Society
Writing Fiction
Writing Non-Fiction
Conversation & Language
Narrative & Story-Telling
The Arts
Science & Health
Culture
Being Human (Psychology etc.)
Miscellany
Politics / Economics
War & Peace
Global Democracy
Canadian Politics
US Politics
Bush vs Kerry 2004
Third World Politics
MidEast Politics
The Political Process
The Media
Frames, Left & Right
Corporatism
‘ Free’ Trade
Consumer Power
Economics
Creative Works
Memoirs & Dispatches
Short Stories
Poetry
Satire & Fables
Art & Photography |
How about overhauling the layout of the whole site? Since I’m sure the majority of your visitors come for the information you provide, some of the graphics may be getting in the way. I read your articles through the RSS feed, so I rarely come accross the navigational problems. I would, however, take advantage of a categorized menu system when you implement it. I share your articles with friends and would like to read more of the archived work in the future.You would save quite a bit of real estate by opting for a smaller header. Move your mug shot to an “About Me” page. In fact, move any seldom used space-hog to another appropriate page. Create a page-wide, squat footer (or sub-header) to hold all of the important generalized links and utilities (Search, for example).Once you’ve cleared the space, you may have more options. As far as the menu goes, I would suggest limiting the visible headings to the major categories and only expand each sub-category when the user navigates to the index page of a major category or any of the pages associated with it. It would follow that you could use the same scheme for expanding the article listings under the sub-categories.This is just one person’s opinion. I am by no means a UI expert, but the suggestions I’m provding do come from experience in web development and consulting on dozens of projects.
http://blogcms.com/ is a cms which has already all the features you ask – category lists, toggle tree for linklists, etc. So you can download it and look into the css and html files. I use it for my blog and it is great.
Perhaps something like http://buttondowndesign.com/dave.html? There are quite a few (technical) solutions like the one linked above at http://alistapart.com/ (as well as other cool design techniques), although I suspect the architecture of the site (the actual organization of the information) needs to be rethought before going after a purely technical solution.Best regards.
Hey, Dave…don’t change the front…just my opinion…
You;ve written 1000 articles?!/ whew. Good for you. And they are so accessible not fluff or self-referential, having such a reader-focused tone. I’m impressed.The key thing is scannable to my mind. Make it not hard to unpack. Keep the whole site searchable and those lovely illustrative graphics and prominent calendar for the quick scan of what’s new. Not that you said you’d nix them, but just wanted to mention it. Likewise your headers and boldfacing makes it easy to get the structure and salient points quickly to orient and engage, in my opinion. I appreciate those.Nested lists would allow you not to be overwhelmed with too much info at once so I agree with that. In yoour mock up, society seems to be the weak link. (Pardon the punablity of that. ;-)) I mean to say that I’m not sure what to expect if I clicked that. From my reading I understand, purely statistically not applying to every individual, that the older an internet reader is, the less likely they are to click a link that isn’t patently clear what exactly will result. What age is your median readership? All the others look transparent.Maybe in the new organization the sidebar external links could be less vividly colored to not pull the eye from the main post.Other than that, have fun conceiving of the new way. :-)cheers!
Whew — my head is spinning. I appreciate all the advice and the links. I think I need to go slow here. JD, what you’ve done for me is awesome. I’ve got some questions which I’ll send you offline.
You may be able to adapt some of the excellent suggestions for creating a Subject Index on a Movabletype blog here:http://www.elise.com/mt/archives/001312how_to_make_a_subject_index_for_your_movable_type_blog.php