inamidst.com topic

Content-Rich Design

Content rich design is where the author emphasizes content over style, perhaps because they enjoy that, are unable to design, or realise it's a good design strategy. This page is designed with content rich design in mind: there's no CSS. On the other hand, it violates some of the more common idioms in content rich design.

What kind of sites exemplify content rich design?

• Jorn Barger's Robotwisdom, especially the James Joyce area.
• Jackob Nielsen's Useit
• Daniel Bernstein's cr.yp.to
• Mark Rosenfelder's Zompist Metaverse
• Ward Cunningham's Portland Pattern Repository
• Heather Rose Jones's Homepage

These are of varying levels of competence of visual design. On the one end is Rosenfelder's zompist.com, which has a very neat style; on the other end is Bernstein's cr.yp.to which basically has no style at all. Somewhat in the middle is Nielsen, who nonetheless admits to having no images because he's not a visual designer so his "graphics would look crummy anyway".

One of the binding factors, on the other hand, between all of these sites is that the authors are more interested in writing than they are in design. That some of them can design at least a little bit is irrelevant: they don't actually seem to care all that much.

These sites are some of the most enjoyable to read, but they can be a little bit infuriating to read. The modicum of design sense that Rosenfelder shows is enough to make his site very easy to navigate. Nielsen's usability sense also holds him in fairly good stead. On the other hand, I've had problems with Bernstein because there's very little to orient one on a page which consists mostly of a sparse amount of links: you are in a maze of twisty passages, all alike.

Good Content-Rich Design

So what are good factors of content rich design? How does one achieve it successfully? Making the content is one thing, but how does one go about properly styling all of that content? Since Rosenfelder fares the best of all of the above, we can learn most from him:

• He often gives a background tint to his documents (this is something which I tend to ignore, since I only realised recently that you have to change the font colour too).
• You should use pictures. You should use at least one picture at the top of a document to orient the user! Otherwise, rely on vey clear headings and a very varied text-structuring to do the work for you.
• Little icons and the like are great. This is a lesson that Nielsen seems to have learned too. I use them, for example, to annotate dates with a day symbol.

Further Reading

• Content-centered Web design - Gives some similar, and some different, advice to here. For example says to background tint your pages, but also says to avoid images. On the other hand, Barger actually does make use of some images, but uses them sparingly; which is what I recommend too.