Best practices to prevent distracting and overwhelming design?

Question

I'm designing a discussion forum. I want to build something that doesn't look too much like a traditional forum (I want it to look more StackExchange-like):

1. Initially I placed the categories like Digg, but then I realised that they were too many to fit horizontally in one line, then I moved them to the right and arranged them vertically in two columns.

2. I'm using red because it is related to some Chinese speaking countries (I'm not sure if I'm using too much or if I should make that red darker).

I'm not sure if this makes the page look too distracting or too cluttered?

(Should I make the categories link and the tag links black (or dark gray) like the titles of the questions?)

EDIT:

This is another version:

(Thanks to the answers below).

Answer 1

The red is a very strong accent, especially in the otherwise monochrome color scheme; it catches the eye a lot, and you're using it too much. Use accents to help scanning; highlight the sections of a page to promote scanning, use a light emphasis (italics is great for this) on things like names and links. A duller or darker red might alleviate the problem a bit, but remember red is a strong color, especially in this color scheme.

As it's set up now, my eyes are drawn to all the names of people on each entry...but that information is meaningless to me as I haven't even read the headlines yet. It's important to highlight links (I assume the red things are) but they shouldn't distract from the content out of context. It should pop out to me while I'm reading the line, but not while I'm scanning the page. I recently encountered this problem in a manual; so much bolding was used for emphasis that it was highly distracting, replacing the bold with italics wasn't distracting but still made words pop when it was important.

The "popular tags" are also a bit hard to parse; is "language barrier" two tags or one? Remember "don't make me think," you can use a subtle background element to keep multiword tags grouped as a unit, like all Stack Exchange sites do.

Answer 2

IMHO your second version is a lot better.

Perhaps the "Categories" and "Popular tags" could be accented, but certainly not all the category and tag names.

Certainly use the red, but sparsely. Use it as an "accent color": a little splash of color here and there to liven up the place, but no more than that as it gets too much in the users face.

An analogy might be how accent colors are used in interior design: for example red cushions on a couch in an otherwise "single color" living room (mostly white, black or earth colors).

Answer 3

It does appear cluttered. Although the grouping of elements is logical and follows some good sensibilities, it's difficult to distinguish them because they are crammed together. Don't be afraid of white space.

The principle of proximity is lost in both of these designs. In particular, the line "Taipei talk is a free discussion site for the International and English-speaking community in Taiwan. Start a new topic" should be distinguished from other elements, but it is blending with "Categories" and with the first question, "Where to find a wide collection of books in English (Taipei)". White space would distinguish it better.

Answer 4

Why does the author's name appear twice? And why not put the date ("22 hours ago") on the byline with "Started by", "in", and "tagged"?

If the double author is the last poster, then I think you could move that info down as a second byline. If there are no replies, don't show the second byline. But, if there is a post, show "Last post by: X, Y hours ago". That large, bold red column is quite distracting and not so important.

Answer 5

I agree that the second version is a lot better.

You might also consider collapsing the long list of categories into a summary of most active categories and add a way for the user to expand the list to see all categories. That would also allow your sponsored content sections to move up the page, which will increase their perceived value to the advertiser.

I'd also consider using some kind of time marker to group posts that were made in the same timeframe. That would reduce the amount of data on each row while still being just as informative.