Very nice. My only suggestion, use a smaller google ad, because it doesn't fit in 1024x768.

Right hand side bar is overlapped by the main body thus hiding some content. I see "ds by Google" at the top, and "What is RSS only has half a W at the bottom. IE5.5 1024 by 768. Didn't try other resolutions. In Mozilla 1.6 (I think) I get the proper layout (proper outlines on all right side bar divs) but the google ad is trying to escape out the side of my monitor. I really hate it when google ads try to escape out the side of my monitor so I feel really good when I see that the horizonatal scroll bar showed up just in the nick of time to capture it before it could get out and start indexing all the junk that falls behind my computer.

Seriously, some sort of layout issue is kinda ruining the look. Otherwise really nice job with it.

Wow, ed, you really use IE5.5?

EdB wrote:

Right hand side bar is overlapped by the main body thus hiding some content. I see "ds by Google" at the top, and "What is RSS only has half a W at the bottom. IE5.5 1024 by 768.

Ack! Didn't realise people still used IE 5 (no offence). And I didn't have a 1024 x 768 screen handy when I did the layout...

Will do my best to make this work on smaller screens, though I'm not sure about IE 5. I mean....update!

Thanks to both and any further commenters

F

The biggest IE5 fix is called the "tantek celik box model hack" or "simplified box model hack." Search google for those terms, and you'll be able to tweak your CSS quite easily to fix it for bad box-model implementers like IE5.x.

Hey Frank, I am using IE 6 and I see exactly the overlapping EdB described. I think if you could make the gap between the first two columns narrower, then the issue will be solved.

By the way, can I have a copy of your css file? I want to adopt the three column look if you don't mind.

http://www.fu2k.org/alex/css/layouts/3Col_NN4_FMFM.mhtml

http://css-discuss.incutio.com/?page=ThreeColumnLayouts

http://www.pmob.co.uk/temp/3colfixedtest_sourcenone.htm

everything you need to know about 3 colums

Dunhill wrote:

Hey Frank, I am using IE 6 and I see exactly the overlapping EdB described. I think if you could make the gap between the first two columns narrower, then the issue will be solved.

By the way, can I have a copy of your css file? I want to adopt the three column look if you don't mind.

Thanks for letting me know about that. What screen resolution are you using? I'll post the CSS as soon as I've got a stable version that doesn't mess up IE toooooo much....

F

