Comments on: Add visual delimiters between fpps?

Add visual delimiters between fpps?

jaden — Thu, 08 Aug 2002 16:14:24 -0800

On the front page I sometimes mistake a thread with an empty line and then another link in the comment for two separate threads. I don't associate all of the text with a single post because the spacing is the same as it would be for two posts. It's a minor thing and I realize there was more to the comment when I view it, but what about adding a delimiter to make it easier to tell threads apart? Or am I the only one that makes this mistake?

By: insomnyuk

insomnyuk — Thu, 08 Aug 2002 16:17:26 -0800

There very, very first time I saw MetaFilter (August of 2001), I took a look at it and could barely make sense of it. It looked like a big stream of consciousness in yellow and white text....

I don't know if there is a design feature that can help with this without being too obtrusive, but it would probably be handy.

By: jaden

jaden — Thu, 08 Aug 2002 16:23:19 -0800

I'm thinking of something simple like indenting the "posted by" line or adding an extra newline between posts (although that would make the front page a lot longer). Something unobtrusive that would make it easier to quickly scan all the threads on the front page.

By: mathowie

mathowie — Thu, 08 Aug 2002 16:26:00 -0800

It's a tough design problem to solve.

I would rather add more vertical whitespace, instead of HR lines or dashes, or any visual clutter. I could get rid of vertical space completely, though every once in a while it's necessary (but usually not).

By: MUD

MUD — Thu, 08 Aug 2002 16:26:39 -0800

Here are some of the ideas that people mulled over before. Matt wasn't mad keen on the idea of breaking the front page up too much but things change...

By: MUD

MUD — Thu, 08 Aug 2002 16:28:43 -0800

... and sometimes they stay pretty much the same.

By: jaden

jaden — Thu, 08 Aug 2002 16:36:22 -0800

Ah, thanks for the link MUD. I looked at some of the ideas and didn't see anything that really seemed right. What about this one?

By: rushmc

rushmc — Thu, 08 Aug 2002 16:48:16 -0800

Hey, I like that!

By: willnot

willnot — Thu, 08 Aug 2002 17:06:28 -0800

On the front page, I'd recommend eliminating line breaks and truncating the posts to less than 500 characters with an auto [more...] link into the thread if they go past that.

Unless somebody can point to 1 single post that would have been harmed by those contraints (including by the way my own recent 561 character post which I secretly knew should have been edited better for brevity).

By: jaden

jaden — Thu, 08 Aug 2002 17:17:14 -0800

I am experimenting with some changes. I really like the indent with newlines but newlines without indent is okay too. They both take up an extra line per post, but it sure makes it easier for me to read.

By: ODiV

ODiV — Thu, 08 Aug 2002 17:18:38 -0800

willnot: have that show up on preview (there's a preview right? I've never submitted a link), and you've got something. Everyone will notice what their post will look like and will edit accordingly... Will

By: jaden

jaden — Thu, 08 Aug 2002 17:28:18 -0800

I'm not too keen on the idea of eliminating vertical space in posts because the extra space makes it easier to read. I also like being able to read the entire description at a glance, so I wouldn't be in favor of truncating.

By: mathowie

mathowie — Thu, 08 Aug 2002 17:43:43 -0800

I like this, that's what I suggested above, simply adding more space.

By: mediareport

mediareport — Thu, 08 Aug 2002 18:26:44 -0800

How about right-justifying the "posted by" line?

By: jaden

jaden — Thu, 08 Aug 2002 18:33:00 -0800

It looks kind of strange

By: insomnyuk

insomnyuk — Thu, 08 Aug 2002 20:00:28 -0800

Right justifying is too much of a deviation from the norm. Familiarity is important, and right justifying looks really awkward.

Personally, I think the posted by line should be left where it is, even the indentation, while it helped demarcate posts visually, did not look "right". I can't explain it, the gal dern thang just don't look raht. It almost makes me want to think that posts below the top one are somehow nested, what with the indentation. Please tell me if that makes any sense.

By: insomnyuk

insomnyuk — Thu, 08 Aug 2002 20:19:23 -0800

Or how about some fairly subtle CSS work, like this(just play with the border properties for the smallcopy class). Or you could go extreme with something like this or this.

By: cortex

cortex — Thu, 08 Aug 2002 20:36:31 -0800

I think the indent layout is very effective, and not too crazy. I hear you, insomnyuk -- it's different, not sure if I'm really all the way into "don't look right" territory -- but it also strikes me as a teensy bit exciting and fresh and shiznit.

By: rushmc

rushmc — Thu, 08 Aug 2002 21:02:52 -0800

Yuck. I hate the examples with all the extra space between links. It's wasteful, makes it harder to scan the front page, and just looks BAD (and amateurish). I much prefer the indented "posted by" line.

