Quote this comment

Simon Willison Posted…

Personally I prefer positioning to using floats as floats force you to maintain a specific order to the actual markup on your page. Having your main content before the navigation stuff in your markup is preferable both for accessibility reasons and search engine optimisation. Also, two/three/etc column layouts may be dull but they account for the vast majority of web site designs - if we're going to convince hard core table users to switch to CSS we need to provide them with rock solid examples of how CSS can be used to achieve their current designs.

Quote this comment

Stuart Langridge Posted…

Moreover, to enlarge on Simon's comments, two- and three-column layouts aren't just popular because they're table-based, they're popular because they are a logical way to lay out a lot of websites (which have a header, a navigation sidebar, a large content area, and a footer). Radical new layouts are possible with CSS, yes, but will they be as usable? Especially given Jakob's Law of the Web User Experience; if everyone else is using a two-column layout then you should too for consistency. Breaking that rule can indeed be done, and it might be a valuable technique, but it's not a job for CSS experts to show us wildly different layouts. It's the job of UI designers to show us those layouts, and then the job of CSS gurus to show us how to implement those new layouts in CSS. We should start from the concept and then use technology to implement it, not start from "what can the technology do?" and then see which would be useful. That way lies Dilbert's company's marketing team: "Tell me everything that the engineers can do and I'll tell you which things we want." Not the way forward.

Quote this comment

pixy Posted…

Simon: I used the same order of columns in the code as Big John used. I know it: often, we need another column order in the code, and often, the middle column should be first. However, this is different problem. The second question: I prefer positioning, too. But it's useless if the positioned column may be longer than middle one; in this case nothing can be placed under this columnar block. This is why I used floats here. The third one: Yesterday, I've got yet next mail from an author prefering table-layout. He told me just for those reasons he hates all the CSS-propaganda websites. N-column layouts round and round, plenty of hacks, difficult testing where it works. where not and why not, workarounds and work-counterclockwise-arounds... Just this. Nothing more. Again and again. While TR-TD-ing makes it instantly and fast. Yes, of course - columnar layout is the favorite layout on the web (because of the previous table-layout popularity, I guess). However, I think other (maybe better?) layouts are possible - but they cannot be found. Look at any CSS-addicted website, what layouts they're offering. Two-columns, three-columns. Round and round. Where is the rest? Where is The Better of CSS to tables? I know it. My friends-webdesigners know it. But these authors doesn't. Columns aren't the best we can do. Columns are a hard-copy from newpapers. Web is different kind of media. It needs different formats, different "layouts". At least, because the information is not "laid out" as on the paper, it's presented in another way. That's why I'm looking for another "layouts". I'll repeat it: Columns aren't the best we can do.

Quote this comment

David Dorward Posted…

I don't know if columns are the logical way to layout a website, but they are the way that people are used to. Most people I encounter who are trying to use CSS for the first time are only concerned with replicating the designs they know and are not interested in anything else.

Quote this comment

Kyle Pero Posted…

I would not suggest anyone to use CSS for positioning. CSS is great, but it does't translate for older browsers (the ones that most users have - of course this depends on your target audience). Just look at the example in NS4 (unfortunately still a very common browser). I'm a firm believer in good old fashioned hand coding. If you now how to do clean HTML it will always be cross-browser friendly.

Quote this comment

pixy Posted…

Of course! It's not possible to use anything like this in NN4 or IE4. I supose NN4 is not browser supporting CSS, and that's why I always give styles for modern browsers only. However, my documents are well structured, so they are usable even without styles in this very small minority. (Maybe, in US, more users keeps using NN4 - in our country they make less than 1%).

Quote this comment

Simon Willison Posted…

Sod Netscape 4. It's 6 years old now, and its overall browser share has fallen well below 5% for the vast majority of sites. If the site you are working on gets a seriously average amount of NS4 traffic (the most valid reason being a lot of corporate visitors whos IT department have locked them down to NS4) then it's probably a good idea to grin and bare it, but otherwise there is no point whatsoever in being held back by that dinosaur.

Quote this comment

packman Posted…

As Stuart said - differing structural layouts are best developed by UI experts. In conjunction with pure designers, I might add. However, that doesn't mean that n column layouts can't be implemented that offer a unique design. My company has tried to do just that. One of the larger challenges was not that footer - we didn't need it, but rather establishing a 100% browser height of the elements. The only solution we found was through absolute positioning (and some minor, yet convoluted hacks). So far, we've been able to determine that of the major browsers, only the Safari betas have issues. So, if the challenge is unique implementations of 3 column layouts, that is more realistic than vastly differing interface development. There is constant work in that area, but much of it is experimental in nature. Beneficial aspects get incorporated as time goes by, and more avant-garde elements get worked on some more.

Quote this comment

pixy Posted…

I don't think so. I don't think 3-column layouts are used because they are the best. I think the are used just because they are used. Just because everyone uses them - and if anyone else creates new site, he just uses the same he sees everywhere around. 3-column layout is the rote, not the beau ideal. Indeed, that's only my belief. My firm belief.

Quote this comment

Iolaire McFadden Posted…

I support the argument that the gurus should be creative show how to do more. Additionally I would like to see more gurus have samples were the (commented) CSS is in the body of the document (like your example). This goes against what they are trying to teach but it is difficult for students of the art to figure out what does what when we have to sort through 1 base style sheet and one alternate out of six choices to figure out how something is done. There are wonderful designs in the CSS blog words, but a lot of them are difficult to reproduce, when in fact they should be very simple. Thanks, iolaire

Quote this comment

huphtur Posted…

pixy: (using IE6 here) when i click on "longer" in the middle col, some sort of grey bar appears underneath the side cols.

Quote this comment

pixy Posted…

huphtur: yes, it's only simple & stupid javascript to show various columns' heights. It's its fault, not the layout's. Further playing with it or window resize helps sometimes.

Quote this comment

Darrel Posted…

Pixy: So, show us some of these 'better layout' ideas and we'll help make them with CSS for you. I also wouldn't agree with you that columns aren't the best we can do. Often, for a lot of sites, that *is* the best/most logical page structure. Yes, it is the web. Yes, it's not print. But it is often text-based information and that--regardless of medium--is often best displayed in some sort of columnar fashion.

Quote this comment

Kyle Pero Posted…

Everyone has all made valid points about the NS4 browser, but clearly you are not developing e-commerce sites. Do any of you know how many users 5% of your total traffic can translate into? Approx. 3-4%, of the traffic on the majority of the sites that I have worked on, is NS4 users and that translates into hundreds of people for us. Imagine how many users 3% can translate into for major sites like amazon! Try telling a marketer that we are missing hundreds of possible sales because we want to implement some snazzy new way to do layouts. My job would be a lot easier if I could forget about the people out there using 6-year-old browsers. Unfortunately for me and the businesses I work for we can't AFFORD to cater to just the savvy users online.