If you must use a 3-col layout, [url=http://www.fu2k.org/alex/css/layouts/3Col_OrderedAbsolute.mhtml]this page[/url] can be very helpful.

isaac wrote:

If you must use a 3-col layout, [url=http://www.fu2k.org/alex/css/layouts/3Col_OrderedAbsolute.mhtml]this page[/url] can be very helpful.

The one that worked for me in the end was http://www.haveyoumettony.com/css/blue.css.

As far as I can tell everything displays properly in Opera, IE6 and Mozilla, at 1024x768 and higher :p Please let me know if you see any further bugs though.

I'd be happy to upload the css (how?) but I'm sure it's pretty ugly, even though it works. If anyone with proper CSS knowledge would like to look at it first, PM me.

F

CSS is client-side. Anyone can see it if they really want to, just by viewing source and then downloading it.

<disclaimer>
I've made every mistake that I'm criticizing here. Most of this was learned the hard way.
</disclaimer>

<$0.02>
I really cannot stress enough - if your site doesn't degrade to 800x600 nicely, you are alienating at least 50% of the people who visit your site. People with nice big monitors always forget this, and figure that everyone must use monitors like that - but really, most people don't.

3-column layouts are notorious for not doing well at small screen widths, and the vast majority of the time, there's nothing to be gained by using three columns. (To be honest, I have yet to see a three-column design for a blog, that made me say "Wow, that's a really great layout." The best that any have gotten from me is "Wow, this guy's using three columns on a blog, and it doesn't suck." It works in some cases for portals and e-commerce sites, when done well, but with a blog, the main focus should be on the articles, not on the "extra" stuff, and with very rare exception, a three column layout draws focus away from the middle.)

Think, "What is the functional difference between the right and left columns? If I swapped the right and left, would it make any difference?" If your answers are "Nothing" and "No", then you should be using just 2 columns - one for main content, and another for side-content. (If the right and left columns are visually the same, except for being on opposite sides of the screen, then that's all the more reason to scrap the 3-col idea.)

The advantages of two columns: more screen real-estate for your actual blog (isn't that what you want people to come to your site to see?), better organization, and more degradability.

Currently, you're using roughly 50% of your text-filled-space for what should be the main content of your site. The other 50% is used for stuff like google ads, categories, linkblog, etc. Is your site really 50% articles and 50% sideitems? Probably, you should have "majority control" go to the articles, and keep the other stuff as a minority.
</$0.02>

<disclaimer>
I've made every mistake that I'm criticizing here. Most of this was learned the hard way.
</disclaimer>

OK, so I'll just flag it up as a mod of 'custom' and offer z ip-download.

<$0.02>
I really cannot stress enough - if your site doesn't degrade to 800x600 nicely, you are alienating at least 50% of the people who visit your site.

My stats show over 75% of people use 1024x768 or higher, but maybe that because the lower res ppl don't like it :-(

I take all your comments on board. Having never given much thought to design before, I'm now increasingly aware of it and will start taking it into account when I plan the site. I do think there is something to be gained by separating elements (site-related menus / main content / ex-site related menus ) but, as you say, maybe there are other ways of doing this. I've yet to come across a two-column layout that I really like ;-)[/quote]

isaac wrote:

To be honest, I have yet to see a three-column design for a blog, that made me say "Wow, that's a really great layout." The best that any have gotten from me is "Wow, this guy's using three columns on a blog, and it doesn't suck."

Isaac, what category is my site in ? (just to know)

I do think there is something to be gained by separating elements (site-related menus / main content / ex-site related menus )

I agree. It may even make sense to have one type of thing on the right, and another type of thing on the left. But they should look different, or it's a confusing usability problem, as well as visually unappealing. Symmetry =/= balance. In fact, if you had two small columns on the right, one with "internal" links and utilities, and the other with the linkblog, that would probably work better.

Here's my formula: Take the total width of the screen that's occupied by text and text-containers. (In this case, it's 100%, but a lot of the time, it's a set number of pixels, or a smaller %ge.) Look at what percentage is taken up by "main content" and what percentage is taken up by "side content." If side content takes up more than 30% or so of the text area, then that's probably too much. Then run this example again at different screen widths (you can just resize the browser window.) If it changes dramatically, then there might be a problem. Of course, this is just a rule of thumb, nothing that is set in stone or anything. (For example, I think that Amazon is the best ecommerce site on the net, and it uses 3 columns. But that's a completely different purpose and format than a blog.)

Also, be sure that your actual content shows up first in the XHTML. That way, people without css won't have to scroll through piles of links just to see the articles. (Some of those "people" without CSS are search engines, mind you.)

Topanga,

I really don't know. Can't read it :) I'll tell you what I think by just looking at it, tho...

For the most part, you've got links on the right, and captions on the left. Probably, you could move a few things around to make them more organized in that manner, but it could be that the few links on the left have some semantic reason for being there (again, I don't speak the language, so I can't tell.) Since the mouse of a right-handed person tends to stay on the right-hand side of the screen, it makes sense to put your links there - a rule I break on my site. Also, it looks like you basically have a three-column layout for the "front page", but then all the other pages are two-column (somewhat like b2evolution.net) and that cuts down on the "data overload" somewhat, as does the low-contrast color scheme. My guess: it doesn't suck. But it would be better if you made it not so symmetrical, or got rid of one column altogether. (Resize your browser to about 800 pixels wide - the main column is losing the battle!) It could be, of course, that the center column on that page really isn't the main focus, in which case, it's probably fine.