By: rushmc

rushmc — Thu, 08 Aug 2002 21:04:04 -0800

insomnyuk's second example is startlingly easy to scan/read.

By: nicwolff

nicwolff — Thu, 08 Aug 2002 21:36:58 -0800

Matt's example has too much space; insomnyuk's are too boxful. I think a relatively subtle typographical solution might be enough - just tighten up the leading a little. (Looks good on IE5 and Mozilla on the Mac, anyway.)

By: nicwolff

nicwolff — Thu, 08 Aug 2002 21:40:20 -0800

(But looks like poo on OmniWeb.)

By: kelperoni

kelperoni — Thu, 08 Aug 2002 22:45:32 -0800

I agree that the extra spacing is icky looking, especially on my old-school laptop with a teeny tiny monitor. I really like nicwolff's suggestion - it's a fairly invisible change, but still solves the problem.

Here's another suggestion - instead of indenting the posted by line, could you sort of out-dent it? That would provide a clearly visible break between posts (but might put too much emphasis on the posted by line). I don't have the html/css knowedge to provide an example, sorry.

By: insomnyuk

insomnyuk — Thu, 08 Aug 2002 23:08:53 -0800

I realize there are lots of ways to do this, but I want to explore how things would look, so I did three more: 4, 5, 6. You could change the background color, or indent, or add a small border on the top, bottom, or left, or you could do all of those things at the same time. For this purpose I really don't give a damn how it looks aesthetically, I just want it to be readable. Maybe I'll pull the RSS feed to my site from now on and use my own customized metafilter look....

kelperoni: it may be possible to make it look that way with CSS, probably just by adjusting the margin, I cheated and faked indentation by adding spaces...
css ramble:
There are advantages and disadvantages to the way Matt has structured each post, the DIV tag for each post has the "copy" class applied to the entire thing, which makes it harder to have the "posted by" line truly independent, although this may not be a bad thing.

cortex: I'm liking the indenting the more I see it, as long as its not too extreme.

That was a fun diversion, but I'm going to bed now.

By: MiguelCardoso

MiguelCardoso — Thu, 08 Aug 2002 23:40:32 -0800

What an enjoyable thread! I had no idea you could mess around with the design and post suggestions in such a neat way.

Speaking as a reader who likes things as they are, I must say this solution of Jaden's, which Matt singled out, seems a real improvement, as it doesn't seem like a change, yet is significantly clearer. If that makes any sense...

By: crunchland

crunchland — Fri, 09 Aug 2002 00:05:54 -0800

I respectfully submit this suggestion.

By: patrickje

patrickje — Fri, 09 Aug 2002 00:56:02 -0800

I don't know, I've always been partial to this look.

By: MiguelCardoso

MiguelCardoso — Fri, 09 Aug 2002 01:11:52 -0800

OK. Another monitor debited 50/50 to crunchland's and patrickje's ongoing bills.

By: rcade

rcade — Fri, 09 Aug 2002 05:22:13 -0800

I like the indented "posted by" solution, but I like all these user interface suggestions even better. Would it be possible to add a user field or cookie to define an external style sheet, so members can create, use, and share their own demented Metafilter designs?

By: nicwolff

nicwolff — Fri, 09 Aug 2002 07:15:30 -0800

It would be easier to do this kind of thing with CSS if Matt used P tags around the paragraphs of posts, rather than separating them with BR tags.

Then, yeah, he could just add an option in user prefs for a stylesheet URL, and CFIF's in every page to add the LINK tag if it's set...

All in his copious free time. Jeez I wish MeFi were in mod_perl so I could offer to help with this stuff!

By: Shadowkeeper

Shadowkeeper — Fri, 09 Aug 2002 13:22:36 -0800

I've always been partial to this look

Ha! Yeah, here's another proposed redesign.

By: languagehat

languagehat — Fri, 09 Aug 2002 13:24:48 -0800

For what it's worth, I've had the same experience as jaden; of the proposed solutions, I much prefer the indent—the extra newline looks awkward to me. (Of course, it's hard to resist the subtle elegance of crunchland's suggestion...)

By: languagehat

languagehat — Fri, 09 Aug 2002 13:27:06 -0800

That was supposed to be an em dash, dammit.

By: rhyax

rhyax — Fri, 09 Aug 2002 15:06:43 -0800

how about this with just the first letter a little bigger, i think that looks professional still and no lines or anything...

it looks a little fishy in ie, use mozilla ;)

By: webmutant

webmutant — Sat, 10 Aug 2002 01:09:38 -0800

It seems to me there's a much easier way to solve this problem:

Why not just disallow line breaks in front page posts?

By: Spoon

Spoon — Sat, 10 Aug 2002 15:29:24 -0800

I thought long and hard about this, but I kind of like it just the way it is.