What's current best practices for formatting web page?

Question

I haven't done any real web design in a few years, and I'm now tasked with creating a set of web pages that will need relatively complex (and exact) layouts. I've started exploring CSS, and while I'm starting to get an idea of how to use it, it doesn't really seem like the appropriate tool for the kind of layout I need.

The layout I need has a top, middle, and bottom section, and each of those sections is broken down into different areas. I need something that is kinda like:

35%, 35% (right justified), 15%, 15%

70%, 15%, 15%

70%, 15%, 15%

Percents are of browser width, and where the percentage of the column end is the same as the row above/below, the columns edges need to meet. Further, rows must be below each other, regardless of what content I put in them.

CSS seemed like it would do what I want, but then when I started trying for the complexity I needed, I couldn't get columns to match up, or rows flowed into other rows, etc.

What I really want is something like frames, where I can position elements exactly where I want them. Does that exist, or do I just fight with CSS?

Thanks,

Sean.

Answer 1

CSS can do pretty much anything you want, it is the defacto tool for positioning and styling elements on your web pages. I think you should look into position: absolute and float capabilities based on your description. The difficulty with it lies in getting consistent behavior/interpretations across browsers. Using a css-reset like YUI's is highly recommended to help with this. YUI also has javascript utilities that help normalize some CSS behavior (e.g. float and opacity) across browsers. YUI is by no means the only way of accomplishing these goals.

Answer 2

You could try using tables for the layout, but I would suggest using CSS and DIV elements. If you are going to use frames or tables you'll get in trouble later (probably). Also, CSS isn't that hard, just spend a bit time on learning it and maybe W3Schools, which have nice tutorials.

Answer 3

Remember using Tables as apposed to CSS will cause accessibility problems. This means that people with using accessibility to browse your site will have problems using screen readers.

I agree with some of the previous answers. Spend time getting to know CSS. When it is written correctly it means that your styles will be reuseable and easy to implement and change once you have done them. Trying to change styles that have been individualy coded on a number of pages will cause you headaches.

If your website is going to be complex then try and make sure you are making it as simple to maintain as possible and CSS will definately help you there.